The Tor Browser / file comparison
comparison: browser/devtools/styleinspector/test/browser_styleinspector_tooltip-shorthand-fontfamily.js
browser/devtools/styleinspector/test/browser_styleinspector_tooltip-shorthand-fontfamily.js
- changeset 0
- 6474c204b198
equal
deleted
inserted
replaced
| -1:000000000000 | 0:33330dbca129 |
|---|---|
| 1 /* vim: set ft=javascript ts=2 et sw=2 tw=80: */ | |
| 2 /* Any copyright is dedicated to the Public Domain. | |
| 3 http://creativecommons.org/publicdomain/zero/1.0/ */ | |
| 4 | |
| 5 "use strict"; | |
| 6 | |
| 7 // Test the fontfamily tooltip on shorthand properties | |
| 8 | |
| 9 const PAGE_CONTENT = [ | |
| 10 '<style type="text/css">', | |
| 11 ' #testElement {', | |
| 12 ' font: italic bold .8em/1.2 Arial;', | |
| 13 ' }', | |
| 14 '</style>', | |
| 15 '<div id="testElement">test element</div>' | |
| 16 ].join("\n"); | |
| 17 | |
| 18 let test = asyncTest(function*() { | |
| 19 yield addTab("data:text/html;charset=utf-8,font family shorthand tooltip test"); | |
| 20 | |
| 21 info("Creating the test document"); | |
| 22 content.document.body.innerHTML = PAGE_CONTENT; | |
| 23 | |
| 24 info("Opening the rule view"); | |
| 25 let {toolbox, inspector, view} = yield openRuleView(); | |
| 26 | |
| 27 info("Selecting the test node"); | |
| 28 yield selectNode("#testElement", inspector); | |
| 29 | |
| 30 yield testRuleView(view); | |
| 31 | |
| 32 info("Opening the computed view"); | |
| 33 let {toolbox, inspector, view} = yield openComputedView(); | |
| 34 | |
| 35 yield testComputedView(view); | |
| 36 }); | |
| 37 | |
| 38 function* testRuleView(ruleView) { | |
| 39 info("Testing font-family tooltips in the rule view"); | |
| 40 | |
| 41 let panel = ruleView.previewTooltip.panel; | |
| 42 | |
| 43 // Check that the rule view has a tooltip and that a XUL panel has been created | |
| 44 ok(ruleView.previewTooltip, "Tooltip instance exists"); | |
| 45 ok(panel, "XUL panel exists"); | |
| 46 | |
| 47 // Get the computed font family property inside the font rule view | |
| 48 let propertyList = ruleView.element.querySelectorAll(".ruleview-propertylist"); | |
| 49 let fontExpander = propertyList[1].querySelectorAll(".ruleview-expander")[0]; | |
| 50 fontExpander.click(); | |
| 51 | |
| 52 let rule = getRuleViewRule(ruleView, "#testElement"); | |
| 53 let valueSpan = rule.querySelector(".ruleview-computed .ruleview-propertyvalue"); | |
| 54 | |
| 55 // And verify that the tooltip gets shown on this property | |
| 56 yield assertHoverTooltipOn(ruleView.previewTooltip, valueSpan); | |
| 57 | |
| 58 let description = panel.getElementsByTagName("description")[0]; | |
| 59 is(description.style.fontFamily, "Arial", "Tooltips contains correct font-family style"); | |
| 60 } | |
| 61 | |
| 62 function* testComputedView(computedView) { | |
| 63 info("Testing font-family tooltips in the computed view"); | |
| 64 | |
| 65 let panel = computedView.tooltip.panel; | |
| 66 let {valueSpan} = getComputedViewProperty(computedView, "font-family"); | |
| 67 | |
| 68 yield assertHoverTooltipOn(computedView.tooltip, valueSpan); | |
| 69 | |
| 70 let description = panel.getElementsByTagName("description")[0]; | |
| 71 is(description.style.fontFamily, "Arial", "Tooltips contains correct font-family style"); | |
| 72 } |
