diff options
| author | Matt A. Tobin <email@mattatobin.com> | 2016-10-16 19:34:53 -0400 |
|---|---|---|
| committer | Matt A. Tobin <email@mattatobin.com> | 2016-10-16 19:34:53 -0400 |
| commit | 81805ce3f63e2e4a799bd54f174083c58a9b5640 (patch) | |
| tree | 6e13374b213ac9b2ae74c25d8aac875faf71fdd0 /toolkit/devtools/styleinspector/test/browser_computedview_matched-selectors-toggle.js | |
| parent | 28c8da71bf521bb3ee76f27b8a241919e24b7cd5 (diff) | |
| download | palemoon-gre-81805ce3f63e2e4a799bd54f174083c58a9b5640.tar.gz | |
Move Mozilla DevTools to Platform - Part 3: Merge the browser/devtools and toolkit/devtools adjusting for directory collisions
Diffstat (limited to 'toolkit/devtools/styleinspector/test/browser_computedview_matched-selectors-toggle.js')
| -rw-r--r-- | toolkit/devtools/styleinspector/test/browser_computedview_matched-selectors-toggle.js | 108 |
1 files changed, 108 insertions, 0 deletions
diff --git a/toolkit/devtools/styleinspector/test/browser_computedview_matched-selectors-toggle.js b/toolkit/devtools/styleinspector/test/browser_computedview_matched-selectors-toggle.js new file mode 100644 index 000000000..7238b315b --- /dev/null +++ b/toolkit/devtools/styleinspector/test/browser_computedview_matched-selectors-toggle.js @@ -0,0 +1,108 @@ +/* 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 the computed view properties can be expanded and collapsed with +// either the twisty or by dbl-clicking on the container + +const TEST_URL = "data:text/html;charset=utf-8," + encodeURIComponent([ + '<html>' + + '<head>' + + ' <title>Computed view toggling test</title>', + ' <style type="text/css"> ', + ' html { color: #000000; font-size: 15pt; } ', + ' h1 { color: red; } ', + ' </style>', + '</head>', + '<body>', + ' <h1>Some header text</h1>', + '</body>', + '</html>' +].join("\n")); + +add_task(function*() { + yield addTab(TEST_URL); + let {toolbox, inspector, view} = yield openComputedView(); + + info("Selecting the test node"); + yield selectNode("h1", inspector); + + yield testExpandOnTwistyClick(view, inspector); + yield testCollapseOnTwistyClick(view, inspector); + yield testExpandOnDblClick(view, inspector); + yield testCollapseOnDblClick(view, inspector); +}); + +function* testExpandOnTwistyClick({styleDocument, styleWindow}, inspector) { + info("Testing that a property expands on twisty click"); + + info("Getting twisty element"); + let twisty = styleDocument.querySelector(".expandable"); + ok(twisty, "Twisty found"); + + let onExpand = inspector.once("computed-view-property-expanded"); + info("Clicking on the twisty element"); + twisty.click(); + + yield onExpand; + + // Expanded means the matchedselectors div is not empty + let div = styleDocument.querySelector(".property-content .matchedselectors"); + ok(div.childNodes.length > 0, "Matched selectors are expanded on twisty click"); +} + +function* testCollapseOnTwistyClick({styleDocument, styleWindow}, inspector) { + info("Testing that a property collapses on twisty click"); + + info("Getting twisty element"); + let twisty = styleDocument.querySelector(".expandable"); + ok(twisty, "Twisty found"); + + let onCollapse = inspector.once("computed-view-property-collapsed"); + info("Clicking on the twisty element"); + twisty.click(); + + yield onCollapse; + + // Collapsed means the matchedselectors div is empty + let div = styleDocument.querySelector(".property-content .matchedselectors"); + ok(div.childNodes.length === 0, "Matched selectors are collapsed on twisty click"); +} + +function* testExpandOnDblClick({styleDocument, styleWindow}, inspector) { + info("Testing that a property expands on container dbl-click"); + + info("Getting computed property container"); + let container = styleDocument.querySelector(".property-view"); + ok(container, "Container found"); + + let onExpand = inspector.once("computed-view-property-expanded"); + info("Dbl-clicking on the container"); + EventUtils.synthesizeMouseAtCenter(container, {clickCount: 2}, styleWindow); + + yield onExpand; + + // Expanded means the matchedselectors div is not empty + let div = styleDocument.querySelector(".property-content .matchedselectors"); + ok(div.childNodes.length > 0, "Matched selectors are expanded on dblclick"); +} + +function* testCollapseOnDblClick({styleDocument, styleWindow}, inspector) { + info("Testing that a property collapses on container dbl-click"); + + info("Getting computed property container"); + let container = styleDocument.querySelector(".property-view"); + ok(container, "Container found"); + + let onCollapse = inspector.once("computed-view-property-collapsed"); + info("Dbl-clicking on the container"); + EventUtils.synthesizeMouseAtCenter(container, {clickCount: 2}, styleWindow); + + yield onCollapse; + + // Collapsed means the matchedselectors div is empty + let div = styleDocument.querySelector(".property-content .matchedselectors"); + ok(div.childNodes.length === 0, "Matched selectors are collapsed on dblclick"); +} |