attr-fallback-braces.html

Enable keyboard shortcuts

This WPT test may be referenced by the following Test IDs:
- /css/css-values/attr-fallback-braces.html - WPT Dashboard Interop Dashboard

<!DOCTYPE html>

<title>CSS Values: {}-wrapped attr() fallback</title>

<link rel="help" href="https://drafts.csswg.org/css-values-5/#component-function-commas">

<link rel="help" href="https://drafts.csswg.org/css-values-5/#attr-notation">

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

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

<script src="/css/support/computed-testcommon.js"></script>

<script src="/css/support/parsing-testcommon.js"></script>

<div id="target"></div>

<script>

  test_computed_value('color', 'attr(data-missing type(<color>), {rgb(1, 2, 3)})', 'rgb(1, 2, 3)');

  test_computed_value('color', 'attr(data-missing type(<color>), { rgb(1, 2, 3) })', 'rgb(1, 2, 3)');

  test_computed_value('color', 'attr(data-missing type(<color>), {rgb(1, 2, 3)} )', 'rgb(1, 2, 3)');

  test_computed_value('font-family', 'attr(data-missing, {Arial, sans-serif})', 'Arial, sans-serif');

  test_invalid_value('color', 'attr(data-missing type(<color>), {rgb(1, 2, 3)} rgb(4, 5, 6))');

  test_invalid_value('font-family', 'attr(data-missing, {Arial}, sans-serif)');

</script>