Add m-esr52 at 52.6.0

1 files changed, 60 insertions, 0 deletions

diff --git a/devtools/client/inspector/markup/test/browser_markup_image_tooltip.js b/devtools/client/inspector/markup/test/browser_markup_image_tooltip.js
new file mode 100644
index 000000000..7b1611acd
--- /dev/null
+++ b/devtools/client/inspector/markup/test/browser_markup_image_tooltip.js
@@ -0,0 +1,60 @@
+/* vim: set ts=2 et sw=2 tw=80: */
+/* Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/ */
+"use strict";
+
+// Test that image preview tooltips are shown on img and canvas tags in the
+// markup-view and that the tooltip actually contains an image and shows the
+// right dimension label
+
+const TEST_NODES = [
+  {selector: "img.local", size: "192" + " \u00D7 " + "192"},
+  {selector: "img.data", size: "64" + " \u00D7 " + "64"},
+  {selector: "img.remote", size: "22" + " \u00D7 " + "23"},
+  {selector: ".canvas", size: "600" + " \u00D7 " + "600"}
+];
+
+add_task(function* () {
+  yield addTab(URL_ROOT + "doc_markup_image_and_canvas_2.html");
+  let {inspector} = yield openInspector();
+
+  info("Selecting the first <img> tag");
+  yield selectNode("img", inspector);
+
+  for (let testNode of TEST_NODES) {
+    let target = yield getImageTooltipTarget(testNode, inspector);
+    yield assertTooltipShownOn(target, inspector);
+    checkImageTooltip(testNode, inspector);
+  }
+});
+
+function* getImageTooltipTarget({selector}, inspector) {
+  let nodeFront = yield getNodeFront(selector, inspector);
+  let isImg = nodeFront.tagName.toLowerCase() === "img";
+
+  let container = getContainerForNodeFront(nodeFront, inspector);
+
+  let target = container.editor.tag;
+  if (isImg) {
+    target = container.editor.getAttributeElement("src").querySelector(".link");
+  }
+  return target;
+}
+
+function* assertTooltipShownOn(element, {markup}) {
+  info("Is the element a valid hover target");
+  let isValid = yield isHoverTooltipTarget(markup.imagePreviewTooltip, element);
+  ok(isValid, "The element is a valid hover target for the image tooltip");
+}
+
+function checkImageTooltip({selector, size}, {markup}) {
+  let panel = markup.imagePreviewTooltip.panel;
+  let images = panel.getElementsByTagName("img");
+  is(images.length, 1, "Tooltip for [" + selector + "] contains an image");
+
+  let label = panel.querySelector(".devtools-tooltip-caption");
+  is(label.textContent, size,
+     "Tooltip label for [" + selector + "] displays the right image size");
+
+  markup.imagePreviewTooltip.hide();
+}