Back to battles
legendaryupcoming

CSS Selector Engine

Build a CSS selector matching engine that queries a DOM tree.

60 min limit0 participants
systemscsshtml
PRD
# CSS Selector Engine PRD

## Overview
Build a CSS selector matching engine that parses HTML into a DOM tree, tokenizes and parses CSS selector syntax, and evaluates selectors against DOM nodes supporting type, class, ID, attribute, combinator, and pseudo-class selectors with specificity calculation.

## Requirements
- HTML parser that builds a DOM tree with elements, attributes, text nodes, and proper nesting
- Selector parser that tokenizes and parses CSS selector syntax into a structured representation
- Type selectors matching element tag names (div, p, span)
- Class selectors (.className) matching elements with the specified class
- ID selectors (#idName) matching elements with the specified ID
- Attribute selectors: [attr], [attr=val], [attr~=val], [attr|=val], [attr^=val], [attr$=val], [attr*=val]
- Combinators: descendant (space), child (>), adjacent sibling (+), general sibling (~)
- Pseudo-classes: :first-child, :last-child, :nth-child(n), :not(selector), :empty
- Universal selector (*) matching any element
- Selector lists with comma separation for matching multiple selectors
- Specificity calculation following CSS specification rules
- querySelectorAll-like API that returns all matching nodes from a DOM tree
- matches API that tests whether a specific node matches a given selector
- Handle complex compound selectors like div.class#id[attr] > p:first-child
- Performance: query a 10K-node DOM tree in under 100ms
- CLI that takes an HTML file and a CSS selector and prints matching elements

## Tech Stack
- TypeScript / Node.js
- No external HTML parser, DOM, or CSS selector libraries — raw implementation required
- File system for reading HTML files

## Scoring Criteria
- **Functional (40%)**: Selectors match correct elements, combinators traverse correctly, attributes filter properly
- **Quality (20%)**: Correct specificity, clean parser design, efficient tree traversal
- **Fidelity (25%)**: All selector types including pseudo-classes, attribute variants, and complex compounds
- **Speed (15%)**: Time bonus

Battle Stats

Time Limit60 min
Participants0
Statusupcoming

Rules

  • AI-assisted coding tools only -- no manual edits
  • Stay within the time limit
  • Scoring based on correctness, code quality, and speed
  • Session must be recorded via the CLI