at-container-style-parsing.html

Enable keyboard shortcuts

This WPT test may be referenced by the following Test IDs:
- /css/css-conditional/container-queries/at-container-style-parsing.html - WPT Dashboard Interop Dashboard

<!doctype html>

<title>@container: style queries parsing</title>

<link rel="help" href="https://drafts.csswg.org/css-conditional-5/#container-rule">

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

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

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

<div style="container-name:name">

  <main id="cq-main"></main>

</div>

<script>

  setup(() => assert_implements_style_container_queries());

  test_cq_condition_known('style(--my-prop: foo)');

  test_cq_condition_known('style(--my-prop: foo - bar ())');

  test_cq_condition_known('style(not ((--foo: calc(10px + 2em)) and ((--foo: url(x)))))');

  test_cq_condition_known('style((--foo: bar) or (--bar: 10px))');

  test_cq_condition_known('style(--my-prop:)');

  test_cq_condition_known('style(--my-prop: )');

  test_cq_condition_known('style(--foo: bar !important)');

  test_cq_condition_known('style(--foo)');

  test_cq_condition_unknown('style(--foo: bar;)');

  test_cq_condition_unknown('style(style(--foo: bar))');

</script>