[css-typed-om] Add constructor for CSSVariableReferenceValue.

As per [1], CSSVariableReferenceValue now has a constructor. We can
get rid of our hacky helper to create CSSVariableReferenceValues.

[1] https://github.com/w3c/css-houdini-drafts/issues/514

Bug: 545318
Change-Id: I1f540514e9a75fb315dc7db16bc99e70ffe911ef
Reviewed-on: https://chromium-review.googlesource.com/822318Reviewed-by: nainar <nainar@chromium.org>
Commit-Queue: Darren Shen <shend@chromium.org>
Cr-Commit-Position: refs/heads/master@{#523989}

third_party/WebKit/LayoutTests/typedcssom/resources/testhelper.js

@@ -60,13 +60,3 @@ const gValidUnits = [
   'turn', 's', 'ms', 'Hz', 'kHz',
   'dpi', 'dpcm', 'dppx', 'fr',
 ];
-
-// Hacky way of creating a CSSVariableReferenceValue
-// since it doesn't expose a constructor.
-function createReferenceValue(variable, fallback) {
-  const varExpr = 'var(' + variable + ')';
-  const unparsedValue = newDivWithStyle('color:' + varExpr).attributeStyleMap.get('color');
-  let referenceValue = unparsedValue[0];
-  referenceValue.fallback = fallback;
-  return referenceValue;
-}

third_party/WebKit/LayoutTests/typedcssom/stylevalue-normalization/normalize-tokens.html

@@ -22,28 +22,28 @@ const gTestCases = [
   {
     value: 'var(--A)',
     expectedResult: [
-      createReferenceValue('--A', null),
+      new CSSVariableReferenceValue('--A'),
     ]
   },
   {
     value: 'var(--A, 1em)',
     expectedResult: [
-      createReferenceValue('--A', new CSSUnparsedValue(' 1em')),
+      new CSSVariableReferenceValue('--A', new CSSUnparsedValue(' 1em')),
     ]
   },
   {
     value: 'var(--A, var(--B))',
     expectedResult: [
-      createReferenceValue('--A', new CSSUnparsedValue(' ', createReferenceValue('--B', null))),
+      new CSSVariableReferenceValue('--A', new CSSUnparsedValue(' ', new CSSVariableReferenceValue('--B'))),
     ]
   },
   {
     value: 'calc(42px + var(--foo, 15em) + var(--bar, var(--far) + 15px))',
     expectedResult: [
       'calc(42px +',
-      createReferenceValue('--foo', new CSSUnparsedValue(' 15em')),
+      new CSSVariableReferenceValue('--foo', new CSSUnparsedValue(' 15em')),
       ' + ',
-      createReferenceValue('--bar', new CSSUnparsedValue(' ', createReferenceValue('--far', null), ' + 15px')),
+      new CSSVariableReferenceValue('--bar', new CSSUnparsedValue(' ', new CSSVariableReferenceValue('--far'), ' + 15px')),
       ')',
     ]
   },

third_party/WebKit/LayoutTests/typedcssom/stylevalue-serialization/cssUnparsedValue.html

@@ -14,23 +14,23 @@ test(() => {
 }, 'CSSUnparsedValue constructed from IDL with strings serializes correctly');
 
 test(() => {
-  assert_equals(new CSSUnparsedValue(createReferenceValue('--A')).toString(), 'var(--A)');
+  assert_equals(new CSSUnparsedValue(new CSSVariableReferenceValue('--A')).toString(), 'var(--A)');
   assert_equals(new CSSUnparsedValue(
-      createReferenceValue('--A'),
-      createReferenceValue('--B')).toString(),
+      new CSSVariableReferenceValue('--A'),
+      new CSSVariableReferenceValue('--B')).toString(),
     'var(--A)var(--B)');
   assert_equals(new CSSUnparsedValue(
-      createReferenceValue('--A',
-        new CSSUnparsedValue(createReferenceValue('--B'))),
-      createReferenceValue('--C')).toString(),
+      new CSSVariableReferenceValue('--A',
+        new CSSUnparsedValue(new CSSVariableReferenceValue('--B'))),
+      new CSSVariableReferenceValue('--C')).toString(),
     'var(--A,var(--B))var(--C)');
 }, 'CSSUnparsedValue constructed from IDL with CSSVariableReferenceValues serializes correctly');
 
 test(() => {
   assert_equals(new CSSUnparsedValue('foo', 'bar ',
-      createReferenceValue('--A',
-        new CSSUnparsedValue('baz ', createReferenceValue('--B'), 'lemon')),
-      createReferenceValue('--C',
+      new CSSVariableReferenceValue('--A',
+        new CSSUnparsedValue('baz ', new CSSVariableReferenceValue('--B'), 'lemon')),
+      new CSSVariableReferenceValue('--C',
         new CSSUnparsedValue('ade'))).toString(),
     'foobar var(--A,baz var(--B)lemon)var(--C,ade)');
 }, 'CSSUnparsedValue constructed from IDL with mix of strings and CSSVariableReferenceValues serializes correctly');

third_party/WebKit/LayoutTests/typedcssom/stylevalue-subclasses/cssUnparsedValue.html

@@ -11,9 +11,9 @@
 const gValidTestArgs = [
   { args: [], desc: 'no arguments' },
   { args: [''], desc: 'an empty string' },
-  { args: [createReferenceValue('--foo', null)], desc: 'a CSSVariableReferenceValue' },
+  { args: [new CSSVariableReferenceValue('--foo')], desc: 'a CSSVariableReferenceValue' },
   {
-    args: ['foo', 'bar', createReferenceValue('--A', null), 'baz', createReferenceValue('--B', null)],
+    args: ['foo', 'bar', new CSSVariableReferenceValue('--A'), 'baz', new CSSVariableReferenceValue('--B')],
     desc: 'mix of strings and CSSVariableReferenceValues'
   },
 ];

third_party/WebKit/LayoutTests/typedcssom/stylevalue-subclasses/cssVariableReferenceValue-expected.txt

 This is a testharness.js-based test.
-FAIL Setting CSSVariableReferenceValue.variable to an invalid variable name throws SyntaxError assert_throws: function "() => result.variable = 'bar'" did not throw
+FAIL Constructing a CSSVariableReferenceValue with an invalid variable name throws SyntaxError assert_throws: function "() => new CSSVariableReferenceValue('bar')" did not throw
+FAIL Updating CSSVariableReferenceValue.variable to an invalid variable name throws SyntaxError assert_throws: function "() => result.variable = 'bar'" did not throw
+PASS CSSVariableReferenceValue can be constructed with no fallback
+PASS CSSVariableReferenceValue can be constructed with fallback
 PASS CSSVariableReferenceValue.variable can updated to a valid variable name
 PASS CSSVariableReferenceValue.fallback can updated to null
 PASS CSSVariableReferenceValue.fallback can updated to a CSSUnparsedValue

third_party/WebKit/LayoutTests/typedcssom/stylevalue-subclasses/cssVariableReferenceValue.html

@@ -9,27 +9,44 @@
 'use strict';
 
 test(() => {
-  let result = createReferenceValue('--foo', null);
+  assert_throws(new SyntaxError(), () => new CSSVariableReferenceValue('bar'));
+  assert_throws(new SyntaxError(), () => new CSSVariableReferenceValue(''));
+}, 'Constructing a CSSVariableReferenceValue with an invalid variable name throws SyntaxError');
+
+test(() => {
+  let result = new CSSVariableReferenceValue('--foo');
   assert_throws(new SyntaxError(), () => result.variable = 'bar');
   assert_equals(result.variable, '--foo');
   assert_throws(new SyntaxError(), () => result.variable = '');
   assert_equals(result.variable, '--foo');
-}, 'Setting CSSVariableReferenceValue.variable to an invalid variable name throws SyntaxError');
+}, 'Updating CSSVariableReferenceValue.variable to an invalid variable name throws SyntaxError');
+
+test(() => {
+  const result = new CSSVariableReferenceValue('--foo');
+  assert_equals(result.variable, '--foo');
+  assert_equals(result.fallback, null);
+}, 'CSSVariableReferenceValue can be constructed with no fallback');
+
+test(() => {
+  const result = new CSSVariableReferenceValue('--foo', new CSSUnparsedValue('lemon'));
+  assert_equals(result.variable, '--foo');
+  assert_style_value_equals(result.fallback, new CSSUnparsedValue('lemon'));
+}, 'CSSVariableReferenceValue can be constructed with fallback');
 
 test(() => {
-  let result = createReferenceValue('--foo', null);
+  let result = new CSSVariableReferenceValue('--foo');
   result.variable = '--bar';
   assert_equals(result.variable, '--bar');
 }, 'CSSVariableReferenceValue.variable can updated to a valid variable name');
 
 test(() => {
-  let result = createReferenceValue('--foo', new CSSUnparsedValue());
+  let result = new CSSVariableReferenceValue('--foo', new CSSUnparsedValue());
   result.fallback = null;
   assert_equals(result.fallback, null);
 }, 'CSSVariableReferenceValue.fallback can updated to null');
 
 test(() => {
-  let result = createReferenceValue('--foo', null);
+  let result = new CSSVariableReferenceValue('--foo');
   result.fallback = new CSSUnparsedValue('foo');
   assert_style_value_equals(result.fallback, new CSSUnparsedValue('foo'));
 }, 'CSSVariableReferenceValue.fallback can updated to a CSSUnparsedValue');

third_party/WebKit/Source/core/css/cssom/CSSStyleVariableReferenceValue.h

@@ -21,8 +21,9 @@ class CORE_EXPORT CSSStyleVariableReferenceValue final
  public:
   virtual ~CSSStyleVariableReferenceValue() = default;
 
-  static CSSStyleVariableReferenceValue* Create(const String& variable,
-                                                CSSUnparsedValue* fallback) {
+  static CSSStyleVariableReferenceValue* Create(
+      const String& variable,
+      CSSUnparsedValue* fallback = nullptr) {
     return new CSSStyleVariableReferenceValue(variable, fallback);
   }
 

third_party/WebKit/Source/core/css/cssom/CSSVariableReferenceValue.idl

@@ -5,6 +5,7 @@
 // Represents a CSS var() reference in a CSS value.
 // Spec: https://drafts.css-houdini.org/css-typed-om/#cssvariablereferencevalue
 [
+    Constructor(DOMString variable, optional CSSUnparsedValue fallback),
     Exposed=(Window,PaintWorklet),
     RuntimeEnabled=CSSTypedOM,
     ImplementedAs=CSSStyleVariableReferenceValue