[text field] Fix outline gap without a label in Firefox

Firefox applies the inherited letter-spacing to the zero-width space in
the unlabeled legend, which leaves a 0.15px gap in the border. Cap the
legend at `maxWidth: 0` when there is no label.
This commit is contained in:
dualfroz committed 2026-10-17 03:26:00 +02:00
1 parent f1d4f4a31b
commit b509eff886
2 files changed
+8

No files matched your search

@@ -64,4 +64,11 @@ describe('<NotchedOutline />', () => {
});
},
);
it.skipIf(isJsdom())('should not leave a gap in the outline without a label', () => {
const { container } = render(
<NotchedOutline notched={false} style={{ letterSpacing: '0.00938em' }} />,
);
expect(container.querySelector('legend').getBoundingClientRect().width).to.equal(0);
});
});