css-select-generic-ast-adapter

This package exposes an adapter for css-select that allows you to query over any AST-like tree structure.

Usage

import * as CSSselect from "css-select";
import { makeTraversal } from "css-select-generic-ast-adapter";

// This works with any AST, but in this example, we use a Babel AST.
import * as babel from "@babel/core";

const ast = babel.parse(`console.log('hi');`);

const { adapter, dispose } = makeTraversal(ast);

const matches = CSSselect.selectAll("StringLiteral[value=hi]", ast, {
  // Pass the adapter from makeTraversal into selectAll
  adapter,
  // You MUST pass xmlMode: true, or else css-select will query for lowercase attribute names, and therefore not find anything
  xmlMode: true,
});

// You MUST call dispose once you're done using this AST with CSSselect.
dispose();

You can optionally pass an options object into makeTraversal with the following properties:

• typeKey (string): which property on each AST node contains the node type, which we present to css-select as the node tagName. Defaults to "type".
• getAttributes (Function): A function which maps a node to the queryable attributes of a node. Defaults to (node) => node. If your AST places node attributes on a different sub-property of a node, you may wish to use eg. (node) => node.properties here.