https://github.com/tabatkins/parse-css

:horse_racing: Standards-based CSS Parser
https://github.com/tabatkins/parse-css

Last synced: 30 days ago
JSON representation

:horse_racing: Standards-based CSS Parser

• Host: GitHub
• URL: https://github.com/tabatkins/parse-css
• Owner: tabatkins
• License: other
• Created: 2012-07-12T22:58:57.000Z (over 12 years ago)
• Default Branch: main
• Last Pushed: 2024-07-20T13:12:23.000Z (4 months ago)
• Last Synced: 2024-10-04T09:49:36.801Z (about 1 month ago)
• Language: JavaScript
• Homepage:
• Size: 142 KB
• Stars: 341
• Watchers: 23
• Forks: 41
• Open Issues: 8
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
Standards-Based CSS Parser

==========================

This project implements a standards-based CSS Parser.

I'm the editor of the CSS Syntax spec ,

and need an implementation of it for testing purposes.

This parser is *not* designed to be fast,

but users tell me it's actually rather speedy.

(I suppose it's faster than running a ton of regexes over a bunch of text!)

Its structure and coding style are instead meant to be very close to the spec,

so that it's easy to verify that the code matches the spec

(and vice versa)

and to make it easy,

when the spec changes,

to make the same change in the parser.

It is intended to fully and completely match browser behavior

(at least, as much as the final spec does).

There's a [dingus](https://tabatkins.github.io/parse-css/example.html) for testing it out,

or just quickly checking what some CSS parses into.

Using the Library

-----------------

Include `parse-css.js` in your page.

Then just call the desired parsing function,

named after the algorithms in the spec:

`parseAStylesheet()`, etc.

You can pass a string

or a list of tokens

(such as what's produced by the `tokenize()` function).

It'll return an appropriate object,

as specified by the parsing function.

If you want to get access to the tokens directly,

call `tokenize()` with a string;

it'll return a list of tokens.

Note that the Syntax spec,

and thus this parser,

is *extremely generic*.

It doesn't have any specific knowledge of CSS rules,

just the core syntax,

so it won't throw out invalid or unknown things.

Parsing Functions

-----------------

Here's the full list of parsing functions.

They do exactly what they say in their name,

because they're named exactly the same as the corresponding section of the Syntax spec:

* `parseAStylesheet()`

* `parseAStylesheetsContents()`

* `parseABlocksContents()`

* `parseARule()`

* `parseADeclaration()`

* `parseAComponentValue()`

* `parseAListOfComponentValues()`

* `parseACommaSeparatedListOfComponentValues()`

Node Integration

----------------

`parse-css.js` uses the UMD module pattern,

exporting the parser functions, the `tokenize()` function,

and all of the classes used by the parser and tokenizer.