1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
|
/* vim: set ts=2 et sw=2 tw=80: */
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/* import-globals-from helper_outerhtml_test_runner.js */
"use strict";
// Test outerHTML edition via the markup-view
requestLongerTimeout(2);
loadHelperScript("helper_outerhtml_test_runner.js");
const TEST_DATA = [{
selector: "#one",
oldHTML: '<div id="one">First <em>Div</em></div>',
newHTML: '<div id="one">First Div</div>',
validate: function* ({pageNodeFront, selectedNodeFront, testActor}) {
let text = yield testActor.getProperty("#one", "textContent");
is(text, "First Div", "New div has expected text content");
let num = yield testActor.getNumberOfElementMatches("#one em");
is(num, 0, "No em remaining");
}
}, {
selector: "#removedChildren",
oldHTML: "<div id=\"removedChildren\">removedChild " +
"<i>Italic <b>Bold <u>Underline</u></b></i> Normal</div>",
newHTML: "<div id=\"removedChildren\">removedChild</div>"
}, {
selector: "#addedChildren",
oldHTML: '<div id="addedChildren">addedChildren</div>',
newHTML: "<div id=\"addedChildren\">addedChildren " +
"<i>Italic <b>Bold <u>Underline</u></b></i> Normal</div>"
}, {
selector: "#addedAttribute",
oldHTML: '<div id="addedAttribute">addedAttribute</div>',
newHTML: "<div id=\"addedAttribute\" class=\"important\" disabled checked>" +
"addedAttribute</div>",
validate: function* ({pageNodeFront, selectedNodeFront, testActor}) {
is(pageNodeFront, selectedNodeFront, "Original element is selected");
let html = yield testActor.getProperty("#addedAttribute", "outerHTML");
is(html, "<div id=\"addedAttribute\" class=\"important\" disabled=\"\" " +
"checked=\"\">addedAttribute</div>", "Attributes have been added");
}
}, {
selector: "#changedTag",
oldHTML: '<div id="changedTag">changedTag</div>',
newHTML: '<p id="changedTag" class="important">changedTag</p>'
}, {
selector: "#siblings",
oldHTML: '<div id="siblings">siblings</div>',
newHTML: '<div id="siblings-before-sibling">before sibling</div>' +
'<div id="siblings">siblings (updated)</div>' +
'<div id="siblings-after-sibling">after sibling</div>',
validate: function* ({selectedNodeFront, inspector, testActor}) {
let beforeSiblingFront = yield getNodeFront("#siblings-before-sibling",
inspector);
is(beforeSiblingFront, selectedNodeFront, "Sibling has been selected");
let text = yield testActor.getProperty("#siblings", "textContent");
is(text, "siblings (updated)", "New div has expected text content");
let beforeText = yield testActor.getProperty("#siblings-before-sibling",
"textContent");
is(beforeText, "before sibling", "Sibling has been inserted");
let afterText = yield testActor.getProperty("#siblings-after-sibling",
"textContent");
is(afterText, "after sibling", "Sibling has been inserted");
}
}];
const TEST_URL = "data:text/html," +
"<!DOCTYPE html>" +
"<head><meta charset='utf-8' /></head>" +
"<body>" +
TEST_DATA.map(outer => outer.oldHTML).join("\n") +
"</body>" +
"</html>";
add_task(function* () {
let {inspector, testActor} = yield openInspectorForURL(TEST_URL);
inspector.markup._frame.focus();
yield runEditOuterHTMLTests(TEST_DATA, inspector, testActor);
});
|
