Fix: Remove iOS Safari dialog max-width/max-height constraints in Preflight

[swarnim02]

Fixes #19363 - Added dialog reset to Preflight CSS to remove iOS Safari's default max-width/max-height constraints on dialog elements.

[coderabbitai]

Walkthrough

A CSS rule has been added to the Preflight stylesheet for dialog elements, setting max-width: none and max-height: none to override default width and height constraints on iOS Safari. A corresponding test has been added to the test suite to verify that dialog elements have these properties reset by Preflight. The test renders a dialog element and asserts that both max-width and max-height are set to none.

Pre-merge checks

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly summarizes the main change: fixing iOS Safari dialog constraints in Preflight CSS.
Description check	✅ Passed	The description is directly related to the changeset, referencing issue #19363 and describing the dialog reset addition.
Linked Issues check	✅ Passed	The PR successfully addresses issue #19363 by adding max-width/max-height resets to Preflight CSS and includes a test validating the changes.
Out of Scope Changes check	✅ Passed	All changes are directly scoped to the linked issue: dialog CSS resets and corresponding test coverage with no extraneous modifications.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

Actionable comments posted: 0

🧹 Nitpick comments (1)

packages/tailwindcss/tests/ui.spec.ts (1)

1475-1483: Strengthen dialog test by asserting on an open dialog

The test correctly checks that dialogs end up with max-width/max-height of none, matching the new Preflight rule. To better mirror the iOS Safari bug (which likely affects dialog[open]), consider making the dialog open before reading styles — e.g. render <dialog id="x" open>…</dialog> or call showModal() in a page.evaluate like the nearby ::backdrop test. That would ensure the test actually covers the state where UA max-* constraints are applied.

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between a1f533a and 51010f2.

📒 Files selected for processing (2)

• packages/tailwindcss/preflight.css (1 hunks)
• packages/tailwindcss/tests/ui.spec.ts (1 hunks)

🔇 Additional comments (1)

packages/tailwindcss/preflight.css (1)

387-394: Dialog reset matches Preflight’s goal and looks correct

Setting max-width/max-height to none on dialog is an appropriate way to neutralize iOS Safari’s constraints, and the comment clearly documents the intent. Placement and selector style are consistent with the rest of Preflight.