|
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 // Testing various inplace-editor behaviors in the rule-view |
|
8 // FIXME: To be split in several test files, and some of the inplace-editor |
|
9 // focus/blur/commit/revert stuff should be factored out in head.js |
|
10 |
|
11 let TEST_URL = 'url("' + TEST_URL_ROOT + 'doc_test_image.png")'; |
|
12 let PAGE_CONTENT = [ |
|
13 '<style type="text/css">', |
|
14 ' #testid {', |
|
15 ' background-color: blue;', |
|
16 ' }', |
|
17 ' .testclass {', |
|
18 ' background-color: green;', |
|
19 ' }', |
|
20 '</style>', |
|
21 '<div id="testid" class="testclass">Styled Node</div>' |
|
22 ].join("\n"); |
|
23 |
|
24 let test = asyncTest(function*() { |
|
25 yield addTab("data:text/html,test rule view user changes"); |
|
26 |
|
27 info("Creating the test document"); |
|
28 content.document.body.innerHTML = PAGE_CONTENT; |
|
29 |
|
30 info("Opening the rule-view"); |
|
31 let {toolbox, inspector, view} = yield openRuleView(); |
|
32 |
|
33 info("Selecting the test element"); |
|
34 yield selectNode("#testid", inspector); |
|
35 |
|
36 yield testEditProperty(view, "border-color", "red"); |
|
37 yield testEditProperty(view, "background-image", TEST_URL); |
|
38 }); |
|
39 |
|
40 function* testEditProperty(view, name, value) { |
|
41 info("Test editing existing property name/value fields"); |
|
42 |
|
43 let idRuleEditor = view.element.children[1]._ruleEditor; |
|
44 let propEditor = idRuleEditor.rule.textProps[0].editor; |
|
45 |
|
46 info("Focusing an existing property name in the rule-view"); |
|
47 let editor = yield focusEditableField(propEditor.nameSpan, 32, 1); |
|
48 |
|
49 is(inplaceEditor(propEditor.nameSpan), editor, "The property name editor got focused"); |
|
50 let input = editor.input; |
|
51 |
|
52 info("Entering a new property name, including : to commit and focus the value"); |
|
53 let onValueFocus = once(idRuleEditor.element, "focus", true); |
|
54 let onModifications = idRuleEditor.rule._applyingModifications; |
|
55 for (let ch of name + ":") { |
|
56 EventUtils.sendChar(ch, view.doc.defaultView); |
|
57 } |
|
58 yield onValueFocus; |
|
59 yield onModifications; |
|
60 |
|
61 // Getting the value editor after focus |
|
62 editor = inplaceEditor(view.doc.activeElement); |
|
63 input = editor.input; |
|
64 is(inplaceEditor(propEditor.valueSpan), editor, "Focus moved to the value."); |
|
65 |
|
66 info("Entering a new value, including ; to commit and blur the value"); |
|
67 let onBlur = once(input, "blur"); |
|
68 let onModifications = idRuleEditor.rule._applyingModifications; |
|
69 for (let ch of value + ";") { |
|
70 EventUtils.sendChar(ch, view.doc.defaultView); |
|
71 } |
|
72 yield onBlur; |
|
73 yield onModifications; |
|
74 |
|
75 let propValue = idRuleEditor.rule.domRule._rawStyle().getPropertyValue(name); |
|
76 is(propValue, value, name + " should have been set."); |
|
77 is(propEditor.isValid(), true, value + " should be a valid entry"); |
|
78 } |