Sitelet https://github.com/fb55/css-what/commit/75d10611386664d8b6014f9da83ac81dee4c1565
Skip to content

Commit 75d1061

Browse files
authored
feat(parse): Support legacy pseudo-elements (#692)
1 parent 99d0ccb commit 75d1061

2 files changed

Lines changed: 30 additions & 1 deletion

File tree

‎src/parse.spec.ts‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -61,4 +61,10 @@ describe("Parse", () => {
6161

6262
expect(() => parse("/*/")).toThrowError("Comment was not terminated");
6363
});
64+
65+
it("should support legacy pseudo-elements with single colon", () => {
66+
expect(parse(":before")).toEqual([
67+
[{ name: "before", data: null, type: "pseudo-element" }],
68+
]);
69+
});
6470
});

‎src/parse.ts‎

Lines changed: 24 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -67,6 +67,19 @@ const unpackPseudos = new Set([
6767
"host-context",
6868
]);
6969

70+
/**
71+
* Pseudo elements defined in CSS Level 1 and CSS Level 2 can be written with
72+
* a single colon; eg. :before will turn into ::before.
73+
*
74+
* @see {@link https://www.w3.org/TR/2018/WD-selectors-4-20181121/#pseudo-element-syntax}
75+
*/
76+
const pseudosToPseudoElements = new Set([
77+
"before",
78+
"after",
79+
"first-line",
80+
"first-letter",
81+
]);
82+
7083
/**
7184
* Checks whether a specific selector is a traversal.
7285
* This is useful eg. in swapping the order of elements that
@@ -472,10 +485,20 @@ function parseSelector(
472485
? readValueWithParenthesis()
473486
: null,
474487
});
475-
continue;
488+
break;
476489
}
477490

478491
const name = getName(1).toLowerCase();
492+
493+
if (pseudosToPseudoElements.has(name)) {
494+
tokens.push({
495+
type: SelectorType.PseudoElement,
496+
name,
497+
data: null,
498+
});
499+
break;
500+
}
501+
479502
let data: DataType = null;
480503

481504
if (

0 commit comments

Comments
 (0)