What
client/src/components/UnifiedSidebar/mobile/__tests__/Scrim.spec.tsx:54-63 asserts four Tailwind
class names on the rendered element:
expect(scrim).toHaveClass(
'focus-visible:outline-hidden',
'focus-visible:ring-2',
'focus-visible:ring-inset',
'focus-visible:ring-text-primary',
);
Nothing a user or caller observes is being checked — the assertion pins the implementation's class
list. CLAUDE.md is explicit that a test which pins incidental styling should be deleted rather than
re-pinned when the styling changes, and this one was re-pinned: the Tailwind v4 upgrade rewrote
outline-none to outline-hidden here, which is how it stayed green through a rename that changed
nothing about the behaviour it claims to protect.
The behaviour the comment above the test describes — the focus indicator paints inside an
overflow-hidden shell — is real and worth protecting, but a class list cannot establish it: the
same four classes with the ring colour token undeclared, or with a parent clipping differently, still
satisfy the assertion.
Why it is not fixed in the root pull request
Scrim.spec.tsx is not in LibreChat-AI#16041's diff; it belongs to the Tailwind v4 branch beneath it
(berry-13/tailwind-v4), and the file is already on dev in its outline-none form, so the fix does
not need anything from the root branch.
Suggested fix
Delete the test. If the focus indicator is worth a regression test, assert what renders instead: focus
the scrim in the mock harness and read the computed outline-style/box-shadow of the focused element,
which is what a keyboard user sees, and which fails if the ring token stops resolving.
What
client/src/components/UnifiedSidebar/mobile/__tests__/Scrim.spec.tsx:54-63asserts four Tailwindclass names on the rendered element:
Nothing a user or caller observes is being checked — the assertion pins the implementation's class
list.
CLAUDE.mdis explicit that a test which pins incidental styling should be deleted rather thanre-pinned when the styling changes, and this one was re-pinned: the Tailwind v4 upgrade rewrote
outline-nonetooutline-hiddenhere, which is how it stayed green through a rename that changednothing about the behaviour it claims to protect.
The behaviour the comment above the test describes — the focus indicator paints inside an
overflow-hiddenshell — is real and worth protecting, but a class list cannot establish it: thesame four classes with the ring colour token undeclared, or with a parent clipping differently, still
satisfy the assertion.
Why it is not fixed in the root pull request
Scrim.spec.tsxis not in LibreChat-AI#16041's diff; it belongs to the Tailwind v4 branch beneath it(
berry-13/tailwind-v4), and the file is already ondevin itsoutline-noneform, so the fix doesnot need anything from the root branch.
Suggested fix
Delete the test. If the focus indicator is worth a regression test, assert what renders instead: focus
the scrim in the mock harness and read the computed
outline-style/box-shadowof the focused element,which is what a keyboard user sees, and which fails if the ring token stops resolving.