Skip to content

Character escaping inside selectors #9

Description

@SuggonM

Using the online demo, I'm getting this error in browser console when trying to parse a rule with special characters escaped:

.wendy\'s {}
parse.js:62 Uncaught 
Error: Unmatched ' (line 1, char 8)
    at parseError (parse.js:62:15)
    at Object.parse (parse.js:110:6)
    at outputUpdated (parse.js:151:19)
    at HTMLTextAreaElement.changed (parse.js:185:2)

which is equivalent to this block:

CSSOM/lib/parse.js

Lines 106 to 113 in 64dfbde

case "'":
index = i + 1;
do {
index = token.indexOf("'", index) + 1;
if (!index) {
parseError("Unmatched '");
}
} while (token[index - 2] === '\\');

Another minor issue is that, round braces and many other invalid-but-escapable selectors remain unchanged when using toString(). Perhaps we could somehow ensure that the returned selector of toString() method is always valid?

.wendy(s) {}
// current: .wendy(s) {}
// suggestion: .wendy\(s\) {}
CSSOM.parse('.wendy(s) {}').toString();

I'm trying to parse a fairly large CSS spritesheet that has a lot of these characters, so fixing this would be of huge help!

Another suggestion that may or may not be relevant to this repository is, using a CSS escaping module. Mathias has made one in cssesc and it addresses both cases mentioned above, for example here and here.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions