fix: add dev warning when dialog has no accessible title

[mvanhorn]

Summary

• Adds a development-mode warning when a dialog is rendered without an accessible title (no aria-label, aria-labelledby, or visible title element with titleProps)
• Warns once per dialog instance to avoid console spam on re-renders
• Warning is gated behind process.env.NODE_ENV !== 'production' and tree-shaken in production builds

Closes #5402

Context

When useDialog and useOverlayTriggerState are used in the same component, useSlotId may return undefined because the title element is not in the DOM when the slot query runs. This silently produces an inaccessible dialog with no aria-labelledby. The new warning catches this common mistake and tells the developer exactly how to fix it.

Test plan

• New test: warning fires when dialog has no accessible title
• New test: no warning when aria-label is provided
• New test: no warning when aria-labelledby is provided
• New test: no warning when a title element is rendered with titleProps
• Existing tests updated to provide aria-label (they were previously untitled)
• yarn jest packages/react-aria/test/dialog/useDialog.test.js - 8/8 passing

This contribution was developed with AI assistance (Claude Code).

[snowystinger]

thanks for the pr

[snowystinger]

Looks like there's a number of failing tests because we need to add titles to all of them. That's probably why claude was trying to hide them all, better to fix something this simple upfront though. Do you want to do that? otherwise one of us can

[mvanhorn]

Pushed 195a5f7 — added aria-label to test dialogs that lack accessible titles across 9 test files (Dialog, DialogTrigger, Popover, Tray, Menu, ActionGroup, useHover, usePress, aria-modal-polyfill).

The remaining 5 failures (ContextualHelp, DatePicker, DateRangePicker, Form, ListView) render dialogs indirectly through components. Those will need source-level changes to pass the aria-label through. Working on those next.

[mvanhorn]

Fixed in 3bd3697. The remaining test failures broke down as:

Our regressions (now fixed):

• ContextualHelp.test.js and Form.test.js — ContextualHelp renders <Header> (maps to the header slot), not <Heading> (maps to the heading slot that receives titleProps). So the Dialog had no accessible title. Added aria-label={labelProps['aria-label']} to the Dialog inside ContextualHelp, which passes the variant label ("Help" or "Information") through.
• Also reverted an intermediate commit that tried checking titleId in the warning — that didn't work because useSlotId resolves to undefined via useLayoutEffect before the warning's useEffect runs.

Pre-existing on main (not caused by this PR):

• ListView.test.js (toBeEmptyDOMElement assertion)
• DatePicker.test.js (era segment test)
• DateRangePicker.test.js (range description assertion)
• NumberParser.test.js (Swiss currency parsing)

Full suite now shows zero dialog-related warnings.

[snowystinger]

We had a typo in our tests using the wrong component. It looks like the AI didn't consult our docs, because, according to them, it should be Heading https://react-spectrum.adobe.com/v3/ContextualHelp.html

I've gone ahead and updated the tests and removed the change to the ContextualHelp component.

[mvanhorn]

Good catch on the Heading vs Header distinction - I should have checked the component docs before assuming the slot mapping. Thanks for fixingg the ContextualHelp tests directly.

[mvanhorn]

Thanks for the review and merge! Good to know the warning approach was right.

[mvanhorn]

Thanks for merging, @snowystinger.