[@container] Change initial value of container-type to 'normal'

Per recent CSSWG resolution [1], the initial value is now 'normal'.

The function StyleBuilderConverter::ConvertFlags had hard-coded
handling of CSSValueID::kNone which interpreted that to mean "flags=0".
Since we now also need kNormal to mean "flags=0", this CL adds a
template parameter to indicate which CSSValueID we should treat as
zero.

This CL also disallows the following values from the <custom-ident>
of the container-name property:

 - normal, which was clearly intended from reading the discussion
   in [1].
 - auto, which is not explicitly mentioned in [1] as something to
   disallow, but it's aligned with the ambition to disallow
   none/normal/auto from <custom-ident> in general [2].

[1] w3c/csswg-drafts#7402
[2] w3c/csswg-drafts#7431

Fixed: 1340859
Change-Id: I841303e2b5673c65d69d97522a0a3661e5d1ec24
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3736384
Commit-Queue: Anders Hartvoll Ruud <andruud@chromium.org>
Reviewed-by: Morten Stenshorne <mstensho@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1019597}

css/css-contain/container-queries/at-container-parsing.html

@@ -166,6 +166,10 @@
   test_container_selector_invalid('"inherit"');
   test_container_selector_invalid('none');
   test_container_selector_invalid('None');
+  test_container_selector_invalid('normal');
+  test_container_selector_invalid('Normal');
+  test_container_selector_invalid('auto');
+  test_container_selector_invalid('Auto');
   test_container_selector_invalid('and');
   test_container_selector_invalid('or');
   test_container_selector_invalid('not');

css/css-contain/container-queries/container-computed.html

@@ -26,4 +26,5 @@
 test_computed_value('container', 'foo/inline-size', 'foo / inline-size');
 test_computed_value('container', 'FoO / size');
 test_computed_value('container', 'foo bar / size', 'foo bar / size');
+test_computed_value('container', 'foo / normal', 'foo');
 </script>

css/css-contain/container-queries/container-inheritance.html

@@ -14,5 +14,5 @@
 setup(() => assert_implements_container_queries());
 
 assert_not_inherited('container-name', 'none', 'foo');
-assert_not_inherited('container-type', 'none', 'inline-size');
+assert_not_inherited('container-type', 'normal', 'inline-size');
 </script>

css/css-contain/container-queries/container-name-parsing.html

@@ -21,6 +21,8 @@
 test_valid_value('container-name', 'foo foo');
 test_valid_value('container-name', '\\!escaped');
 
+test_invalid_value('container-name', 'auto');
+test_invalid_value('container-name', 'normal');
 test_invalid_value('container-name', 'none none');
 test_invalid_value('container-name', 'foo, bar');
 test_invalid_value('container-name', '#fff');

css/css-contain/container-queries/container-parsing.html

@@ -16,7 +16,7 @@
 test_valid_value('container', 'unset');
 test_valid_value('container', 'revert');
 test_valid_value('container', 'none');
-test_valid_value('container', 'none / none', 'none');
+test_valid_value('container', 'none / normal', 'none');
 test_valid_value('container', 'inline-size');
 test_valid_value('container', 'none / inline-size', 'none / inline-size');
 test_valid_value('container', 'size');
@@ -25,21 +25,27 @@
 test_valid_value('container', 'size / size');
 test_valid_value('container', 'none / size style', 'none / style size');
 test_valid_value('container', 'foo');
-test_valid_value('container', 'foo / none', 'foo');
+test_valid_value('container', 'foo / normal', 'foo');
 test_valid_value('container', 'foo bar / size');
-test_valid_value('container', 'foo bar / none', 'foo bar');
+test_valid_value('container', 'foo bar / normal', 'foo bar');
 test_valid_value('container', 'FOO / size');
 test_valid_value('container', 'FOO/size', 'FOO / size');
 test_valid_value('container', '  FOO  /size', 'FOO / size');
 
 test_invalid_value('container', 'none none');
 test_invalid_value('container', 'none inline-size');
 test_invalid_value('container', 'none / inline-size none');
+test_invalid_value('container', 'none / inline-size normal');
 test_invalid_value('container', 'none / inline-size inline-size');
 test_invalid_value('container', 'none / inline-size block-size unknown');
 test_invalid_value('container', 'none / inline-size block-size');
 test_invalid_value('container', 'none / size block-size');
 test_invalid_value('container', 'none, none');
+test_invalid_value('container', 'none, normal');
+test_invalid_value('container', 'none / none');
+test_invalid_value('container', 'none / auto');
+test_invalid_value('container', 'normal / size');
+test_invalid_value('container', 'auto / size');
 test_invalid_value('container', 'none / foo');
 test_invalid_value('container', 'none / foo, bar');
 test_invalid_value('container', '#fff');

css/css-contain/container-queries/container-type-computed.html

@@ -10,8 +10,9 @@
 <script>
 setup(() => assert_implements_container_queries());
 
-test_computed_value('container-type', 'initial', 'none');
-test_computed_value('container-type', 'unset', 'none');
+test_computed_value('container-type', 'initial', 'normal');
+test_computed_value('container-type', 'unset', 'normal');
 test_computed_value('container-type', 'inline-size');
 test_computed_value('container-type', 'size');
+test_computed_value('container-type', 'normal');
 </script>

css/css-contain/container-queries/container-type-parsing.html

@@ -14,7 +14,7 @@
 test_valid_value('container-type', 'inherit');
 test_valid_value('container-type', 'unset');
 test_valid_value('container-type', 'revert');
-test_valid_value('container-type', 'none');
+test_valid_value('container-type', 'normal');
 test_valid_value('container-type', 'style');
 test_valid_value('container-type', 'size');
 test_valid_value('container-type', 'inline-size');
@@ -23,16 +23,18 @@
 test_valid_value('container-type', 'style inline-size');
 test_valid_value('container-type', 'style size');
 
+test_invalid_value('container-type', 'none');
+test_invalid_value('container-type', 'auto');
 test_invalid_value('container-type', 'block-size');
-test_invalid_value('container-type', 'none none');
-test_invalid_value('container-type', 'none inline-size');
-test_invalid_value('container-type', 'inline-size none');
+test_invalid_value('container-type', 'normal normal');
+test_invalid_value('container-type', 'normal inline-size');
+test_invalid_value('container-type', 'inline-size normal');
 test_invalid_value('container-type', 'inline-size inline-size');
 test_invalid_value('container-type', 'inline-size block-size');
 test_invalid_value('container-type', 'block-size inline-size');
 test_invalid_value('container-type', 'size inline-size');
 test_invalid_value('container-type', 'inline-size size');
-test_invalid_value('container-type', 'none, none');
+test_invalid_value('container-type', 'normal, normal');
 test_invalid_value('container-type', 'foo');
 test_invalid_value('container-type', '"foo"');
 test_invalid_value('container-type', 'foo, bar');

css/css-contain/container-queries/container-units-invalidation.html

@@ -39,27 +39,27 @@
     assert_cqi_equals(child, '30px');
 
     try {
-      inline.style.containerType = 'none';
+      inline.style.containerType = 'normal';
       assert_cqi_equals(child, '50px');
     } finally {
       inline.style = '';
     }
 
     assert_cqi_equals(child, '30px');
-  }, `cqi respond when selected container changes type (inline-size -> none)`);
+  }, `cqi respond when selected container changes type (inline-size -> normal)`);
 
   test(function() {
     assert_cqb_equals(child, '40px');
 
     try {
-      size.style.containerType = 'none';
+      size.style.containerType = 'normal';
       assert_cqb_equals(child, '60px');
     } finally {
       size.style = '';
     }
 
     assert_cqb_equals(child, '40px');
-  }, `cqb respond when selected container changes type (size -> none)`);
+  }, `cqb respond when selected container changes type (size -> normal)`);
 
   test(function() {
     assert_cqb_equals(child, '40px');

css/css-typed-om/the-stylepropertymap/properties/container-type.html

@@ -12,7 +12,7 @@
 'use strict';
 
 runPropertyTests('container-type', [
-  { syntax: 'none' },
+  { syntax: 'normal' },
   { syntax: 'size' },
   { syntax: 'inline-size' },
   { syntax: 'style' },