gchq/CyberChef · error · OperationError

Invalid CSS Selector. Details: ${err.message}

Error message

Invalid CSS Selector. Details:
${err.message}

What it means

Thrown by the CSS Selector operation when nwmatcher fails to evaluate the supplied CSS selector against the parsed DOM. The input HTML is parsed first (a separate error covers malformed HTML); this error means the selector string itself was syntactically or semantically invalid for the nwmatcher engine.

Source

Thrown at src/core/operations/CSSSelector.mjs:68

            parser = new xmldom.DOMParser();
        let dom,
            result;

        if (!query.length || !input.length) {
            return "";
        }

        try {
            dom = parser.parseFromString(input);
        } catch (err) {
            throw new OperationError("Invalid input HTML.");
        }

        try {
            const matcher = nwmatcher({document: dom});
            result = matcher.select(query, dom);
        } catch (err) {
            throw new OperationError("Invalid CSS Selector. Details:\n" + err.message);
        }

        const nodeToString = function(node) {
            return node.toString();
            /* xmldom does not return the outerHTML value.
            switch (node.nodeType) {
                case node.ELEMENT_NODE: return node.outerHTML;
                case node.ATTRIBUTE_NODE: return node.value;
                case node.TEXT_NODE: return node.wholeText;
                case node.COMMENT_NODE: return node.data;
                case node.DOCUMENT_NODE: return node.outerHTML;
                default: throw new Error("Unknown Node Type: " + node.nodeType);
            }*/
        };

        return result
            .map(nodeToString)
            .join(delimiter);

View on GitHub (pinned to 4290ea7539)

Solutions

  1. Inspect the appended err.message to find the exact nwmatcher parse error and the offending token.
  2. Simplify the selector to CSS2/CSS3 subset supported by nwmatcher (avoid jQuery extensions like :eq, :contains special forms).
  3. Quote attribute values and balance all parentheses/brackets.
  4. If you need modern selectors, pre-filter input or use a different matching strategy outside this operation.

Example fix

// before
matcher.select("div:eq(0)", dom);  // nwmatcher rejects :eq
// after
matcher.select("div:nth-of-type(1)", dom);  // supported pseudo-class
Defensive patterns

Strategy: try-catch

Validate before calling

function isValidCssSelector(sel) {
  // nwmatcher supports roughly CSS2/3; reject jQuery/Sizzle extensions and unbalanced brackets
  if (/[(){}[\]]/.test(sel)) {
    const open = (sel.match(/[([{]/g)||[]).length;
    const close = (sel.match(/[)\]}]/g)||[]).length;
    if (open !== close) return false;
  }
  if (/:(eq|contains\(|has\()/.test(sel)) return false; // common unsupported pseudos
  return sel.trim().length > 0;
}

Type guard

null

Try / catch

try {
  result = matcher.select(query, dom);
} catch (err) {
  throw new OperationError("Invalid CSS Selector. Details:\n" + err.message);
}

Prevention

When it happens

Trigger: Calling CSSSelector.run with a query that nwmatcher.select() rejects — e.g. unbalanced brackets (':nth-child('), unsupported pseudo-classes, invalid combinator sequences, or selectors with characters nwmatcher does not tolerate. The DOM must parse successfully first, so only malformed selectors reach this catch.

Common situations: User pastes a jQuery/Sizzle-only pseudo selector (':eq(0)', ':has(> div)'), uses a selector version nwmatcher predates, or has an unterminated attribute selector. Quotes/brackets in dynamic selectors built from untrusted input frequently trigger it.

Related errors


AI-assisted analysis of gchq/CyberChef@4290ea7539 (2026-08-13). Data as JSON: /api/errors/a26693b2ca670e7e. Report an issue: GitHub.