browser/devtools/styleinspector/test/browser_ruleview_edit-property-increments.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.

michael@0 1 /* vim: set ft=javascript ts=2 et sw=2 tw=80: */
michael@0 2 /* Any copyright is dedicated to the Public Domain.
michael@0 3 http://creativecommons.org/publicdomain/zero/1.0/ */
michael@0 4
michael@0 5 "use strict";
michael@0 6
michael@0 7 // Test that increasing/decreasing values in rule view using
michael@0 8 // arrow keys works correctly.
michael@0 9
michael@0 10 let test = asyncTest(function*() {
michael@0 11 yield addTab("data:text/html,sample document for bug 722691");
michael@0 12 createDocument();
michael@0 13 let {toolbox, inspector, view} = yield openRuleView();
michael@0 14
michael@0 15 yield selectNode("#test", inspector);
michael@0 16
michael@0 17 yield testMarginIncrements(view);
michael@0 18 yield testVariousUnitIncrements(view);
michael@0 19 yield testHexIncrements(view);
michael@0 20 yield testRgbIncrements(view);
michael@0 21 yield testShorthandIncrements(view);
michael@0 22 yield testOddCases(view);
michael@0 23 });
michael@0 24
michael@0 25 function createDocument() {
michael@0 26 content.document.body.innerHTML = '<div id="test" style="' +
michael@0 27 'margin-top:0px;' +
michael@0 28 'padding-top: 0px;' +
michael@0 29 'color:#000000;' +
michael@0 30 'background-color: #000000;" >'+
michael@0 31 '</div>';
michael@0 32 }
michael@0 33
michael@0 34 function* testMarginIncrements(view) {
michael@0 35 info("Testing keyboard increments on the margin property");
michael@0 36
michael@0 37 let idRuleEditor = view.element.children[0]._ruleEditor;
michael@0 38 let marginPropEditor = idRuleEditor.rule.textProps[0].editor;
michael@0 39
michael@0 40 yield runIncrementTest(marginPropEditor, view, {
michael@0 41 1: {alt: true, start: "0px", end: "0.1px", selectAll: true},
michael@0 42 2: {start: "0px", end: "1px", selectAll: true},
michael@0 43 3: {shift: true, start: "0px", end: "10px", selectAll: true},
michael@0 44 4: {down: true, alt: true, start: "0.1px", end: "0px", selectAll: true},
michael@0 45 5: {down: true, start: "0px", end: "-1px", selectAll: true},
michael@0 46 6: {down: true, shift: true, start: "0px", end: "-10px", selectAll: true},
michael@0 47 7: {pageUp: true, shift: true, start: "0px", end: "100px", selectAll: true},
michael@0 48 8: {pageDown: true, shift: true, start: "0px", end: "-100px", selectAll: true}
michael@0 49 });
michael@0 50 }
michael@0 51
michael@0 52 function* testVariousUnitIncrements(view) {
michael@0 53 info("Testing keyboard increments on values with various units");
michael@0 54
michael@0 55 let idRuleEditor = view.element.children[0]._ruleEditor;
michael@0 56 let paddingPropEditor = idRuleEditor.rule.textProps[1].editor;
michael@0 57
michael@0 58 yield runIncrementTest(paddingPropEditor, view, {
michael@0 59 1: {start: "0px", end: "1px", selectAll: true},
michael@0 60 2: {start: "0pt", end: "1pt", selectAll: true},
michael@0 61 3: {start: "0pc", end: "1pc", selectAll: true},
michael@0 62 4: {start: "0em", end: "1em", selectAll: true},
michael@0 63 5: {start: "0%", end: "1%", selectAll: true},
michael@0 64 6: {start: "0in", end: "1in", selectAll: true},
michael@0 65 7: {start: "0cm", end: "1cm", selectAll: true},
michael@0 66 8: {start: "0mm", end: "1mm", selectAll: true},
michael@0 67 9: {start: "0ex", end: "1ex", selectAll: true}
michael@0 68 });
michael@0 69 };
michael@0 70
michael@0 71 function* testHexIncrements(view) {
michael@0 72 info("Testing keyboard increments with hex colors");
michael@0 73
michael@0 74 let idRuleEditor = view.element.children[0]._ruleEditor;
michael@0 75 let hexColorPropEditor = idRuleEditor.rule.textProps[2].editor;
michael@0 76
michael@0 77 yield runIncrementTest(hexColorPropEditor, view, {
michael@0 78 1: {start: "#CCCCCC", end: "#CDCDCD", selectAll: true},
michael@0 79 2: {shift: true, start: "#CCCCCC", end: "#DCDCDC", selectAll: true},
michael@0 80 3: {start: "#CCCCCC", end: "#CDCCCC", selection: [1,3]},
michael@0 81 4: {shift: true, start: "#CCCCCC", end: "#DCCCCC", selection: [1,3]},
michael@0 82 5: {start: "#FFFFFF", end: "#FFFFFF", selectAll: true},
michael@0 83 6: {down: true, shift: true, start: "#000000", end: "#000000", selectAll: true}
michael@0 84 });
michael@0 85 };
michael@0 86
michael@0 87 function* testRgbIncrements(view) {
michael@0 88 info("Testing keyboard increments with rgb colors");
michael@0 89
michael@0 90 let idRuleEditor = view.element.children[0]._ruleEditor;
michael@0 91 let rgbColorPropEditor = idRuleEditor.rule.textProps[3].editor;
michael@0 92
michael@0 93 yield runIncrementTest(rgbColorPropEditor, view, {
michael@0 94 1: {start: "rgb(0,0,0)", end: "rgb(0,1,0)", selection: [6,7]},
michael@0 95 2: {shift: true, start: "rgb(0,0,0)", end: "rgb(0,10,0)", selection: [6,7]},
michael@0 96 3: {start: "rgb(0,255,0)", end: "rgb(0,255,0)", selection: [6,9]},
michael@0 97 4: {shift: true, start: "rgb(0,250,0)", end: "rgb(0,255,0)", selection: [6,9]},
michael@0 98 5: {down: true, start: "rgb(0,0,0)", end: "rgb(0,0,0)", selection: [6,7]},
michael@0 99 6: {down: true, shift: true, start: "rgb(0,5,0)", end: "rgb(0,0,0)", selection: [6,7]}
michael@0 100 });
michael@0 101 };
michael@0 102
michael@0 103 function* testShorthandIncrements(view) {
michael@0 104 info("Testing keyboard increments within shorthand values");
michael@0 105
michael@0 106 let idRuleEditor = view.element.children[0]._ruleEditor;
michael@0 107 let paddingPropEditor = idRuleEditor.rule.textProps[1].editor;
michael@0 108
michael@0 109 yield runIncrementTest(paddingPropEditor, view, {
michael@0 110 1: {start: "0px 0px 0px 0px", end: "0px 1px 0px 0px", selection: [4,7]},
michael@0 111 2: {shift: true, start: "0px 0px 0px 0px", end: "0px 10px 0px 0px", selection: [4,7]},
michael@0 112 3: {start: "0px 0px 0px 0px", end: "1px 0px 0px 0px", selectAll: true},
michael@0 113 4: {shift: true, start: "0px 0px 0px 0px", end: "10px 0px 0px 0px", selectAll: true},
michael@0 114 5: {down: true, start: "0px 0px 0px 0px", end: "0px 0px -1px 0px", selection: [8,11]},
michael@0 115 6: {down: true, shift: true, start: "0px 0px 0px 0px", end: "-10px 0px 0px 0px", selectAll: true}
michael@0 116 });
michael@0 117 };
michael@0 118
michael@0 119 function* testOddCases(view) {
michael@0 120 info("Testing some more odd cases");
michael@0 121
michael@0 122 let idRuleEditor = view.element.children[0]._ruleEditor;
michael@0 123 let marginPropEditor = idRuleEditor.rule.textProps[0].editor;
michael@0 124
michael@0 125 yield runIncrementTest(marginPropEditor, view, {
michael@0 126 1: {start: "98.7%", end: "99.7%", selection: [3,3]},
michael@0 127 2: {alt: true, start: "98.7%", end: "98.8%", selection: [3,3]},
michael@0 128 3: {start: "0", end: "1"},
michael@0 129 4: {down: true, start: "0", end: "-1"},
michael@0 130 5: {start: "'a=-1'", end: "'a=0'", selection: [4,4]},
michael@0 131 6: {start: "0 -1px", end: "0 0px", selection: [2,2]},
michael@0 132 7: {start: "url(-1)", end: "url(-1)", selection: [4,4]},
michael@0 133 8: {start: "url('test1.1.png')", end: "url('test1.2.png')", selection: [11,11]},
michael@0 134 9: {start: "url('test1.png')", end: "url('test2.png')", selection: [9,9]},
michael@0 135 10: {shift: true, start: "url('test1.1.png')", end: "url('test11.1.png')", selection: [9,9]},
michael@0 136 11: {down: true, start: "url('test-1.png')", end: "url('test-2.png')", selection: [9,11]},
michael@0 137 12: {start: "url('test1.1.png')", end: "url('test1.2.png')", selection: [11,12]},
michael@0 138 13: {down: true, alt: true, start: "url('test-0.png')", end: "url('test--0.1.png')", selection: [10,11]},
michael@0 139 14: {alt: true, start: "url('test--0.1.png')", end: "url('test-0.png')", selection: [10,14]}
michael@0 140 });
michael@0 141 };
michael@0 142
michael@0 143 function* runIncrementTest(propertyEditor, view, tests) {
michael@0 144 let editor = yield focusEditableField(propertyEditor.valueSpan);
michael@0 145
michael@0 146 for(let test in tests) {
michael@0 147 yield testIncrement(editor, tests[test], view);
michael@0 148 }
michael@0 149
michael@0 150 // Once properties have been set, wait for the inspector to update
michael@0 151 yield view.inspector.once("inspector-updated");
michael@0 152 }
michael@0 153
michael@0 154 function* testIncrement(editor, options, view) {
michael@0 155 editor.input.value = options.start;
michael@0 156 let input = editor.input;
michael@0 157
michael@0 158 if (options.selectAll) {
michael@0 159 input.select();
michael@0 160 } else if (options.selection) {
michael@0 161 input.setSelectionRange(options.selection[0], options.selection[1]);
michael@0 162 }
michael@0 163
michael@0 164 is(input.value, options.start, "Value initialized at " + options.start);
michael@0 165
michael@0 166 let onKeyUp = once(input, "keyup");
michael@0 167
michael@0 168 let key;
michael@0 169 key = options.down ? "VK_DOWN" : "VK_UP";
michael@0 170 key = options.pageDown ? "VK_PAGE_DOWN" : options.pageUp ? "VK_PAGE_UP" : key;
michael@0 171 EventUtils.synthesizeKey(key, {altKey: options.alt, shiftKey: options.shift}, view.doc.defaultView);
michael@0 172
michael@0 173 yield onKeyUp;
michael@0 174 input = editor.input;
michael@0 175 is(input.value, options.end, "Value changed to " + options.end);
michael@0 176 }

mercurial