1 files changed, 76 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-syntax/at-rule-in-declaration-list.html b/testing/web-platform/tests/css/css-syntax/at-rule-in-declaration-list.html
new file mode 100644
index 0000000000..f40975d27e
--- /dev/null
+++ b/testing/web-platform/tests/css/css-syntax/at-rule-in-declaration-list.html
@@ -0,0 +1,76 @@
+<!doctype html>
+<title>CSS Syntax Test: handle at-rules in declaration lists</title>
+<link rel="help" href="https://drafts.csswg.org/css-syntax/#consume-list-of-declarations">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<style id="test_sheet">
+</style>
+<script>
+  function parseRule(rule_text) {
+    let sheet = test_sheet.sheet;
+    if (sheet.cssRules.length != 0)
+      sheet.deleteRule(0);
+    sheet.insertRule(rule_text);
+    return sheet.cssRules[0];
+  }
+
+  test(() => {
+    let rule = parseRule(`
+      div {
+        @at {}
+        color: green;
+      }
+    `);
+    assert_equals(rule.style.color, "green");
+  }, "Allow @-rule with block inside style rule");
+
+  test(() => {
+    let rule = parseRule(`
+      div {
+        @at at;
+        color: green;
+      }
+    `);
+    assert_equals(rule.style.color, "green");
+  }, "Allow @-rule with semi-colon inside style rule");
+
+  test(() => {
+    let rule = parseRule(`
+      @page {
+        @at {}
+        margin-top: 20px;
+      }
+    `);
+    assert_equals(rule.style.marginTop, "20px");
+  }, "Allow @-rule with block inside page rule");
+
+  test(() => {
+    let rule = parseRule(`
+      @page {
+        @at at;
+        margin-top: 20px;
+      }
+    `);
+    assert_equals(rule.style.marginTop, "20px");
+  }, "Allow @-rule with semi-colon inside page rule");
+
+  test(() => {
+    let rule = parseRule(`
+      @font-face {
+        @at {}
+        font-family: myfont;
+      }
+    `);
+    assert_equals(rule.style.fontFamily, "myfont");
+  }, "Allow @-rule with block inside font-face rule");
+
+  test(() => {
+    let rule = parseRule(`
+      @font-face {
+        @at at;
+        font-family: myfont;
+      }
+    `);
+    assert_equals(rule.style.fontFamily, "myfont");
+  }, "Allow @-rule with semi-colon inside font-face rule");
+</script>