{"record":{"id":"1254ed55497bae4b","repo":"amruthpillai/reactive-resume","slug":"selector-function-nesting-is-too-deep","errorCode":null,"errorMessage":"Selector function nesting is too deep.","messagePattern":"Selector function nesting is too deep\\.","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"packages/resume/src/stylesheet/selector.ts","lineNumber":211,"sourceCode":"\t\t\tif (matcher !== null && matcher !== undefined && ![\"=\", \"~=\", \"|=\", \"^=\", \"$=\", \"*=\"].includes(matcher)) {\n\t\t\t\tthrow new Error(`Unsupported attribute matcher ${matcher}.`);\n\t\t\t}\n\t\t\tconst value = attributeValue(node);\n\t\t\tif ((matcher === null || matcher === undefined) !== (value === null)) {\n\t\t\t\tthrow new Error(\"Attribute selector matcher and value must be used together.\");\n\t\t\t}\n\t\t\treturn { type: \"attribute\", name, matcher: matcher ?? null, value };\n\t\t}\n\t\tcase \"PseudoClassSelector\": {\n\t\t\tconst name = astName(node);\n\t\t\tif ([\"root\", \"first-child\", \"last-child\", \"only-child\"].includes(name)) {\n\t\t\t\tif (node.children !== null && node.children !== undefined)\n\t\t\t\t\tthrow new Error(`:${name} does not accept arguments.`);\n\t\t\t\treturn { type: \"pseudo\", name: name as \"root\" | \"first-child\" | \"last-child\" | \"only-child\" };\n\t\t\t}\n\t\t\tif ([\"is\", \"where\", \"not\"].includes(name)) {\n\t\t\t\tif (context.depth >= SEMANTIC_CSS_LIMITS_V1.maxFunctionDepth) {\n\t\t\t\t\tthrow new Error(\"Selector function nesting is too deep.\");\n\t\t\t\t}\n\t\t\t\tconst nested = childrenOf(node);\n\t\t\t\tif (nested.length !== 1 || nested[0]?.type !== \"SelectorList\") {\n\t\t\t\t\tthrow new Error(`:${name} requires a selector list.`);\n\t\t\t\t}\n\t\t\t\tconst selectors = compileSelectorList(nested[0], { depth: context.depth + 1 });\n\t\t\t\treturn { type: \"pseudo\", name: name as \"is\" | \"where\" | \"not\", selectors };\n\t\t\t}\n\t\t\tif (name === \"nth-child\" || name === \"nth-of-type\") {\n\t\t\t\tif (context.depth >= SEMANTIC_CSS_LIMITS_V1.maxFunctionDepth) {\n\t\t\t\t\tthrow new Error(\"Selector function nesting is too deep.\");\n\t\t\t\t}\n\t\t\t\treturn compileNth(node, name, context);\n\t\t\t}\n\t\t\tthrow new Error(`Unsupported pseudo-class :${name}.`);\n\t\t}\n\t\tcase \"ClassSelector\":\n\t\t\tthrow new Error(\"Custom class selectors are not supported.\");","sourceCodeStart":193,"sourceCodeEnd":229,"githubUrl":"https://github.com/amruthpillai/reactive-resume/blob/3a5b12e2a40374a9571988701fcb75c5a1831c42/packages/resume/src/stylesheet/selector.ts#L193-L229","documentation":"Thrown by compileSimple for :is, :where, or :not when the recursive compile depth has reached SEMANTIC_CSS_LIMITS_V1.maxFunctionDepth (16). Each nested functional pseudo-class increments depth, preventing exponentially nested selectors.","triggerScenarios":"Nesting :is/:where/:not more than 16 levels deep, e.g. :is(:is(:is(... 17 times ...))). Dynamically generated selectors that recurse without a depth bound.","commonSituations":"Programmatic selector generation that wraps each clause in :is; machine-generated CSS from a builder UI; unbounded recursion in a templating layer.","solutions":["Flatten the nesting: combine arguments into a single :is(a, b, c) instead of :is(:is(:is(a))).","Cap generator recursion at maxFunctionDepth (16) before emitting.","Hoist repeated sub-selectors into a comma-separated selector list."],"exampleFix":"// before\n:is(:is(:is(:is(:is(:is(:is(:is(:is(:is(:is(:is(:is(:is(:is(:is(:is(section))))))))))))))))))\n// after\n:is(section, item, field)","handlingStrategy":"validation","validationCode":"import { SEMANTIC_CSS_LIMITS_V1 } from '@reactive-resume/resume';\n\nconst maxDepth = SEMANTIC_CSS_LIMITS_V1.maxFunctionDepth; // 16\nconst countFunctionDepth = (s) => (s.match(/:(is|where|not)\\(/gi) || []).length;\nconst withinDepth = (s) => countFunctionDepth(s) <= maxDepth;\n// verify before compiling deeply generated selectors","typeGuard":"const isRejected = (r) => r.selector === null && typeof r.error === 'string';","tryCatchPattern":"const result = compileSelector(selector);\nif (result.selector === null && result.error === 'Selector function nesting is too deep.') {\n  flattenIsWhereNot(selector);\n}","preventionTips":["Flatten :is(:is(:is(...))) into :is(a, b, c).","Cap generator recursion at maxFunctionDepth (16).","Prefer comma-separated selector lists over nested functional wrappers."],"tags":["semantic-css","selector","limits","nesting","pseudo-class"],"backgroundTag":null,"analyzedSha":"3a5b12e2a40374a9571988701fcb75c5a1831c42","analyzedAt":"2026-08-12T22:31:22.666Z","schemaVersion":2},"datasetVersion":"2026-08-12T23:17:12.415Z"}