css-modules/css-selector-tokenizer

Name: css-selector-tokenizer

Owner: css-modules

Description: Parses and stringifies CSS selectors.

Created: 2015-05-29 08:29:22.0

Updated: 2018-04-11 20:41:32.0

Pushed: 2018-03-20 15:52:06.0

Homepage:

Size: 31

Language: JavaScript

GitHub Committers

User	Most Recent Commit	# Commits

Other Committers

User	Email	Most Recent Commit	# Commits

README

CSS Modules: CSS selector Tokenizer

Parses and stringifies CSS selectors.

rt Tokenizer from "css-selector-tokenizer";

input = "a#content.active > div::first-line [data-content], a:not(:visited)";

nizer.parse(input); // === expected
expected = {
pe: "selectors",
des: [
{
  type: "selector",
  nodes: [
    { type: "element", name: "a" },
    { type: "id", name: "content" },
    { type: "class", name: "active" },
    { type: "operator", operator: ">", before: " ", after: " " },
    { type: "element", name: "div" },
    { type: "pseudo-element", name: "first-line" },
    { type: "spacing", value: " " },
    { type: "attribute", content: "data-content" },
  ]
},
{
  type: "selector",
  nodes: [
    { type: "element", name: "a" },
    { type: "nested-pseudo-class", name: "not", nodes: [
      {
        type: "selector",
        nodes: [
          { type: "pseudo-class", name: "visited" }
        ]
      }
    ] }
  ],
  before: " "
}



nizer.stringify(expected) // === input

 => { type: "universal" }
oo|element = { type: "element", name: "element", namespace: "foo" }
|* = { type: "universal", namespace: "*" }
has(h1, h2) => { type: "nested-pseudo-class", name: "has", nodes: [
   {
     type: "selector",
     nodes: [
       { type: "element", name: "h1" }
     ]
   },
   {
     type: "selector",
     nodes: [
       { type: "element", name: "h2" }
     ],
     before: " "
   }
 ] }

Building

install
test

• Lines:
• Statements:

Development

• npm autotest will watch lib and test for changes and retest

License

MIT

With thanks

• Mark Dalgleish
• Glen Maddern
• Guy Bedford

---

Tobias Koppers, 2015.