Hmbown/CodeWhale · error

unbalanced brace in brand lockup css

Error message

unbalanced brace in brand lockup css

What it means

Test-only panic in brand_lockup_css_rules_are_not_accidentally_nested: while scanning the extracted brand-lockup CSS region character by character, a closing brace appeared with depth already at zero, meaning the embedded JS/CSS contains a rule closed more times than opened — likely a brace inside a string or accidental rule nesting.

Solutions

1. Balance the braces in the brand lockup CSS inside the JS asset
2. Escape or avoid literal braces in strings within the scanned CSS region
3. Re-run the depth scan after editing to confirm depth returns to 0

When it happens

Trigger: Thrown at crates/tui/src/integrations/dsh/tests.rs:782 when the library encounters an invalid state.

Common situations: See trigger scenarios.

AI-assisted analysis of Hmbown/CodeWhale@433685b202 (2026-09-15). Data as JSON: /api/errors/518090d4bc24b474. Report an issue: GitHub.

Appendix: source

Thrown at crates/tui/src/integrations/dsh/tests.rs:782

    let css_region = &js[css_start..];
    let end = css_region
        .find("return React.createElement(")
        .unwrap_or(css_region.len());
    let css_region = &css_region[..end];

    let mut depth = 0i32;
    let mut max_depth = 0i32;
    for ch in css_region.chars() {
        match ch {
            '{' => {
                depth += 1;
                max_depth = max_depth.max(depth);
            }
            '}' => depth -= 1,
            _ => {}
        }
        if depth < 0 {
            panic!("unbalanced brace in brand lockup css");
        }
    }
    assert_eq!(depth, 0, "brand lockup css must close every rule it opens");
    // A media query is the only legitimate nesting level in this sheet.
    assert!(
        max_depth <= 2,
        "brand lockup css nests {max_depth} deep; only @media may nest, \
         so a selector was authored inside a declaration block"
    );

    // The mark's own sizing rule must be a top-level rule, not nested: it is
    // what makes the inline SVG a block box inside the grid cell. In the
    // emitted CSS that means it is preceded by a closing brace, never by a
    // declaration.
    let marker = "#codewhale-brand-mark svg{display:block;width:34px;height:34px;}";
    let at = css_region
        .find(marker)
        .expect("the mark's svg sizing rule must be emitted");

View on GitHub (pinned to 433685b202)