--- a/devtools/client/inspector/markup/test/browser_markup_dragdrop_tooltip.js
+++ b/devtools/client/inspector/markup/test/browser_markup_dragdrop_tooltip.js
@@ -11,25 +11,25 @@ add_task(function* () {
   let {inspector} = yield openInspectorForURL(TEST_URL);
   let {markup} = inspector;
 
   info("Get the tooltip target element for the image's src attribute");
   let img = yield getContainerForSelector("img", inspector);
   let target = img.editor.getAttributeElement("src").querySelector(".link");
 
   info("Check that the src attribute of the image is a valid tooltip target");
-  let isValid = yield isHoverTooltipTarget(markup.imagePreviewTooltip, target);
-  ok(isValid, "The element is a valid tooltip target");
+  yield assertTooltipShownOnHover(markup.imagePreviewTooltip, target);
+  yield assertTooltipHiddenOnMouseOut(markup.imagePreviewTooltip, target);
 
   info("Start dragging the test div");
   yield simulateNodeDrag(inspector, "div");
 
   info("Now check that the src attribute of the image isn't a valid target");
-  isValid = yield isHoverTooltipTarget(markup.imagePreviewTooltip, target);
+  let isValid = yield markup.imagePreviewTooltip._toggle.isValidHoverTarget(target);
   ok(!isValid, "The element is not a valid tooltip target");
 
   info("Stop dragging the test div");
   yield simulateNodeDrop(inspector, "div");
 
   info("Check again the src attribute of the image");
-  isValid = yield isHoverTooltipTarget(markup.imagePreviewTooltip, target);
-  ok(isValid, "The element is a valid tooltip target");
+  yield assertTooltipShownOnHover(markup.imagePreviewTooltip, target);
+  yield assertTooltipHiddenOnMouseOut(markup.imagePreviewTooltip, target);
 });

--- a/devtools/client/inspector/markup/test/browser_markup_image_tooltip.js
+++ b/devtools/client/inspector/markup/test/browser_markup_image_tooltip.js
@@ -18,40 +18,35 @@ 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);
+    yield assertTooltipShownOnHover(inspector.markup.imagePreviewTooltip, target);
     checkImageTooltip(testNode, inspector);
+    yield assertTooltipHiddenOnMouseOut(inspector.markup.imagePreviewTooltip, target);
   }
 });
 
 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");

--- a/devtools/client/inspector/markup/test/browser_markup_image_tooltip_mutations.js
+++ b/devtools/client/inspector/markup/test/browser_markup_image_tooltip_mutations.js
@@ -32,31 +32,35 @@ add_task(function* () {
   let container = getContainerForNodeFront(img, inspector);
   ok(container, "Found markup container for the image.");
 
   let target = container.editor.getAttributeElement("src")
                                .querySelector(".link");
   ok(target, "Found the src attribute in the markup view.");
 
   info("Showing tooltip on the src link.");
-  yield isHoverTooltipTarget(inspector.markup.imagePreviewTooltip, target);
+  yield assertTooltipShownOnHover(inspector.markup.imagePreviewTooltip, target);
 
   checkImageTooltip(INITIAL_SRC_SIZE, inspector);
 
+  yield assertTooltipHiddenOnMouseOut(inspector.markup.imagePreviewTooltip, target);
+
   info("Updating the image src.");
   yield updateImageSrc(img, UPDATED_SRC, inspector);
 
   target = container.editor.getAttributeElement("src").querySelector(".link");
   ok(target, "Found the src attribute in the markup view after mutation.");
 
   info("Showing tooltip on the src link.");
-  yield isHoverTooltipTarget(inspector.markup.imagePreviewTooltip, target);
+  yield assertTooltipShownOnHover(inspector.markup.imagePreviewTooltip, target);
 
   info("Checking that the new image was shown.");
   checkImageTooltip(UPDATED_SRC_SIZE, inspector);
+
+  yield assertTooltipHiddenOnMouseOut(inspector.markup.imagePreviewTooltip, target);
 });
 
 /**
  * Updates the src attribute of the image. Return a Promise.
  */
 function updateImageSrc(img, newSrc, inspector) {
   let onMutated = inspector.once("markupmutation");
   let onModified = img.modifyAttributes([{

--- a/devtools/client/inspector/rules/test/browser_rules_colorpicker-and-image-tooltip_01.js
+++ b/devtools/client/inspector/rules/test/browser_rules_colorpicker-and-image-tooltip_01.js
@@ -22,21 +22,19 @@ add_task(function* () {
   let {view} = yield openRuleView();
   let value = getRuleViewProperty(view, "body", "background").valueSpan;
   let swatch = value.querySelectorAll(".ruleview-colorswatch")[0];
   let url = value.querySelector(".theme-link");
   yield testImageTooltipAfterColorChange(swatch, url, view);
 });
 
 function* testImageTooltipAfterColorChange(swatch, url, ruleView) {
-  let previewTooltip = ruleView.tooltips.getTooltip("previewTooltip");
   info("First, verify that the image preview tooltip works");
-  let anchor = yield isHoverTooltipTarget(previewTooltip, url);
-  ok(anchor, "The image preview tooltip is shown on the url span");
-  is(anchor, url, "The anchor returned by the showOnHover callback is correct");
+  let previewTooltip = yield assertShowPreviewTooltip(ruleView, url);
+  yield assertTooltipHiddenOnMouseOut(previewTooltip, url);
 
   info("Open the color picker tooltip and change the color");
   let picker = ruleView.tooltips.getTooltip("colorPicker");
   let onColorPickerReady = picker.once("ready");
   swatch.click();
   yield onColorPickerReady;
 
   yield simulateColorPickerChange(ruleView, picker, [0, 0, 0, 1], {
@@ -52,12 +50,12 @@ function* testImageTooltipAfterColorChan
   yield onHidden;
   yield onModifications;
 
   info("Verify again that the image preview tooltip works");
   // After a color change, the property is re-populated, we need to get the new
   // dom node
   url = getRuleViewProperty(ruleView, "body", "background").valueSpan
     .querySelector(".theme-link");
-  anchor = yield isHoverTooltipTarget(previewTooltip, url);
-  ok(anchor, "The image preview tooltip is shown on the url span");
-  is(anchor, url, "The anchor returned by the showOnHover callback is correct");
+  previewTooltip = yield assertShowPreviewTooltip(ruleView, url);
+
+  yield assertTooltipHiddenOnMouseOut(previewTooltip, url);
 }

--- a/devtools/client/inspector/rules/test/browser_rules_colorpicker-and-image-tooltip_02.js
+++ b/devtools/client/inspector/rules/test/browser_rules_colorpicker-and-image-tooltip_02.js
@@ -48,20 +48,18 @@ function* testColorChangeIsntRevertedWhe
   let onHidden = picker.tooltip.once("hidden");
   focusAndSendKey(spectrum.element.ownerDocument.defaultView, "RETURN");
   yield onHidden;
   yield onModifications;
 
   info("Open the image preview tooltip");
   let value = getRuleViewProperty(ruleView, "body", "background").valueSpan;
   let url = value.querySelector(".theme-link");
-  let previewTooltip = ruleView.tooltips.getTooltip("previewTooltip");
-  let onShown = previewTooltip.once("shown");
-  let anchor = yield isHoverTooltipTarget(previewTooltip, url);
-  previewTooltip.show(anchor);
-  yield onShown;
+  let previewTooltip = yield assertShowPreviewTooltip(ruleView, url);
 
   info("Image tooltip is shown, verify that the swatch is still correct");
   swatch = value.querySelector(".ruleview-colorswatch");
   is(swatch.style.backgroundColor, "black",
     "The swatch's color is correct");
   is(swatch.nextSibling.textContent, "black", "The color name is correct");
+
+  yield assertTooltipHiddenOnMouseOut(previewTooltip, url);
 }

--- a/devtools/client/inspector/rules/test/browser_rules_colorpicker-hides-on-tooltip.js
+++ b/devtools/client/inspector/rules/test/browser_rules_colorpicker-hides-on-tooltip.js
@@ -33,14 +33,16 @@ add_task(function* () {
   let onColorPickerReady = colorPicker.once("ready");
   swatch.click();
   yield onColorPickerReady;
 
   info("Now showing the image preview tooltip to hide the color picker");
   let onHidden = colorPicker.tooltip.once("hidden");
   // Hiding the color picker refreshes the value.
   let onRuleViewChanged = view.once("ruleview-changed");
-  yield assertHoverTooltipOn(view.tooltips.getTooltip("previewTooltip"), uriSpan);
+  let previewTooltip = yield assertShowPreviewTooltip(view, uriSpan);
   yield onHidden;
   yield onRuleViewChanged;
 
+  yield assertTooltipHiddenOnMouseOut(previewTooltip, uriSpan);
+
   ok(true, "The color picker closed when the image preview tooltip appeared");
 });

--- a/devtools/client/inspector/shared/test/browser_styleinspector_tooltip-background-image.js
+++ b/devtools/client/inspector/shared/test/browser_styleinspector_tooltip-background-image.js
@@ -47,79 +47,77 @@ add_task(function* () {
   yield onComputedViewReady;
 
   info("Testing that the background-image computed style has a tooltip too");
   yield testComputedView(view);
 });
 
 function* testBodyRuleView(view) {
   info("Testing tooltips in the rule view");
-  let panel = view.tooltips.getTooltip("previewTooltip").panel;
-
-  // Check that the rule view has a tooltip and that a XUL panel has
-  // been created
-  ok(view.tooltips.getTooltip("previewTooltip"), "Tooltip instance exists");
-  ok(panel, "XUL panel exists");
 
   // Get the background-image property inside the rule view
   let {valueSpan} = getRuleViewProperty(view, "body", "background-image");
   let uriSpan = valueSpan.querySelector(".theme-link");
 
-  yield assertHoverTooltipOn(view.tooltips.getTooltip("previewTooltip"), uriSpan);
+  let previewTooltip = yield assertShowPreviewTooltip(view, uriSpan);
 
-  let images = panel.getElementsByTagName("img");
+  let images = previewTooltip.panel.getElementsByTagName("img");
   is(images.length, 1, "Tooltip contains an image");
   ok(images[0].getAttribute("src")
     .indexOf("iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHe") !== -1,
     "The image URL seems fine");
+
+  yield assertTooltipHiddenOnMouseOut(previewTooltip, uriSpan);
 }
 
 function* testDivRuleView(view) {
-  let panel = view.tooltips.getTooltip("previewTooltip").panel;
-
   // Get the background property inside the rule view
   let {valueSpan} = getRuleViewProperty(view, ".test-element", "background");
   let uriSpan = valueSpan.querySelector(".theme-link");
 
-  yield assertHoverTooltipOn(view.tooltips.getTooltip("previewTooltip"), uriSpan);
+  let previewTooltip = yield assertShowPreviewTooltip(view, uriSpan);
 
-  let images = panel.getElementsByTagName("img");
+  let images = previewTooltip.panel.getElementsByTagName("img");
   is(images.length, 1, "Tooltip contains an image");
   ok(images[0].getAttribute("src").startsWith("data:"),
     "Tooltip contains a data-uri image as expected");
+
+  yield assertTooltipHiddenOnMouseOut(previewTooltip, uriSpan);
 }
 
 function* testTooltipAppearsEvenInEditMode(view) {
   info("Switching to edit mode in the rule view");
   let editor = yield turnToEditMode(view);
 
   info("Now trying to show the preview tooltip");
   let {valueSpan} = getRuleViewProperty(view, ".test-element", "background");
   let uriSpan = valueSpan.querySelector(".theme-link");
-  yield assertHoverTooltipOn(view.tooltips.getTooltip("previewTooltip"), uriSpan);
+
+  let previewTooltip = yield assertShowPreviewTooltip(view, uriSpan);
 
   is(view.styleDocument.activeElement, editor.input,
     "Tooltip was shown in edit mode, and inplace-editor still focused");
+
+  yield assertTooltipHiddenOnMouseOut(previewTooltip, uriSpan);
 }
 
 function turnToEditMode(ruleView) {
   let brace = ruleView.styleDocument.querySelector(".ruleview-ruleclose");
   return focusEditableField(ruleView, brace);
 }
 
 function* testComputedView(view) {
-  let tooltip = view.tooltips.getTooltip("previewTooltip");
-  ok(tooltip, "The computed-view has a tooltip defined");
-
-  let panel = tooltip.panel;
-  ok(panel, "The computed-view tooltip has a XUL panel");
-
   let {valueSpan} = getComputedViewProperty(view, "background-image");
   let uriSpan = valueSpan.querySelector(".theme-link");
 
-  yield assertHoverTooltipOn(view.tooltips.getTooltip("previewTooltip"), uriSpan);
+  // Scroll to ensure the line is visible as we see the box model by default
+  valueSpan.scrollIntoView();
 
-  let images = panel.getElementsByTagName("img");
+  let previewTooltip = yield assertShowPreviewTooltip(view, uriSpan);
+
+  let images = previewTooltip.panel.getElementsByTagName("img");
   is(images.length, 1, "Tooltip contains an image");
 
   ok(images[0].getAttribute("src").startsWith("data:"),
     "Tooltip contains a data-uri in the computed-view too");
+
+  yield assertTooltipHiddenOnMouseOut(previewTooltip, uriSpan);
 }

--- a/devtools/client/inspector/shared/test/browser_styleinspector_tooltip-longhand-fontfamily.js
+++ b/devtools/client/inspector/shared/test/browser_styleinspector_tooltip-longhand-fontfamily.js
@@ -44,45 +44,49 @@ function* testRuleView(ruleView, nodeFro
   ok(tooltip, "Tooltip instance exists");
   ok(panel, "XUL panel exists");
 
   // Get the font family property inside the rule view
   let {valueSpan} = getRuleViewProperty(ruleView, "#testElement",
     "font-family");
 
   // And verify that the tooltip gets shown on this property
-  yield assertHoverTooltipOn(tooltip, valueSpan);
+  let previewTooltip = yield assertShowPreviewTooltip(ruleView, valueSpan);
 
   let images = panel.getElementsByTagName("img");
   is(images.length, 1, "Tooltip contains an image");
   ok(images[0].getAttribute("src").startsWith("data:"),
     "Tooltip contains a data-uri image as expected");
 
   let dataURL = yield getFontFamilyDataURL(valueSpan.textContent, nodeFront);
   is(images[0].getAttribute("src"), dataURL,
     "Tooltip contains the correct data-uri image");
+
+  yield assertTooltipHiddenOnMouseOut(previewTooltip, valueSpan);
 }
 
 function* testComputedView(computedView, nodeFront) {
   info("Testing font-family tooltips in the computed view");
 
   let tooltip = computedView.tooltips.getTooltip("previewTooltip");
   let panel = tooltip.panel;
   let {valueSpan} = getComputedViewProperty(computedView, "font-family");
 
-  yield assertHoverTooltipOn(tooltip, valueSpan);
+  let previewTooltip = yield assertShowPreviewTooltip(computedView, valueSpan);
 
   let images = panel.getElementsByTagName("img");
   is(images.length, 1, "Tooltip contains an image");
   ok(images[0].getAttribute("src").startsWith("data:"),
     "Tooltip contains a data-uri image as expected");
 
   let dataURL = yield getFontFamilyDataURL(valueSpan.textContent, nodeFront);
   is(images[0].getAttribute("src"), dataURL,
     "Tooltip contains the correct data-uri image");
+
+  yield assertTooltipHiddenOnMouseOut(previewTooltip, valueSpan);
 }
 
 function* testExpandedComputedViewProperty(computedView, nodeFront) {
   info("Testing font-family tooltips in expanded properties of the " +
     "computed view");
 
   info("Expanding the font-family property to reveal matched selectors");
   let propertyView = getPropertyView(computedView, "font-family");
@@ -90,26 +94,28 @@ function* testExpandedComputedViewProper
   yield propertyView.refreshMatchedSelectors();
 
   let valueSpan = propertyView.matchedSelectorsContainer
     .querySelector(".bestmatch .other-property-value");
 
   let tooltip = computedView.tooltips.getTooltip("previewTooltip");
   let panel = tooltip.panel;
 
-  yield assertHoverTooltipOn(tooltip, valueSpan);
+  let previewTooltip = yield assertShowPreviewTooltip(computedView, valueSpan);
 
   let images = panel.getElementsByTagName("img");
   is(images.length, 1, "Tooltip contains an image");
   ok(images[0].getAttribute("src").startsWith("data:"),
     "Tooltip contains a data-uri image as expected");
 
   let dataURL = yield getFontFamilyDataURL(valueSpan.textContent, nodeFront);
   is(images[0].getAttribute("src"), dataURL,
     "Tooltip contains the correct data-uri image");
+
+  yield assertTooltipHiddenOnMouseOut(previewTooltip, valueSpan);
 }
 
 function getPropertyView(computedView, name) {
   let propertyView = null;
   computedView.propertyViews.some(function (view) {
     if (view.name == name) {
       propertyView = view;
       return true;

--- a/devtools/client/inspector/shared/test/browser_styleinspector_tooltip-multiple-background-images.js
+++ b/devtools/client/inspector/shared/test/browser_styleinspector_tooltip-multiple-background-images.js
@@ -46,18 +46,22 @@ function* testComputedViewUrls(inspector
 function* performChecks(view, propertyValue) {
   function checkTooltip(panel, imageSrc) {
     let images = panel.getElementsByTagName("img");
     is(images.length, 1, "Tooltip contains an image");
     is(images[0].getAttribute("src"), imageSrc, "The image URL is correct");
   }
 
   let links = propertyValue.querySelectorAll(".theme-link");
-  let panel = view.tooltips.getTooltip("previewTooltip").panel;
 
   info("Checking first link tooltip");
-  yield assertHoverTooltipOn(view.tooltips.getTooltip("previewTooltip"), links[0]);
+  let previewTooltip = yield assertShowPreviewTooltip(view, links[0]);
+  let panel = view.tooltips.getTooltip("previewTooltip").panel;
   checkTooltip(panel, YELLOW_DOT);
 
+  yield assertTooltipHiddenOnMouseOut(previewTooltip, links[0]);
+
   info("Checking second link tooltip");
-  yield assertHoverTooltipOn(view.tooltips.getTooltip("previewTooltip"), links[1]);
+  previewTooltip = yield assertShowPreviewTooltip(view, links[1]);
   checkTooltip(panel, BLUE_DOT);
+
+  yield assertTooltipHiddenOnMouseOut(previewTooltip, links[1]);
 }

--- a/devtools/client/inspector/shared/test/browser_styleinspector_tooltip-shorthand-fontfamily.js
+++ b/devtools/client/inspector/shared/test/browser_styleinspector_tooltip-shorthand-fontfamily.js
@@ -40,19 +40,21 @@ function* testRuleView(ruleView, nodeFro
   let fontExpander = propertyList[1].querySelectorAll(".ruleview-expander")[0];
   fontExpander.click();
 
   let rule = getRuleViewRule(ruleView, "#testElement");
   let valueSpan = rule
     .querySelector(".ruleview-computed .ruleview-propertyvalue");
 
   // And verify that the tooltip gets shown on this property
-  yield assertHoverTooltipOn(tooltip, valueSpan);
+  let previewTooltip = yield assertShowPreviewTooltip(ruleView, valueSpan);
 
   let images = panel.getElementsByTagName("img");
   is(images.length, 1, "Tooltip contains an image");
   ok(images[0].getAttribute("src")
     .startsWith("data:"), "Tooltip contains a data-uri image as expected");
 
   let dataURL = yield getFontFamilyDataURL(valueSpan.textContent, nodeFront);
   is(images[0].getAttribute("src"), dataURL,
     "Tooltip contains the correct data-uri image");
+
+  yield assertTooltipHiddenOnMouseOut(previewTooltip, valueSpan);
 }

--- a/devtools/client/inspector/shared/test/browser_styleinspector_tooltip-size.js
+++ b/devtools/client/inspector/shared/test/browser_styleinspector_tooltip-size.js
@@ -30,36 +30,29 @@ function* testImageDimension(ruleView) {
 
   let tooltip = ruleView.tooltips.getTooltip("previewTooltip");
   let panel = tooltip.panel;
   let {valueSpan} = getRuleViewProperty(ruleView, "div", "background");
   let uriSpan = valueSpan.querySelector(".theme-link");
 
   // Make sure there is a hover tooltip for this property, this also will fill
   // the tooltip with its content
-  yield assertHoverTooltipOn(tooltip, uriSpan);
-
-  info("Showing the tooltip");
-  let onShown = tooltip.once("shown");
-  tooltip.show(uriSpan);
-  yield onShown;
+  let previewTooltip = yield assertShowPreviewTooltip(ruleView, uriSpan);
 
   // Let's not test for a specific size, but instead let's make sure it's at
   // least as big as the image
   let imageRect = panel.querySelector("img").getBoundingClientRect();
   let panelRect = panel.getBoundingClientRect();
 
   ok(panelRect.width >= imageRect.width,
     "The panel is wide enough to show the image");
   ok(panelRect.height >= imageRect.height,
     "The panel is high enough to show the image");
 
-  let onHidden = tooltip.once("hidden");
-  tooltip.hide();
-  yield onHidden;
+  yield assertTooltipHiddenOnMouseOut(previewTooltip, uriSpan);
 }
 
 function* testPickerDimension(ruleView) {
   info("Testing color-picker tooltip dimensions");
 
   let {valueSpan} = getRuleViewProperty(ruleView, "div", "background");
   let swatch = valueSpan.querySelector(".ruleview-colorswatch");
   let cPicker = ruleView.tooltips.getTooltip("colorPicker");

--- a/devtools/client/inspector/test/head.js
+++ b/devtools/client/inspector/test/head.js
@@ -639,43 +639,93 @@ var waitForTab = Task.async(function* ()
  */
 function synthesizeKeys(input, win) {
   for (let key of input.split("")) {
     EventUtils.synthesizeKey(key, {}, win);
   }
 }
 
 /**
- * Given a tooltip object instance (see Tooltip.js), checks if it is set to
- * toggle and hover and if so, checks if the given target is a valid hover
- * target. This won't actually show the tooltip (the less we interact with XUL
- * panels during test runs, the better).
+ * Given a Tooltip instance, fake a mouse event on the `target` DOM Element
+ * and assert that the `tooltip` is correctly displayed.
  *
- * @return a promise that resolves when the answer is known
+ * @param {Tooltip} tooltip
+ *        The tooltip instance
+ * @param {DOMElement} target
+ *        The DOM Element on which a tooltip should appear
+ *
+ * @return a promise that resolves with the tooltip object
  */
-function isHoverTooltipTarget(tooltip, target) {
-  if (!tooltip._toggle._baseNode || !tooltip.panel) {
-    return promise.reject(new Error(
-      "The tooltip passed isn't set to toggle on hover or is not a tooltip"));
+function* assertTooltipShownOnHover(tooltip, target) {
+  let mouseEvent = new target.ownerDocument.defaultView.MouseEvent("mousemove", {
+    bubbles: true,
+  });
+  target.dispatchEvent(mouseEvent);
+
+  if (!tooltip.isVisible()) {
+    info("Waiting for tooltip to be shown");
+    yield tooltip.once("shown");
   }
-  return tooltip._toggle.isValidHoverTarget(target);
+
+  ok(tooltip.isVisible(), `The tooltip is visible`);
+
+  return tooltip;
 }
 
 /**
- * Same as isHoverTooltipTarget except that it will fail the test if there is no
- * tooltip defined on hover of the given element
+ * Given an inspector `view` object, fake a mouse event on the `target` DOM
+ * Element and assert that the preview tooltip  is correctly displayed.
  *
- * @return a promise
+ * @param {CssRuleView|ComputedView|...} view
+ *        The instance of an inspector panel
+ * @param {DOMElement} target
+ *        The DOM Element on which a tooltip should appear
+ *
+ * @return a promise that resolves with the tooltip object
  */
-function assertHoverTooltipOn(tooltip, element) {
-  return isHoverTooltipTarget(tooltip, element).then(() => {
-    ok(true, "A tooltip is defined on hover of the given element");
-  }, () => {
-    ok(false, "No tooltip is defined on hover of the given element");
+function* assertShowPreviewTooltip(view, target) {
+  let mouseEvent = new target.ownerDocument.defaultView.MouseEvent("mousemove", {
+    bubbles: true,
   });
+  target.dispatchEvent(mouseEvent);
+
+  let name = "previewTooltip";
+  ok(view.tooltips._instances.has(name),
+    `Tooltip '${name}' has been instanciated`);
+  let tooltip = view.tooltips.getTooltip(name);
+
+  if (!tooltip.isVisible()) {
+    info("Waiting for tooltip to be shown");
+    yield tooltip.once("shown");
+  }
+
+  ok(tooltip.isVisible(), `The tooltip '${name}' is visible`);
+
+  return tooltip;
+}
+
+/**
+ * Given a `tooltip` instance, fake a mouse event on `target` DOM element
+ * and check that the tooltip correctly disappear.
+ *
+ * @param {Tooltip} tooltip
+ *        The tooltip instance
+ * @param {DOMElement} target
+ *        The DOM Element on which a tooltip should appear
+ */
+function* assertTooltipHiddenOnMouseOut(tooltip, target) {
+  let mouseEvent = new target.ownerDocument.defaultView.MouseEvent("mouseout", {
+    bubbles: true,
+    relatedTarget: target
+  });
+  target.dispatchEvent(mouseEvent);
+
+  yield tooltip.once("hidden");
+
+  ok(!tooltip.isVisible(), "The tooltip is hidden on mouseout");
 }
 
 /**
  * Open the inspector menu and return all of it's items in a flat array
  * @param {InspectorPanel} inspector
  * @param {Object} options to pass into openMenu
  * @return An array of MenuItems
  */