LayoutTests/fast/regions/cssom/webkit-named-flow-get-content.html - Issue 159863002: Remove CSS regions support, keeping a bare minimum to support "region-based" multicol.

Side by Side Diff: LayoutTests/fast/regions/cssom/webkit-named-flow-get-content.html

Issue 159863002: Remove CSS regions support, keeping a bare minimum to support "region-based" multicol. (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master

Patch Set: Created 6 years, 10 months ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

View unified diff | Download patch

« no previous file with comments | « LayoutTests/fast/regions/cssom/webkit-named-flow-flow-added-expected.txt ('k') | LayoutTests/fast/regions/cssom/webkit-named-flow-get-content-expected.txt » ('j') | Source/devtools/front_end/protocol_externs.js » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

OLD	NEW
	(Empty)
1 <!doctype html>

2 <html>

3 <head>

4 <script src="../../../resources/js-test.js"></script>

5 <script src="../resources/helper.js"></script>

6 <style>

7 #region { -webkit-flow-from: flow; width: 250px; height: 150px; }

8 </style>

9 </head>

10 <body>

11 <!--

12 1. The content nodes collection for a named flow 'flow' contains only th ose elements that have

13 the style property -webkit-flow-into set to 'flow'.

14 2. If an element has an ancestor with -webkit-flow-into = 'flow' but doe s not have its '-webkit-flow-into'

15 set to 'flow' will not be listed among the content nodes for named flow 'flow'.

16 3. Elements with '-webkit-flow-into' set to 'flow' and 'display:none' sh ould be listed among the content nodes

17 for named flow object 'flow'.

18 4. The collection of nodes is returned in document order.

19 -->

20 <script>

21 if (window.testRunner)

22 window.testRunner.dumpAsText();

23 description("Test for 90163: [CSSRegions]Rename NamedFlow::contentNo des to NamedFlow::getContent()");

24

25 // Add an element that would be collected by the named flow but do n ot add it to the DOM, the contentNodes should be empty.

26 var article = document.createElement("div");

27 article.id = "article";

28 article.style.webkitFlowInto = "flow";

29

30 shouldBeNull('getFlowByName("flow")');

31

32 // Append the above element to the DOM. It will be collected by the flow, therefore the contentNodes should have 1 element.

33 document.body.appendChild(article);

34 var namedFlowContent3 = getFlowByName("flow").getContent();

35 shouldEvaluateTo("namedFlowContent3.length", 1);

36 shouldBeEqualToString("namedFlowContent3.item(0).id", "article");

37

38 // Append a child element to the article above but do not set its st yle to flow into 'flow'.

39 // The contentNodes should still have 1 element.

40 var pNode = document.createElement("p");

41 pNode.id = "p1";

42 document.getElementById("article").appendChild(pNode);

43 var namedFlowContent4 = getFlowByName("flow").getContent();

44 shouldEvaluateTo("namedFlowContent4.length", 1);

45 shouldBeEqualToString("namedFlowContent4.item(0).id", "article");

46

47 // Add another element directly to the flow and set its 'display' pr operty to 'none', it should be part of the flow.

48 var article2 = document.createElement("div");

49 article2.id = "article2";

50 article2.style.webkitFlowInto = "flow";

51 article2.style.display = "none";

52 document.body.insertBefore(article2, article);

53

54 var namedFlowContent5 = getFlowByName("flow").getContent();

55 shouldEvaluateTo("namedFlowContent5.length", 2);

56 shouldBeEqualToString("namedFlowContent5.item(0).id", "article2");

57 shouldBeEqualToString("namedFlowContent5.item(1).id", "article");

58

59 // Adding a region element to flow content into should not influence the content nodes collection.

60 var regionNode = document.createElement("div");

61 regionNode.id = "region";

62 document.body.appendChild(regionNode);

63 var namedFlowContent6 = getFlowByName("flow").getContent();

64 shouldEvaluateTo("namedFlowContent6.length", 2);

65

66 // Change display:none for the 'article2' element, the list of conte ntNodes should stay the same

67 document.getElementById("article2").style.display = "block";

68 var namedFlowContent7 = getFlowByName("flow").getContent();

69 shouldEvaluateTo("namedFlowContent7.length", 2);

70

71 // Add a p and a span under p. Make the span directly collected by t he flow. The contentNodes collection should have 3 elements.

72 pNode = document.createElement("p");

73 pNode.id = "p2";

74 var spanNode = document.createElement("span");

75 spanNode.id = "span1";

76 spanNode.style.webkitFlowInto = "flow";

77 pNode.appendChild(spanNode);

78 document.getElementById("article2").appendChild(pNode);

79

80 var namedFlowContent8 = getFlowByName("flow").getContent();

81 shouldEvaluateTo("namedFlowContent8.length", 3);

82

83 // Change display of article node to none, the collection should sti ll have 3 elements.

84 document.getElementById("article").style.display = "none";

85 var namedFlowContent9 = getFlowByName("flow").getContent();

86 shouldEvaluateTo("namedFlowContent9.length", 3);

87 shouldBeEqualToString("namedFlowContent9.item(0).id", "article2");

88 shouldBeEqualToString("namedFlowContent9.item(1).id", "span1");

89 shouldBeEqualToString("namedFlowContent9.item(2).id", "article");

90

91 // Take 'article' node from last position and insert it before 'arti cle2'

92 article = document.getElementById("article");

93 document.body.insertBefore(document.body.removeChild(article), artic le2);

94 var namedFlowContent10 = getFlowByName("flow").getContent();

95 shouldEvaluateTo("namedFlowContent10.length", 3);

96 shouldBeEqualToString("namedFlowContent10.item(0).id", "article");

97

98 // Clone 'article2' including its children.

99 var article2Clone = document.getElementById("article2").cloneNode(tr ue);

100 document.body.appendChild(article2Clone);

101 var namedFlowContent11 = getFlowByName("flow").getContent();

102 shouldEvaluateTo("namedFlowContent11.length", 5);

103 // Remove article2 nodes from document, they should be removed from flow.

104 document.body.removeChild(article2);

105 document.body.removeChild(article2Clone);

106 var namedFlowContent12 = getFlowByName("flow").getContent();

107 shouldEvaluateTo("namedFlowContent12.length", 1);

108 shouldBeEqualToString("namedFlowContent12.item(0).id", "article");

109

110 // Move the content node 'article' from named flow 'flow' to named f low 'flow2'

111 document.getElementById("article").style.webkitFlowInto = "flow2";

112 var flow2 = getFlowByName("flow2");

113 var namedFlowContent11 = getFlowByName("flow").getContent();

114 var namedFlowContent12 = getFlowByName("flow2").getContent();

115 shouldEvaluateTo("namedFlowContent11.length", "0");

116 shouldEvaluateTo("namedFlowContent12.length", "1");

117 shouldBeEqualToString("namedFlowContent12.item(0).id", "article");

118

119 // Remove the content node from dom, content nodes for both 'flow' a nd 'flow2' should be empty

120 document.body.removeChild(document.getElementById("article"));

121 shouldBeNull('getFlowByName("flow2")');

122

123 var namedFlowContent13 = getFlowByName("flow").getContent();

124 shouldEvaluateTo("namedFlowContent13.length", "0");

125

126 var namedFlowContent14 = flow2.getContent();

127 shouldEvaluateTo("namedFlowContent14.length", "0");

128 document.body.appendChild(article);

129 var namedFlowContent15 = flow2.getContent();

130 shouldEvaluateTo("namedFlowContent15.length", "1");

131

132 document.getElementById("region").style.visibility = "hidden";

133 </script>

134 </body>

135 </html>

OLD	NEW