Parsing id / class selectors that starts with a hyphen/ number

[coxrichuk]

Please close if this is intended behaviour.

When I parse an ID or Class selector that starts with a hyphen or number this does not throw an error.

Example:

const { createParser } = require('css-selector-parser'); // v3.0.0

const parse = createParser({ strict: true, syntax: 'selectors-3' }); // Have also used css3 as syntax

const selectorWithANumber = parse('#123');
const selectorWithAHyphen = parse('.-foo');

Both return the ast rather than throwing an error

[mdevils]

Hello @coxrichuk,

Good question!

Here is an excerpt from https://www.w3.org/TR/CSS21/syndata.html#declaration:

In CSS, identifiers (including element names, classes, and IDs in selectors) can contain only the characters [a-zA-Z0-9] and ISO 10646 characters U+00A0 and higher, plus the hyphen (-) and the underscore (_); they cannot start with a digit, two hyphens, or a hyphen followed by a digit. Identifiers can also contain escaped characters and any ISO 10646 character as a numeric code (see next item). For instance, the identifier "B&W?" may be written as "B&W?" or "B\26 W\3F".

Basically this says that .-foo is a correct selector, but #123 is not.

Thanks, fixed the case with #123 in version 3.0.2.

[coxrichuk]

That's great thank you @mdevils

One I thing I did note - hyphen followed by a digit

I've just tested the following scenarios of .-1 and #-1 and these both return the ast as well rather than throwing an error

Let me know if you would like a separate issue raised for these?