
Product
Introducing Socket Firewall Enterprise: Flexible, Configurable Protection for Modern Package Ecosystems
Socket Firewall Enterprise is now available with flexible deployment, configurable policies, and expanded language support.
css-selector-tokenizer
Advanced tools
Parses and stringifies CSS selectors.
import Tokenizer from "css-selector-tokenizer";
let input = "a#content.active > div::first-line [data-content], a:not(:visited)";
Tokenizer.parse(input); // === expected
let expected = {
type: "selectors",
nodes: [
{
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: " "
}
]
}
Tokenizer.stringify(expected) // === input
// * => { type: "universal" }
// foo|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: " "
// }
// ] }
npm install
npm test
npm test -- -w will watch lib and test for changes and retestMIT
Tobias Koppers, 2015.
This package is similar to css-selector-tokenizer but is built on top of PostCSS, offering a more robust API for manipulating selectors within the PostCSS ecosystem. It provides more detailed handling of pseudo-classes and pseudo-elements compared to css-selector-tokenizer.
css-what is another CSS selector parsing library that translates selectors into an abstract syntax tree (AST). Unlike css-selector-tokenizer, css-what focuses more on the parsing aspect without providing functionalities for stringifying the parsed output.
FAQs
Parses and stringifies CSS selectors
The npm package css-selector-tokenizer receives a total of 2,083,572 weekly downloads. As such, css-selector-tokenizer popularity was classified as popular.
We found that css-selector-tokenizer demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 5 open source maintainers collaborating on the project.
Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Product
Socket Firewall Enterprise is now available with flexible deployment, configurable policies, and expanded language support.

Security News
Open source dashboard CNAPulse tracks CVE Numbering Authorities’ publishing activity, highlighting trends and transparency across the CVE ecosystem.

Product
Detect malware, unsafe data flows, and license issues in GitHub Actions with Socket’s new workflow scanning support.