Bug 1342051 - add test for grid highlighter bug after reload;r=zer0
authorJulian Descottes <jdescottes@mozilla.com>
Mon, 27 Feb 2017 21:06:55 +0100
changeset 345257 a3859b017684597459fccd2648f4be46f72513d7
parent 345256 3f7919d071569b8b75dc2ff817178027d021ab0d
child 345258 f32a30e626416f963ac3bd6a08d4a71d8ea084ea
push id87555
push usercbook@mozilla.com
push dateWed, 01 Mar 2017 15:40:32 +0000
treeherdermozilla-inbound@33c9d4c02376 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerszer0
bugs1342051
milestone54.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1342051 - add test for grid highlighter bug after reload;r=zer0 MozReview-Commit-ID: 3ZqfxLgnJp0
devtools/client/inspector/rules/test/browser.ini
devtools/client/inspector/rules/test/browser_rules_grid-highlighter-on-reload.js
--- a/devtools/client/inspector/rules/test/browser.ini
+++ b/devtools/client/inspector/rules/test/browser.ini
@@ -139,16 +139,17 @@ skip-if = os == "mac" # Bug 1245996 : cl
 [browser_rules_editable-field-focus_01.js]
 [browser_rules_editable-field-focus_02.js]
 [browser_rules_eyedropper.js]
 [browser_rules_filtereditor-appears-on-swatch-click.js]
 [browser_rules_filtereditor-commit-on-ENTER.js]
 [browser_rules_filtereditor-revert-on-ESC.js]
 skip-if = (os == "win" && debug) # bug 963492: win.
 [browser_rules_grid-highlighter-on-navigate.js]
+[browser_rules_grid-highlighter-on-reload.js]
 [browser_rules_grid-toggle_01.js]
 [browser_rules_grid-toggle_01b.js]
 [browser_rules_grid-toggle_02.js]
 [browser_rules_grid-toggle_03.js]
 [browser_rules_guessIndentation.js]
 [browser_rules_inherited-properties_01.js]
 [browser_rules_inherited-properties_02.js]
 [browser_rules_inherited-properties_03.js]
new file mode 100644
--- /dev/null
+++ b/devtools/client/inspector/rules/test/browser_rules_grid-highlighter-on-reload.js
@@ -0,0 +1,53 @@
+/* vim: set ft=javascript 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 a grid highlighter showing grid gaps can be displayed after reloading the
+// page (Bug 1342051).
+
+const TEST_URI = `
+  <style type='text/css'>
+    #grid {
+      display: grid;
+      grid-gap: 10px;
+    }
+  </style>
+  <div id="grid">
+    <div id="cell1">cell1</div>
+    <div id="cell2">cell2</div>
+  </div>
+`;
+
+add_task(function* () {
+  yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
+
+  info("Check that the grid highlighter can be displayed");
+  yield checkGridHighlighter();
+
+  info("Close the toolbox before reloading the tab");
+  let target = TargetFactory.forTab(gBrowser.selectedTab);
+  yield gDevTools.closeToolbox(target);
+
+  refreshTab(gBrowser.selectedTab);
+
+  info("Check that the grid highlighter can be displayed after reloading the page");
+  yield checkGridHighlighter();
+});
+
+function* checkGridHighlighter() {
+  let {inspector, view} = yield openRuleView();
+  let {highlighters} = view;
+
+  yield selectNode("#grid", inspector);
+  let container = getRuleViewProperty(view, "#grid", "display").valueSpan;
+  let gridToggle = container.querySelector(".ruleview-grid");
+
+  info("Toggling ON the CSS grid highlighter from the rule-view.");
+  let onHighlighterShown = highlighters.once("grid-highlighter-shown");
+  gridToggle.click();
+  yield onHighlighterShown;
+
+  ok(highlighters.gridHighlighterShown, "CSS grid highlighter is shown.");
+}