Fix nested card detection: innermost-only, lower threshold, raw style fallback

Three fixes:
- Only flag innermost nested cards: if L1>L2>L3, only L3 gets flagged
  (not L2). Uses ancestor-filtering after collection pass.
- Lower text threshold from 20 to 10 chars to catch short card content
  like "Inner card via CSS."
- isCardLike now also checks raw inline style attribute for box-shadow
  and border-radius (jsdom doesn't resolve CSS shorthands). Tightened
  heuristic: shadow or border is mandatory (not optional).

Fixes false positive on layout-should-pass where a tinted subsection
(rounded + bg, no shadow) inside a card was incorrectly flagged.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Paul Bakaus
2026-03-17 16:34:04 -07:00
co-authored by Claude Opus 4.6
parent ae47758366
commit add8c1958d
4 changed files with 73 additions and 29 deletions
+1 -1
View File
@@ -285,7 +285,7 @@ describe('detectHtml — layout', () => {
test('layout-should-flag: detects all nested cards', async () => {
const f = await detectHtml(path.join(FIXTURES, 'layout-should-flag.html'));
const nested = f.filter(r => r.antipattern === 'nested-cards');
// Classic, 3-level (2 inner cards), CSS, shadcn = at least 5 nested card findings
// Classic, level 3, CSS inner, shadcn inner + any other innermost nested cards
expect(nested.length).toBeGreaterThanOrEqual(4);
});