react-spectrum
ac718c6c - fix: add dev warning when dialog has no accessible title (#9819)

Commit
9 days ago
fix: add dev warning when dialog has no accessible title (#9819) * fix: add dev warning when dialog has no accessible title When a dialog is rendered without an aria-label, aria-labelledby, or a visible title element, emit a console.warn in development mode to help developers catch this common accessibility mistake early. The warning fires once per dialog instance and is tree-shaken in production builds. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix(dialog): resolve test failures in dialog title dev warning Check the DOM element directly for aria-label/aria-labelledby attributes instead of relying on hook props, since wrapper components (e.g. RAC Dialog) may add aria-labelledby from context after useDialog runs. Add the warning pattern to the allowed warnings list in setupTests.js so existing tests that render dialogs without accessible labels are not broken. * fix: address review feedback - remove setupTests allowlist entry, drop 'visible' from warning Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * fix: add aria-label to test dialogs that lack accessible titles Adds aria-label="Test dialog" to Dialog test renders that don't have a heading or aria-labelledby, preventing the new dev warning from failing tests via failTestOnConsoleWarn(). 9 test files fixed. Remaining failures (ContextualHelp, DatePicker, DateRangePicker, Form, ListView) have dialogs rendered indirectly through components — those need source-level changes. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * fix: check props and titleId in addition to DOM attributes for dialog warning The useEffect-based DOM check can race with useSlotId registration, causing false positives in components where a heading exists but hasn't registered yet. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * fix: add aria-label to ContextualHelp dialog and revert ineffective titleId check ContextualHelp renders <Header> (not <Heading>), so the Dialog's useSlotId resolves to undefined and the dialog has no accessible title. Pass the variant label ("Help"/"Information") as aria-label. Reverts the !!titleId check in useDialog which didn't work because useSlotId resolves to undefined via useLayoutEffect before the warning's useEffect runs. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * fix contextual help usage --------- Co-authored-by: Matt Van Horn <455140+mvanhorn@users.noreply.github.com> Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com> Co-authored-by: Robert Snow <rsnow@adobe.com> Co-authored-by: Robert Snow <snowystinger@gmail.com>
Author
Parents
Loading