browser/devtools/styleinspector/test/browser_computedview_style-editor-link.js@6474c204b198
browser/devtools/styleinspector/test/browser_computedview_style-editor-link.js
Wed, 31 Dec 2014 06:09:35 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Wed, 31 Dec 2014 06:09:35 +0100
- changeset 0
- 6474c204b198
- permissions
- -rw-r--r--
Cloned upstream origin tor-browser at tor-browser-31.3.0esr-4.5-1-build1
revision ID fc1c9ff7c1b2defdbc039f12214767608f46423f for hacking purpose.
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/ */
5 "use strict";
7 // Test the links from the computed view to the style editor
9 const STYLESHEET_URL = "data:text/css,"+encodeURIComponent(
10 [".highlight {",
11 "color: blue",
12 "}"].join("\n"));
14 const DOCUMENT_URL = "data:text/html,"+encodeURIComponent(
15 ['<html>' +
16 '<head>' +
17 '<title>Computed view style editor link test</title>',
18 '<style type="text/css"> ',
19 'html { color: #000000; } ',
20 'span { font-variant: small-caps; color: #000000; } ',
21 '.nomatches {color: #ff0000;}</style> <div id="first" style="margin: 10em; ',
22 'font-size: 14pt; font-family: helvetica, sans-serif; color: #AAA">',
23 '</style>',
24 '<link rel="stylesheet" type="text/css" href="'+STYLESHEET_URL+'">',
25 '</head>',
26 '<body>',
27 '<h1>Some header text</h1>',
28 '<p id="salutation" style="font-size: 12pt">hi.</p>',
29 '<p id="body" style="font-size: 12pt">I am a test-case. This text exists ',
30 'solely to provide some things to ',
31 '<span style="color: yellow" class="highlight">',
32 'highlight</span> and <span style="font-weight: bold">count</span> ',
33 'style list-items in the box at right. If you are reading this, ',
34 'you should go do something else instead. Maybe read a book. Or better ',
35 'yet, write some test-cases for another bit of code. ',
36 '<span style="font-style: italic">some text</span></p>',
37 '<p id="closing">more text</p>',
38 '<p>even more text</p>',
39 '</div>',
40 '</body>',
41 '</html>'].join("\n"));
43 let test = asyncTest(function*() {
44 yield addTab(DOCUMENT_URL);
46 info("Opening the computed-view");
47 let {toolbox, inspector, view} = yield openComputedView();
49 info("Selecting the test node");
50 yield selectNode("span", inspector);
52 yield testInlineStyle(view, inspector);
53 yield testInlineStyleSheet(view, toolbox);
54 yield testExternalStyleSheet(view, toolbox);
55 });
57 function* testInlineStyle(view, inspector) {
58 info("Testing inline style");
60 yield expandComputedViewPropertyByIndex(view, inspector, 0);
62 let onWindow = waitForWindow();
63 info("Clicking on the first rule-link in the computed-view");
64 let link = getComputedViewLinkByIndex(view, 0);
65 link.click();
67 let win = yield onWindow;
69 let windowType = win.document.documentElement.getAttribute("windowtype");
70 is(windowType, "navigator:view-source", "View source window is open");
71 info("Closing window");
72 win.close();
73 }
75 function* testInlineStyleSheet(view, toolbox) {
76 info("Testing inline stylesheet");
78 info("Listening for toolbox switch to the styleeditor");
79 let onSwitch = waitForStyleEditor(toolbox);
81 info("Clicking an inline stylesheet");
82 let link = getComputedViewLinkByIndex(view, 2);
83 link.click();
84 let editor = yield onSwitch;
86 ok(true, "Switched to the style-editor panel in the toolbox");
88 validateStyleEditorSheet(editor, 0);
89 }
91 function* testExternalStyleSheet(view, toolbox) {
92 info("Testing external stylesheet");
94 info("Waiting for the stylesheet editor to be selected");
95 let panel = toolbox.getCurrentPanel();
96 let onSelected = panel.UI.once("editor-selected");
98 info("Switching back to the inspector panel in the toolbox");
99 yield toolbox.selectTool("inspector");
101 info("Clicking on an external stylesheet link");
102 let link = getComputedViewLinkByIndex(view, 1);
103 link.click();
104 let editor = yield onSelected;
106 is(toolbox.currentToolId, "styleeditor", "The style editor is selected again");
107 validateStyleEditorSheet(editor, 1);
108 }
110 function validateStyleEditorSheet(editor, expectedSheetIndex) {
111 info("Validating style editor stylesheet");
112 let sheet = content.document.styleSheets[expectedSheetIndex];
113 is(editor.styleSheet.href, sheet.href, "loaded stylesheet matches document stylesheet");
114 }
