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
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
|
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
// Test that whitespace text nodes do show up in the markup-view when needed.
const TEST_URL = URL_ROOT + "doc_markup_whitespace.html";
add_task(async function () {
const { inspector } = await openInspectorForURL(TEST_URL);
const { markup } = inspector;
await markup.expandAll();
info("Verify the number of child nodes and child elements in body");
// Body has 5 element children, but there are 6 text nodes in there too, they come from
// the HTML file formatting (spaces and carriage returns).
is(
await getElementChildNodesCount("body"),
11,
"The body node has 11 child nodes (includes text nodes)"
);
is(
await getContentPageElementProperty("body", "childElementCount"),
5,
"The body node has 5 child elements (only element nodes)"
);
// In body, there are only block-level elements, so whitespace text nodes do not have
// layout, so they should be skipped in the markup-view.
info("Check that the body's whitespace text node children aren't shown");
const bodyContainer = markup.getContainer(inspector.selection.nodeFront);
let childContainers = bodyContainer.getChildContainers();
is(
childContainers.length,
5,
"Only the element nodes are shown in the markup view"
);
// div#inline has 3 element children, but there are 4 text nodes in there too, like in
// body, they come from spaces and carriage returns in the HTML file.
info("Verify the number of child nodes and child elements in div#inline");
is(
await getElementChildNodesCount("#inline"),
7,
"The div#inline node has 7 child nodes (includes text nodes)"
);
is(
await getContentPageElementProperty("#inline", "childElementCount"),
3,
"The div#inline node has 3 child elements (only element nodes)"
);
// Within the inline formatting context in div#inline, the whitespace text nodes between
// the images have layout, so they should appear in the markup-view.
info("Check that the div#inline's whitespace text node children are shown");
await selectNode("#inline", inspector);
let divContainer = markup.getContainer(inspector.selection.nodeFront);
childContainers = divContainer.getChildContainers();
is(
childContainers.length,
5,
"Both the element nodes and some text nodes are shown in the markup view"
);
// div#pre has 2 element children, but there are 3 text nodes in there too, like in
// div#inline, they come from spaces and carriage returns in the HTML file.
info("Verify the number of child nodes and child elements in div#pre");
is(
await getElementChildNodesCount("#pre"),
5,
"The div#pre node has 5 child nodes (includes text nodes)"
);
is(
await getContentPageElementProperty("#pre", "childElementCount"),
2,
"The div#pre node has 2 child elements (only element nodes)"
);
// Within the inline formatting context in div#pre, the whitespace text nodes between
// the images have layout, so they should appear in the markup-view, but since
// white-space is set to pre, then the whitespace text nodes before and after the first
// and last image should also appear.
info("Check that the div#pre's whitespace text node children are shown");
await selectNode("#pre", inspector);
divContainer = markup.getContainer(inspector.selection.nodeFront);
childContainers = divContainer.getChildContainers();
is(
childContainers.length,
5,
"Both the element nodes and all text nodes are shown in the markup view"
);
});
function getElementChildNodesCount(selector) {
return SpecialPowers.spawn(
gBrowser.selectedBrowser,
[selector],
function (innerSelector) {
const node = content.document.querySelector(innerSelector);
return node.childNodes.length;
}
);
}
|
