amruthpillai/reactive-resume · error · Error

:${name} does not accept arguments.

Error message

:${name} does not accept arguments.

What it means

Thrown by compileSimple in the PseudoClassSelector branch when one of the argument-less pseudo-classes (root, first-child, last-child, only-child) is written with children/arguments, e.g. :root(...). These pseudo-classes never accept arguments in this compiler.

Source

Thrown at packages/resume/src/stylesheet/selector.ts:206

		case "AttributeSelector": {
			const name = astName(node);
			if (!knownAttributes.has(name)) throw new Error(`Unknown semantic attribute ${name}.`);
			if (node.flags) throw new Error("Attribute selector flags are not supported.");
			const matcher = node.matcher as AttributeMatcher | null | undefined;
			if (matcher !== null && matcher !== undefined && !["=", "~=", "|=", "^=", "$=", "*="].includes(matcher)) {
				throw new Error(`Unsupported attribute matcher ${matcher}.`);
			}
			const value = attributeValue(node);
			if ((matcher === null || matcher === undefined) !== (value === null)) {
				throw new Error("Attribute selector matcher and value must be used together.");
			}
			return { type: "attribute", name, matcher: matcher ?? null, value };
		}
		case "PseudoClassSelector": {
			const name = astName(node);
			if (["root", "first-child", "last-child", "only-child"].includes(name)) {
				if (node.children !== null && node.children !== undefined)
					throw new Error(`:${name} does not accept arguments.`);
				return { type: "pseudo", name: name as "root" | "first-child" | "last-child" | "only-child" };
			}
			if (["is", "where", "not"].includes(name)) {
				if (context.depth >= SEMANTIC_CSS_LIMITS_V1.maxFunctionDepth) {
					throw new Error("Selector function nesting is too deep.");
				}
				const nested = childrenOf(node);
				if (nested.length !== 1 || nested[0]?.type !== "SelectorList") {
					throw new Error(`:${name} requires a selector list.`);
				}
				const selectors = compileSelectorList(nested[0], { depth: context.depth + 1 });
				return { type: "pseudo", name: name as "is" | "where" | "not", selectors };
			}
			if (name === "nth-child" || name === "nth-of-type") {
				if (context.depth >= SEMANTIC_CSS_LIMITS_V1.maxFunctionDepth) {
					throw new Error("Selector function nesting is too deep.");
				}
				return compileNth(node, name, context);

View on GitHub (pinned to 3a5b12e2a4)

Solutions

  1. Drop the argument list: :root, :first-child, :last-child, :only-child.
  2. If you need a positional index, use :nth-child(<expr>) instead of :first-child(<expr>).

Example fix

// before
section:first-child(2)
// after
section:first-child
Defensive patterns

Strategy: validation

Validate before calling

const ARGLESS = new Set(['root', 'first-child', 'last-child', 'only-child']);
const arglessHasNoArgs = (name, hasChildren) => !(ARGLESS.has(name) && hasChildren);
// reject :root(...)/:first-child(...) forms before compiling

Type guard

const isRejected = (r) => r.selector === null && typeof r.error === 'string';

Try / catch

const result = compileSelector(selector);
if (result.selector === null && result.error.endsWith(' does not accept arguments.')) {
  stripArguments(selector);
}

Prevention

When it happens

Trigger: Writing :root(something), :first-child(2), :last-child(...), or :only-child(...).

Common situations: Confusing :first-child with :nth-child; copy-pasting functional pseudo-class syntax onto structural ones; editor auto-completion adding parentheses.

Related errors


AI-assisted analysis of amruthpillai/reactive-resume@3a5b12e2a4 (2026-08-12). Data as JSON: /api/errors/419fc5ea3ed9ea3c. Report an issue: GitHub.