wpt / css / css-properties-values-api / at-property.html

Status: FAIL | Duration: 99ms | Subtests: 0/106 | Open test on wpt.live | wpt.fyi

Data from commit:
a50cb89 wpt: run reference-named files which are themselves tests (#836) (2026-09-03)

SubtestStatusMessage
Attribute 'syntax' returns expected value for ["<color>"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' returns expected value for ["<color> | none"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' returns expected value for ["<color># | <image> | none"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' returns expected value for ["foo | <length>#"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' returns expected value for ["foo | bar | baz"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' returns expected value for ["notasyntax"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' returns expected value for ["*"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' returns expected value for [" * "]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' returns expected value for ["* "]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' returns expected value for [" * "]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' returns expected value for ["red"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' makes the @property rule invalid for ["rgb(255, 0, 0)"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' makes the @property rule invalid for [<color>]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' makes the @property rule invalid for [foo | bar]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' makes the @property rule invalid for ["default"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' makes the @property rule invalid for ["Default"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' makes the @property rule invalid for ["initial"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' makes the @property rule invalid for ["Initial"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' makes the @property rule invalid for ["inherit"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' makes the @property rule invalid for ["Inherit"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' makes the @property rule invalid for ["unset"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' makes the @property rule invalid for ["Unset"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' makes the @property rule invalid for ["revert"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' makes the @property rule invalid for ["Revert"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' makes the @property rule invalid for ["revert-layer"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' makes the @property rule invalid for ["Revert-layer"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' makes the @property rule invalid for ["foo bar"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' makes the @property rule invalid for ["Foo <length>"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' makes the @property rule invalid for ["foo, bar"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' makes the @property rule invalid for ["<length> <percentage>"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'syntax' makes the @property rule invalid for ["|<length>"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'initial-value' returns expected value for [10px]FAILcannot convert 'null' or 'undefined' to object
Attribute 'initial-value' returns expected value for [rgb(1, 2, 3)]FAILcannot convert 'null' or 'undefined' to object
Attribute 'initial-value' returns expected value for [red]FAILcannot convert 'null' or 'undefined' to object
Attribute 'initial-value' returns expected value for [foo]FAILcannot convert 'null' or 'undefined' to object
Attribute 'initial-value' returns expected value for [foo(){}]FAILcannot convert 'null' or 'undefined' to object
Attribute 'initial-value' makes the @property rule invalid for [3em]FAILcannot convert 'null' or 'undefined' to object
Attribute 'initial-value' makes the @property rule invalid for [var(--x)]FAILcannot convert 'null' or 'undefined' to object
Attribute 'inherits' returns expected value for [true]FAILcannot convert 'null' or 'undefined' to object
Attribute 'inherits' returns expected value for [false]FAILcannot convert 'null' or 'undefined' to object
Attribute 'inherits' makes the @property rule invalid for [none]FAILcannot convert 'null' or 'undefined' to object
Attribute 'inherits' makes the @property rule invalid for [0]FAILcannot convert 'null' or 'undefined' to object
Attribute 'inherits' makes the @property rule invalid for [1]FAILcannot convert 'null' or 'undefined' to object
Attribute 'inherits' makes the @property rule invalid for ["true"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'inherits' makes the @property rule invalid for ["false"]FAILcannot convert 'null' or 'undefined' to object
Attribute 'inherits' makes the @property rule invalid for [calc(0)]FAILcannot convert 'null' or 'undefined' to object
Invalid property name does not parse [foo]FAILcannot convert 'null' or 'undefined' to object
Invalid property name does not parse [-foo]FAILcannot convert 'null' or 'undefined' to object
Rule applied [*, foo(){}, false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<angle>, 42deg, false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<angle>, 1turn, false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<color>, green, false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<color>, rgb(1, 2, 3), false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<image>, url("http://a/"), false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<integer>, 5, false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<length-percentage>, 10px, false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<length-percentage>, 10%, false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<length-percentage>, calc(10% + 10px), false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<length>, 10px, false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<number>, 2.5, false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<percentage>, 10%, false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<resolution>, 50dppx, false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<resolution>, 96dpi, false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<time>, 10s, false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<time>, 1000ms, false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<transform-function>, rotateX(0deg), false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<transform-list>, rotateX(0deg), false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<transform-list>, rotateX(0deg) translateX(10px), false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<url>, url("http://a/"), false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<string>, 'foo bar', false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<string>, 'foo bar' , false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<string>, '"foo" bar', false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<string>, "bar baz", false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<string>, "bar 'baz'", false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<string>+, 'foo' 'bar', false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<string>#, 'foo', 'bar', false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<string>+ | <string>#, 'foo' 'bar', false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<string>+ | <string>#, 'foo' 'bar', false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<string>+ | <string>#, 'foo' "bar", false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<string># | <string>+, 'foo', 'bar', false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<string># | <string>+, 'foo', 'bar' , false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<string># | <string>+, "foo", 'bar', false]FAILcannot convert 'null' or 'undefined' to object
Rule not applied [<string>, 1px, false]FAILcannot convert 'null' or 'undefined' to object
Rule not applied [<string>, foo, false]FAILcannot convert 'null' or 'undefined' to object
Rule not applied [<string>, calc(1 + 2), false]FAILcannot convert 'null' or 'undefined' to object
Rule not applied [<string>, rgb(255, 99, 71), false]FAILcannot convert 'null' or 'undefined' to object
Rule not applied [<string>, 'foo' 2px, false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<color>, tomato, false]FAILcannot convert 'null' or 'undefined' to object
Rule applied [<color>, tomato, true]FAILcannot convert 'null' or 'undefined' to object
Rule applied for "*", even with no initial valueFAILcannot convert 'null' or 'undefined' to object
Rule not applied [undefined, green, false]FAILcannot convert 'null' or 'undefined' to object
Rule not applied [<color>, undefined, false]FAILcannot convert 'null' or 'undefined' to object
Rule not applied [<color>, green, undefined]FAILcannot convert 'null' or 'undefined' to object
Rule not applied [<gandalf>, grey, false]FAILcannot convert 'null' or 'undefined' to object
Rule not applied [gandalf, grey, false]FAILcannot convert 'null' or 'undefined' to object
Rule not applied [<color>, notacolor, false]FAILcannot convert 'null' or 'undefined' to object
Rule not applied [<length>, 10em, false]FAILcannot convert 'null' or 'undefined' to object
Rule not applied [<transform-function>, translateX(1em), false]FAILcannot convert 'null' or 'undefined' to object
Rule not applied [<transform-function>, translateY(1lh), false]FAILcannot convert 'null' or 'undefined' to object
Rule not applied [<transform-list>, rotate(10deg) translateX(1em), false]FAILcannot convert 'null' or 'undefined' to object
Rule not applied [<transform-list>, rotate(10deg) translateY(1lh), false]FAILcannot convert 'null' or 'undefined' to object
Non-inherited properties do not inheritFAILcannot convert 'null' or 'undefined' to object
Inherited properties inheritFAILcannot convert 'null' or 'undefined' to object
Initial values substituted as computed valueFAILcannot convert 'null' or 'undefined' to object
Non-universal registration are invalid without an initial valueFAILcannot convert 'null' or 'undefined' to object
Initial value may be omitted for universal registrationFAILcannot convert 'null' or 'undefined' to object

/css/css-properties-values-api/at-property.html

<!DOCTYPE html>
<link rel="help" href="https://drafts.css-houdini.org/css-properties-values-api-1/#at-property-rule">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="./resources/utils.js"></script>
<div id="outer">
  <div id="target"></div>
</div>
<script>

// Parsing:

let uppercase_first = (x) => x.charAt(0).toUpperCase() + x.slice(1);
let to_camel_case = (x) => x.split('-')[0] + x.split('-').slice(1).map(uppercase_first).join('');

function get_cssom_descriptor_value(rule, descriptor) {
  switch (descriptor) {
    case 'syntax':
      return rule.syntax;
    case 'inherits':
      return rule.inherits;
    case 'initial-value':
      return rule.initialValue;
    default:
      assert_true(false, 'Should not reach here');
      return null;
  }
}

// Test that for the given descriptor (e.g. 'syntax'), the specified value
// will yield the expected_value when observed using CSSOM. If the expected_value
// is omitted, it is the same as the specified value.
function test_descriptor(descriptor, specified_value, expected_value, other_descriptors) {
  // Try and build a valid @property form the specified descriptor.
  let at_property = { [to_camel_case(descriptor)]: specified_value };

  // If extra values are specified in other_descriptors, just use them.
  if (typeof(other_descriptors) !== 'unspecified') {
    for (let name in other_descriptors) {
      if (other_descriptors.hasOwnProperty(name)) {
        if (name == descriptor) {
          throw `Unexpected ${name} in other_descriptors`;
        }
        at_property[to_camel_case(name)] = other_descriptors[name];
      }
    }
  }

  if (!('syntax' in at_property)) {
    // The syntax descriptor is required. Use the universal one as a fallback.
    // https://drafts.css-houdini.org/css-properties-values-api-1/#the-syntax-descriptor
    at_property.syntax = '"*"';
  }
  if (!('inherits' in at_property)) {
    // The inherits descriptor is required. Make it true as a fallback.
    // https://drafts.css-houdini.org/css-properties-values-api-1/#inherits-descriptor
    at_property.inherits = true;
  }
  if (!at_property.syntax.match(/^"\s*\*\s*"$/) &&
      !('initialValue' in at_property)) {
    // The initial-value is required for non-universal syntax.
    // Pick a computationally independent value that follows specified syntax.
    // https://drafts.css-houdini.org/css-properties-values-api-1/#the-syntax-descriptor
    at_property.initialValue = (() => {
      let first_syntax_component = specified_value
        .replace(/^"(.*)"$/, '$1') // unquote
        .replace(/[\s\uFEFF\xA0]+/g, ' ') // collapse whitespaces
        .match(/^[^|\#\+]*/)[0] // pick first component
        .trim();
       switch (first_syntax_component) {
         case '<color>': return 'blue';
         case '<length>': return '42px';
         default:
           if (first_syntax_component.startsWith('<')) {
             throw `Unsupported data type name '${first_syntax_component}'`;
           }
           return first_syntax_component; // <custom-ident>
       }
    })();
  }

  if (expected_value === null) {
    test_with_at_property(at_property, (name, rule) => {
      assert_true(!rule);
    }, `Attribute '${descriptor}' makes the @property rule invalid for [${specified_value}]`);
  } else {
    if (typeof(expected_value) === 'undefined')
      expected_value = specified_value;
    test_with_at_property(at_property, (name, rule) => {
      assert_equals(get_cssom_descriptor_value(rule, descriptor), expected_value);
    }, `Attribute '${descriptor}' returns expected value for [${specified_value}]`);
  }
}

// syntax
test_descriptor('syntax', '"<color>"', '<color>');
test_descriptor('syntax', '"<color> | none"', '<color> | none');
test_descriptor('syntax', '"<color># | <image> | none"', '<color># | <image> | none');
test_descriptor('syntax', '"foo | <length>#"', 'foo | <length>#');
test_descriptor('syntax', '"foo | bar | baz"', 'foo | bar | baz');
test_descriptor('syntax', '"notasyntax"', 'notasyntax');

// syntax: universal
for (const syntax of ["*", " * ", "* ", "\t*\t"]) {
  test_descriptor('syntax', `"${syntax}"`, syntax);
}

// syntax: <color> value
test_descriptor('syntax', '"red"', "red"); // treated as <custom-ident>.
test_descriptor('syntax', '"rgb(255, 0, 0)"', null);

// syntax: missing quotes
test_descriptor('syntax', '<color>', null);
test_descriptor('syntax', 'foo | bar', null);

// syntax: invalid <custom-ident>
// https://drafts.csswg.org/css-values-4/#custom-idents
for (const syntax of
  ["default",
   "initial",
   "inherit",
   "unset",
   "revert",
   "revert-layer",
  ]) {
  test_descriptor('syntax', `"${syntax}"`, null);
  test_descriptor('syntax', `"${uppercase_first(syntax)}"`, null);
}

// syntax: pipe between components
test_descriptor('syntax', '"foo bar"', null, {'initial-value': 'foo bar'});
test_descriptor('syntax', '"Foo <length>"', null, {'initial-value': 'Foo 42px'});
test_descriptor('syntax', '"foo, bar"', null, {'initial-value': 'foo, bar'});
test_descriptor('syntax', '"<length> <percentage>"', null, {'initial-value': '42px 100%'});

// syntax: leading bar
test_descriptor('syntax', '"|<length>"', null, {'initial-value': '42px'});

// initial-value
test_descriptor('initial-value', '10px');
test_descriptor('initial-value', 'rgb(1, 2, 3)');
test_descriptor('initial-value', 'red');
test_descriptor('initial-value', 'foo');
test_descriptor('initial-value', 'foo(){}');

// initial-value: not computationally independent
test_descriptor('initial-value', '3em', null, {'syntax': '"<length>"'});
test_descriptor('initial-value', 'var(--x)', null);

// inherits
test_descriptor('inherits', 'true', true);
test_descriptor('inherits', 'false', false);

test_descriptor('inherits', 'none', null);
test_descriptor('inherits', '0', null);
test_descriptor('inherits', '1', null);
test_descriptor('inherits', '"true"', null);
test_descriptor('inherits', '"false"', null);
test_descriptor('inherits', 'calc(0)', null);

test_with_style_node('@property foo { }', (node) => {
  assert_equals(node.sheet.rules.length, 0);
}, 'Invalid property name does not parse [foo]');

test_with_style_node('@property -foo { }', (node) => {
  assert_equals(node.sheet.rules.length, 0);
}, 'Invalid property name does not parse [-foo]');

// Applying @property rules

function test_applied(syntax, initial, inherits, expected) {
  test_with_at_property({
    syntax: `"${syntax}"`,
    initialValue: initial,
    inherits: inherits
  }, (name, rule) => {
    let actual = getComputedStyle(target).getPropertyValue(name);
    assert_equals(actual, expected);
  }, `Rule applied [${syntax}, ${initial}, ${inherits}]`);
}

function test_not_applied(syntax, initial, inherits) {
  test_with_at_property({
    syntax: `"${syntax}"`,
    initialValue: initial,
    inherits: inherits
  }, (name, rule) => {
    let actual = getComputedStyle(target).getPropertyValue(name);
    assert_equals(actual, '');
  }, `Rule not applied [${syntax}, ${initial}, ${inherits}]`);
}

// syntax, initialValue, inherits, expected
test_applied('*', 'foo(){}', false, 'foo(){}');
test_applied('<angle>', '42deg', false, '42deg');
test_applied('<angle>', '1turn', false, '360deg');
test_applied('<color>', 'green', false, 'rgb(0, 128, 0)');
test_applied('<color>', 'rgb(1, 2, 3)', false, 'rgb(1, 2, 3)');
test_applied('<image>', 'url("http://a/")', false, 'url("http://a/")');
test_applied('<integer>', '5', false, '5');
test_applied('<length-percentage>', '10px', false, '10px');
test_applied('<length-percentage>', '10%', false, '10%');
test_applied('<length-percentage>', 'calc(10% + 10px)', false, 'calc(10% + 10px)');
test_applied('<length>', '10px', false, '10px');
test_applied('<number>', '2.5', false, '2.5');
test_applied('<percentage>', '10%', false, '10%');
test_applied('<resolution>', '50dppx', false, '50dppx');
test_applied('<resolution>', '96dpi', false, '1dppx');
test_applied('<time>', '10s', false, '10s');
test_applied('<time>', '1000ms', false, '1s');
test_applied('<transform-function>', 'rotateX(0deg)', false, 'rotateX(0deg)');
test_applied('<transform-list>', 'rotateX(0deg)', false, 'rotateX(0deg)');
test_applied('<transform-list>', 'rotateX(0deg) translateX(10px)', false, 'rotateX(0deg) translateX(10px)');
test_applied('<url>', 'url("http://a/")', false, 'url("http://a/")');

test_applied("<string>", "'foo bar'", false, '"foo bar"');
test_applied("<string>", " 'foo bar' ", false, '"foo bar"');
test_applied("<string>", `'"foo" bar'`, false, '"\\"foo\\" bar"');
test_applied("<string>", '"bar baz"', false, '"bar baz"');
test_applied("<string>", `"bar 'baz'"`, false, `"bar 'baz'"`);
test_applied("<string>+", "'foo' 'bar'", false, '"foo" "bar"');
test_applied("<string>#", "'foo', 'bar'", false, '"foo", "bar"');
test_applied("<string>+ | <string>#", "'foo' 'bar'", false, '"foo" "bar"');
test_applied("<string>+ | <string>#", " 'foo' 'bar'", false, '"foo" "bar"');
test_applied("<string>+ | <string>#", `'foo' "bar"`, false, '"foo" "bar"');
test_applied("<string># | <string>+", "'foo', 'bar'", false, '"foo", "bar"');
test_applied("<string># | <string>+", "'foo', 'bar' ", false, '"foo", "bar"');
test_applied("<string># | <string>+", `"foo", 'bar'`, false, '"foo", "bar"');

test_not_applied("<string>", "1px", false);
test_not_applied("<string>", "foo", false);
test_not_applied("<string>", "calc(1 + 2)", false);
test_not_applied("<string>", "rgb(255, 99, 71)", false);
test_not_applied("<string>", "'foo' 2px", false);

// inherits: true/false
test_applied('<color>', 'tomato', false, 'rgb(255, 99, 71)');
test_applied('<color>', 'tomato', true, 'rgb(255, 99, 71)');

test_with_at_property({ syntax: '"*"', inherits: true }, (name, rule) => {
  try {
    outer.style.setProperty(name, 'foo');
    let actual = getComputedStyle(target).getPropertyValue(name);
    assert_equals(actual, 'foo');
  } finally {
    outer.style = '';
  }
}, 'Rule applied for "*", even with no initial value');

test_not_applied(undefined, 'green', false);
test_not_applied('<color>', undefined, false);
test_not_applied('<color>', 'green', undefined);
test_not_applied('<gandalf>', 'grey', false);
test_not_applied('gandalf', 'grey', false);
test_not_applied('<color>', 'notacolor', false);
test_not_applied('<length>', '10em', false);

test_not_applied('<transform-function>', 'translateX(1em)', false);
test_not_applied('<transform-function>', 'translateY(1lh)', false);
test_not_applied('<transform-list>', 'rotate(10deg) translateX(1em)', false);
test_not_applied('<transform-list>', 'rotate(10deg) translateY(1lh)', false);

// Inheritance

test_with_at_property({
  syntax: '"<length>"',
  inherits: false,
  initialValue: '0px'
}, (name, rule) => {
  try {
    outer.style = `${name}: 40px`;
    assert_equals(getComputedStyle(outer).getPropertyValue(name), '40px');
    assert_equals(getComputedStyle(target).getPropertyValue(name), '0px');
  } finally {
    outer.style = '';
  }
}, 'Non-inherited properties do not inherit');

test_with_at_property({
  syntax: '"<length>"',
  inherits: true,
  initialValue: '0px'
}, (name, rule) => {
  try {
    outer.style = `${name}: 40px`;
    assert_equals(getComputedStyle(outer).getPropertyValue(name), '40px');
    assert_equals(getComputedStyle(target).getPropertyValue(name), '40px');
  } finally {
    outer.style = '';
  }
}, 'Inherited properties inherit');

// Initial values

test_with_at_property({
  syntax: '"<color>"',
  inherits: true,
  initialValue: 'green'
}, (name, rule) => {
  try {
    target.style = `--x:var(${name})`;
    assert_equals(getComputedStyle(target).getPropertyValue(name), 'rgb(0, 128, 0)');
  } finally {
    target.style = '';
  }
}, 'Initial values substituted as computed value');

test_with_at_property({
  syntax: '"<length>"',
  inherits: false,
  initialValue: undefined
}, (name, rule) => {
  try {
    target.style = `${name}: calc(1px + 1px);`;
    assert_equals(getComputedStyle(target).getPropertyValue(name), 'calc(1px + 1px)');
  } finally {
    target.style = '';
  }
}, 'Non-universal registration are invalid without an initial value');

test_with_at_property({
  syntax: '"*"',
  inherits: false,
  initialValue: undefined
}, (name, rule) => {
  try {
    // If the registration suceeded, ${name} does *not* inherit, and hence
    // the computed value on 'target' should be empty.
    outer.style = `${name}: calc(1px + 1px);`;
    assert_equals(getComputedStyle(target).getPropertyValue(name), '');
  } finally {
    outer.style = '';
  }
}, 'Initial value may be omitted for universal registration');

</script>