LayoutTests/css3/device-adapt/viewport-at-rule-parsing.html - Issue 16209003: Unprefix the @viewport rule of CSS Device Adaptation spec

Side by Side Diff: LayoutTests/css3/device-adapt/viewport-at-rule-parsing.html

Issue 16209003: Unprefix the @viewport rule of CSS Device Adaptation spec (Closed) Base URL: svn://svn.chromium.org/blink/trunk

Patch Set: Created 7 years, 6 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 | Annotate | Revision Log

OLD	NEW
1 <!DOCTYPE html>	1 <!DOCTYPE html>

2 <html>	2 <html>

3 <head>	3 <head>

4 <style type="text/css">	4 <style type="text/css">

5 /* Valid viewport syntax. */	5 /* Valid viewport syntax. */

6 @-webkit-viewport {	6 @viewport {

7 }	7 }

8	8

9 /* Valid viewport syntax, extras spaces should be ignored. */	9 /* Valid viewport syntax, extras spaces should be ignored. */

10 @-webkit-viewport {	10 @viewport {

11 }	11 }

12	12

13 /* Valid viewport syntax, regular attributes. */	13 /* Valid viewport syntax, regular attributes. */

14 @-webkit-viewport {	14 @viewport {

15 max-height: 200px;	15 max-height: 200px;

16 min-height: 200px;	16 min-height: 200px;

17 }	17 }

18	18

19 /* Valid viewport syntax, should omit the malformed attribute. */	19 /* Valid viewport syntax, should omit the malformed attribute. */

20 @-webkit-viewport {	20 @viewport {

21 asdasd	21 asdasd

22 }	22 }

23	23

24 /* Valid viewport syntax, it is allowed inside media queries. */	24 /* Valid viewport syntax, it is allowed inside media queries. */

25 @media all {	25 @media all {

26 @-webkit-viewport {	26 @viewport {

27 }	27 }

28 }	28 }

29	29

30 /* Nested viewport rules are not allowed. The inner rule should be ignor ed. */	30 /* Nested viewport rules are not allowed. The inner rule should be ignor ed. */

31 @-webkit-viewport {	31 @viewport {

32 max-height: 100px;	32 max-height: 100px;

33 min-height: 100px;	33 min-height: 100px;

34	34

35 @-webkit-viewport {	35 @viewport {

36 max-height: 200px;	36 max-height: 200px;

37 min-height: 200px;	37 min-height: 200px;

38 }	38 }

39 }	39 }

40	40

41 /* Rules inside a viewport should be ignored. */	41 /* Rules inside a viewport should be ignored. */

42 @-webkit-viewport {	42 @viewport {

43 max-height: 50px;	43 max-height: 50px;

44 min-height: 50px;	44 min-height: 50px;

45	45

46 @import url('../../resources/testharness.css');	46 @import url('../../resources/testharness.css');

47 }	47 }

48	48

49 /* Should ignore unprefixed viewport rule. We need to change this	49 /* Should ignore unprefixed viewport rule. We need to change this

50 test if at some point we remove the prefix. */	50 test if at some point we remove the prefix. */

51 @viewport {	51 @viewport {

52 }	52 }

53 </style>	53 </style>

54 <meta charset="utf-8" />	54 <meta charset="utf-8" />

55 <link rel="help" href="http://www.w3.org/TR/css-device-adapt/#syntax" />	55 <link rel="help" href="http://www.w3.org/TR/css-device-adapt/#syntax" />

56 <script src="../../resources/testharness.js"></script>	56 <script src="../../resources/testharness.js"></script>

57 <script src="../../resources/testharnessreport.js"></script>	57 <script src="../../resources/testharnessreport.js"></script>

58 <script type="text/javascript">	58 <script type="text/javascript">

59 var rules = document.styleSheets[0].cssRules;	59 var rules = document.styleSheets[0].cssRules;

60	60

61 test(function() {	61 test(function() {

62 assert_equals(rules.item(0).cssText, "@-webkit-viewport { }");	62 assert_equals(rules.item(0).cssText, "@viewport { }");

63 }, "Empty at-rule parsing");	63 }, "Empty at-rule parsing");

64	64

65 test(function() {	65 test(function() {

66 assert_equals(rules.item(1).cssText, "@-webkit-viewport { }");	66 assert_equals(rules.item(1).cssText, "@viewport { }");

67 }, "at-rule with extra spaces");	67 }, "at-rule with extra spaces");

68	68

69 test(function() {	69 test(function() {

70 assert_equals(rules.item(2).cssText, "@-webkit-viewport { max-height : 200px; min-height: 200px; }");	70 assert_equals(rules.item(2).cssText, "@viewport { max-height: 200px; min-height: 200px; }");

71 }, "Rule with attributes");	71 }, "Rule with attributes");

72	72

73 test(function() {	73 test(function() {

74 assert_equals(rules.item(3).cssText, "@-webkit-viewport { }");	74 assert_equals(rules.item(3).cssText, "@viewport { }");

75 }, "Rule with malformed attributes");	75 }, "Rule with malformed attributes");

76	76

77 test(function() {	77 test(function() {

78 assert_equals(rules.item(4).cssText, "@media all { \n @-webkit-view port { }\n}");	78 assert_equals(rules.item(4).cssText, "@media all { \n @viewport { } \n}");

79 }, "Should be accepted inside media queries");	79 }, "Should be accepted inside media queries");

80	80

81 test(function() {	81 test(function() {

82 assert_equals(rules.item(5).cssText, "@-webkit-viewport { max-height : 100px; min-height: 100px; }");	82 assert_equals(rules.item(5).cssText, "@viewport { max-height: 100px; min-height: 100px; }");

83 }, "Nested viewport rule");	83 }, "Nested viewport rule");

84	84

85 test(function() {	85 test(function() {

86 assert_equals(rules.item(6).cssText, "@-webkit-viewport { max-height : 50px; min-height: 50px; }");	86 assert_equals(rules.item(6).cssText, "@viewport { max-height: 50px; min-height: 50px; }");

87 }, "Rules inside a viewport rule");	87 }, "Rules inside a viewport rule");

88	88

89 // The total number of parsed rules should be 6, meaning that the parser	89 // The total number of parsed rules should be 6, meaning that the parser

90 // ignored the last two rules.	90 // ignored the last two rules.

91 test(function() {	91 test(function() {

92 assert_equals(rules.length, 7)	92 assert_equals(rules.length, 7)

93 }, "Should ignore unprefixed at-rule");	93 }, "Should ignore unprefixed at-rule");

94 </script>	94 </script>

95 </head>	95 </head>

96 <body>	96 <body>

97 <div id="log"></div>	97 <div id="log"></div>

98 </body>	98 </body>

99 </html>	99 </html>

OLD	NEW