third_party/WebKit/Source/web/tests/data/frameserializer/css/css_test_page.html - Issue 2410693002: Add a few more edge cases to CSS serialization test.

Side by Side Diff: third_party/WebKit/Source/web/tests/data/frameserializer/css/css_test_page.html

Issue 2410693002: Add a few more edge cases to CSS serialization test. (Closed)

Patch Set: Adds the case of a CSS already being included in another frame. Created 4 years, 2 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:

« third_party/WebKit/Source/core/frame/FrameSerializer.cpp ('K') | « third_party/WebKit/Source/web/tests/FrameSerializerTest.cpp ('k') | third_party/WebKit/Source/web/tests/data/frameserializer/css/included_in_another_frame.css » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

OLD	NEW
1 <!-- This page is used to test that CSS resources are retrieved correctly by	1 <!-- This page is used to test that CSS resources are retrieved correctly by

2 the FrameSerializer.	2 the FrameSerializer.

3 -->	3 -->

4 <html>	4 <html>

5 <head>	5 <head>

6	6

7 <link rel="stylesheet" type="text/css" href="link_styles.css" />	7 <link rel="stylesheet" type="text/css" href="link_styles.css" />

8 <link rel="stylesheet" type="text/css" href="encoding.css" />	8 <link rel="stylesheet" type="text/css" href="encoding.css" />

	9 <!-- This data URL contains a style referring to an image that should not be

	10 serialized and a fuchsia color background -->

	11 <link rel="stylesheet" type="text/css"

	12 href="data:text/css;charset=utf-8;base64,I2RpdkZ1Y2hzaWEgew0KICBiYWNrZ3Jvd W5kLWltYWdlOiB1cmwoJ2RvX25vdF9zZXJpYWxpemUucG5nJyk7DQogIGJhY2tncm91bmQtY29sb3I6I CNGRjAwRkY7DQp9" />
	carlosk 2016/10/11 23:08:54 I'm unsure of the correct HTML style, especially i I'm unsure of the correct HTML style, especially in this line. Łukasz Anforowicz 2016/10/11 23:30:37 Hmmm... non-base64-encoded form of the data: URI i Show quoted text On 2016/10/11 23:08:54, carlosk wrote: > I'm unsure of the correct HTML style, especially in this line. Hmmm... non-base64-encoded form of the data: URI is only marginally more readable: data:text/css;charset=utf-8,%23divFuchsia%20%7B%0D%0A%20%20background-image%3A%20url%28%27do_not_serialize.png%27%29%3B%0D%0A%20%20background-color%3A%20%23FF00FF%3B%0D%0A%7D So, I guess I am fine with just having base64-encoded data URI above. One way to help the reader, might be to add a decoded/expanded form in a comment. I don't feel particularily strongly about this though... I wonder if it might be worth it to add a subresource with a unique link to the CSS in the data: URI (similar to how we test presence of pink_background.png coming from the inline <style> tag). carlosk 2016/10/12 00:41:30 Replaced with an escaped sequence instead of base6 Show quoted text On 2016/10/11 23:30:37, Łukasz Anforowicz wrote: > On 2016/10/11 23:08:54, carlosk wrote: > > I'm unsure of the correct HTML style, especially in this line. > > Hmmm... non-base64-encoded form of the data: URI is only marginally more > readable: > > data:text/css;charset=utf-8,%23divFuchsia%20%7B%0D%0A%20%20background-image%3A%20url%28%27do_not_serialize.png%27%29%3B%0D%0A%20%20background-color%3A%20%23FF00FF%3B%0D%0A%7D > > So, I guess I am fine with just having base64-encoded data URI above. Replaced with an escaped sequence instead of base64. Show quoted text > One way to help the reader, might be to add a decoded/expanded form in a > comment. I don't feel particularily strongly about this though... Done that too. Show quoted text > I wonder if it might be worth it to add a subresource with a unique link to the > CSS in the data: URI (similar to how we test presence of pink_background.png > coming from the inline <style> tag). I tried this with a relative URL and it didn't work. But it did indeed work using an absolute URL to an image so I added this extra element too.
	13 <!-- This should be skipped for already being included from another frame -->

	14 <link rel="stylesheet" type="text/css" href="included_in_another_frame.css" />

9	15

10 <style>	16 <style>

11 @import url('import_styles.css');	17 @import url('import_styles.css');

12	18

13 @font-face {	19 @font-face {

14 font-family: Chunkfive;	20 font-family: Chunkfive;

15 }	21 }

16	22

17 #chunkfiveDiv {	23 #chunkfiveDiv {

18 font-family: Chunkfive, sans-serif;	24 font-family: Chunkfive, sans-serif;

(...skipping 34 matching lines...) Expand 10 before \| Expand all \| Expand 10 after Loading...
53 background-image: url('pink_background.png');	59 background-image: url('pink_background.png');

54 }	60 }

55 }	61 }

56	62

57 @supports not (invalid-css-property: invalid-css-value) {	63 @supports not (invalid-css-property: invalid-css-value) {

58 #divBrown {	64 #divBrown {

59 background-image: url('brown_background.png');	65 background-image: url('brown_background.png');

60 }	66 }

61 }	67 }

62	68

	69 // Tries to import a resource that was already previously linked.

	70 @import url('link_styles.css');

	71

63 </style>	72 </style>

64	73

65 <script>	74 <script>

66 // Dynamically creates a CSS style.	75 // Dynamically creates a CSS style.

67 function onLoad() {	76 function onLoad() {

68 var styleText = "#divPurple {background-image:url('purple_background.png')}";	77 var styleText = "#divPurple {background-image:url('purple_background.png')}";

69 var div = document.getElementById('divPurple');	78 var div = document.getElementById('divPurple');

70 var styleNode= document.createElement('style');	79 var styleNode= document.createElement('style');

71 styleNode.type= 'text/css';	80 styleNode.type= 'text/css';

72 styleNode.media= 'screen';	81 styleNode.media= 'screen';

(...skipping 41 matching lines...) Expand 10 before \| Expand all \| Expand 10 after Loading...
114 <!-- Style is defined in a media query -->	123 <!-- Style is defined in a media query -->

115 <div id='divPink'>	124 <div id='divPink'>

116 This div has a pink image as its background.	125 This div has a pink image as its background.

117 </div>	126 </div>

118	127

119 <!-- Style is defined in a supports feature query -->	128 <!-- Style is defined in a supports feature query -->

120 <div id='divBrown'>	129 <div id='divBrown'>

121 This div has a brown image as its background.	130 This div has a brown image as its background.

122 </div>	131 </div>

123	132

	133 <!-- Style is in linked data URL -->

	134 <div id='divFuchsia'>

	135 This div has a fuchsia image as its background.

	136 </div>

	137

124 Unordered list:<br>	138 Unordered list:<br>

125 <ul>	139 <ul>

126 <li>Blue</li>	140 <li>Blue</li>

127 <li>Red</li>	141 <li>Red</li>

128 <li>Yellow</li>	142 <li>Yellow</li>

129 <li>Blue</li>	143 <li>Blue</li>

130 <li>Green</li>	144 <li>Green</li>

131 <li>Red</li>	145 <li>Red</li>

132 </ul>	146 </ul>

133 <br>	147 <br>

134	148

135 Ordered list:<br>	149 Ordered list:<br>

136 <ol>	150 <ol>

137 <li>Blue</li>	151 <li>Blue</li>

138 <li>Red</li>	152 <li>Red</li>

139 <li>Yellow</li>	153 <li>Yellow</li>

140 <li>Blue</li>	154 <li>Blue</li>

141 <li>Green</li>	155 <li>Green</li>

142 <li>Red</li>	156 <li>Red</li>

143 </ol>	157 </ol>

144	158

145 </body>	159 </body>

146	160

147 </html>	161 </html>

OLD	NEW