test: Adopt CSS Selector parsing tests from WPT

src/wpt.spec.ts

@@ -0,0 +1,184 @@
+/**
+ * @fileoverview CSS Selector parsing tests from WPT
+ * @see https://github.com/web-platform-tests/wpt/tree/0bb883967c888261a8372923fd61eb5ad14305b2/css/selectors/parsing
+ * @license BSD-3-Clause (https://github.com/web-platform-tests/wpt/blob/master/LICENSE.md)
+ */
+
+import { parse, stringify } from ".";
+
+function test_valid_selector(
+    selector: string,
+    serialized: string | string[] = selector
+) {
+    const result = stringify(parse(selector));
+    if (Array.isArray(serialized)) {
+        // Should be a part of the array
+        expect(serialized).toContain(result);
+    } else {
+        expect(result).toStrictEqual(serialized);
+    }
+}
+
+function test_invalid_selector(selector: string) {
+    expect(() => parse(selector)).toThrow(Error);
+}
+
+describe("Web Platform Tests", () => {
+    it("Attribute selectors", () => {
+        // Attribute presence and value selectors
+        test_valid_selector("[att]");
+        test_valid_selector("[att=val]", '[att="val"]');
+        test_valid_selector("[att~=val]", '[att~="val"]');
+        test_valid_selector("[att|=val]", '[att|="val"]');
+        test_valid_selector("h1[title]");
+        test_valid_selector("span[class='example']", 'span[class="example"]');
+        test_valid_selector("a[hreflang=fr]", 'a[hreflang="fr"]');
+        test_valid_selector("a[hreflang|='en']", 'a[hreflang|="en"]');
+
+        // Substring matching attribute selectors
+        test_valid_selector("[att^=val]", '[att^="val"]');
+        test_valid_selector("[att$=val]", '[att$="val"]');
+        test_valid_selector("[att*=val]", '[att*="val"]');
+        test_valid_selector('object[type^="image/"]');
+        test_valid_selector('a[href$=".html"]');
+        test_valid_selector('p[title*="hello"]');
+
+        // From Attribute selectors and namespaces examples in spec:
+        test_valid_selector("[*|att]");
+        test_valid_selector("[|att]", "[att]");
+    });
+
+    it("Child combinators", () => {
+        test_valid_selector("body > p");
+        test_valid_selector("div ol>li p", "div ol > li p");
+    });
+
+    it("Class selectors", () => {
+        test_valid_selector("*.pastoral", ["*.pastoral", ".pastoral"]);
+        test_valid_selector(".pastoral", ["*.pastoral", ".pastoral"]);
+        test_valid_selector("h1.pastoral");
+        test_valid_selector("p.pastoral.marine");
+    });
+
+    it("Descendant combinator", () => {
+        test_valid_selector("h1 em");
+        test_valid_selector("div * p");
+        test_valid_selector("div p *[href]", ["div p *[href]", "div p [href]"]);
+    });
+
+    it(":focus-visible pseudo-class", () => {
+        test_valid_selector(":focus-visible");
+        test_valid_selector("a:focus-visible");
+        test_valid_selector(":focus:not(:focus-visible)");
+    });
+
+    it("The relational pseudo-class", () => {
+        test_valid_selector(":has(a)");
+        test_valid_selector(":has(#a)");
+        test_valid_selector(":has(.a)");
+        test_valid_selector(":has([a])");
+        test_valid_selector(':has([a="b"])');
+        test_valid_selector(':has([a|="b"])');
+        test_valid_selector(":has(:hover)");
+        test_valid_selector("*:has(.a)", ["*:has(.a)", ":has(.a)"]);
+        test_valid_selector(".a:has(.b)");
+        test_valid_selector(".a:has(> .b)");
+        test_valid_selector(".a:has(~ .b)");
+        test_valid_selector(".a:has(+ .b)");
+        test_valid_selector(".a:has(.b) .c");
+        test_valid_selector(".a .b:has(.c)");
+        test_valid_selector(".a .b:has(.c .d)");
+        test_valid_selector(".a .b:has(.c .d) .e");
+        test_valid_selector(".a:has(.b:has(.c))");
+        test_valid_selector(".a:has(.b:is(.c .d))");
+        test_valid_selector(".a:has(.b:is(.c:has(.d) .e))");
+        test_valid_selector(".a:is(.b:has(.c) .d)");
+        test_valid_selector(".a:not(:has(.b))");
+        test_valid_selector(".a:has(:not(.b))");
+        test_valid_selector(".a:has(.b):has(.c)");
+        test_valid_selector("*|*:has(*)", ":has(*)");
+        test_valid_selector(":has(*|*)");
+        test_invalid_selector(".a:has()");
+    });
+
+    it("ID selectors", () => {
+        test_valid_selector("h1#chapter1");
+        test_valid_selector("#chapter1");
+        test_valid_selector("*#z98y", ["*#z98y", "#z98y"]);
+    });
+
+    it("The Matches-Any Pseudo-class: ':is()'", () => {
+        test_valid_selector(
+            ":is(ul,ol,.list) > [hidden]",
+            ":is(ul, ol, .list) > [hidden]"
+        );
+        test_valid_selector(":is(:hover,:focus)", ":is(:hover, :focus)");
+        test_valid_selector("a:is(:not(:hover))");
+
+        test_valid_selector(":is(#a)");
+        test_valid_selector(".a.b ~ :is(.c.d ~ .e.f)");
+        test_valid_selector(".a.b ~ .c.d:is(span.e + .f, .g.h > .i.j .k)");
+    });
+
+    it("The negation pseudo-class", () => {
+        test_valid_selector("button:not([disabled])");
+        test_valid_selector("*:not(foo)", ["*:not(foo)", ":not(foo)"]);
+        test_valid_selector(":not(:link):not(:visited)");
+        test_valid_selector("*|*:not(*)", ":not(*)");
+        test_valid_selector(":not(:hover)");
+        test_valid_selector(":not(*|*)");
+        test_valid_selector("foo:not(bar)");
+        test_valid_selector(":not(:not(foo))");
+        test_valid_selector(":not(.a .b)");
+        test_valid_selector(":not(.a + .b)");
+        test_valid_selector(":not(.a .b ~ c)");
+        test_valid_selector(":not(span.a, div.b)");
+        test_valid_selector(":not(.a .b ~ c, .d .e)");
+        test_valid_selector(":not(:host)");
+        test_valid_selector(":not(:host(.a))");
+        test_valid_selector(":host(:not(.a))");
+        test_valid_selector(":not(:host(:not(.a)))");
+        test_valid_selector(
+            ":not([disabled][selected])",
+            ":not([disabled][selected])"
+        );
+        test_valid_selector(
+            ":not([disabled],[selected])",
+            ":not([disabled], [selected])"
+        );
+
+        test_invalid_selector(":not()");
+        test_invalid_selector(":not(:not())");
+    });
+
+    it("Sibling combinators", () => {
+        test_valid_selector("math + p");
+        test_valid_selector("h1.opener + h2");
+        test_valid_selector("h1 ~ pre");
+    });
+
+    it("Universal selector", () => {
+        test_valid_selector("*");
+        test_valid_selector("div :first-child", [
+            "div *:first-child",
+            "div :first-child",
+        ]);
+        test_valid_selector("div *:first-child", [
+            "div *:first-child",
+            "div :first-child",
+        ]);
+    });
+
+    it("The Specificity-adjustment Pseudo-class: ':where()'", () => {
+        test_valid_selector(
+            ":where(ul,ol,.list) > [hidden]",
+            ":where(ul, ol, .list) > [hidden]"
+        );
+        test_valid_selector(":where(:hover,:focus)", ":where(:hover, :focus)");
+        test_valid_selector("a:where(:not(:hover))");
+
+        test_valid_selector(":where(#a)");
+        test_valid_selector(".a.b ~ :where(.c.d ~ .e.f)");
+        test_valid_selector(".a.b ~ .c.d:where(span.e + .f, .g.h > .i.j .k)");
+    });
+});