Skip to content

fix(preflight): exclude iframes from :-moz-focusring outline#19866

Open
cyphercodes wants to merge 1 commit intotailwindlabs:mainfrom
cyphercodes:main
Open

fix(preflight): exclude iframes from :-moz-focusring outline#19866
cyphercodes wants to merge 1 commit intotailwindlabs:mainfrom
cyphercodes:main

Conversation

@cyphercodes
Copy link
Copy Markdown

@cyphercodes cyphercodes commented Mar 27, 2026

Summary

This PR fixes an issue where Firefox applies an auto outline to iframes when :focus-visible is triggered.

Problem

The :-moz-focusring rule in preflight.css was applying outline: auto to all elements, including iframes. This caused iframes to show an unwanted outline when focused, which is inconsistent with Firefox's own behavior (Firefox sets iframe:focus-visible { outline-style: none; } in its user agent stylesheet).

Solution

Changed the selector from :-moz-focusring to :-moz-focusring:where(:not(iframe)) to exclude iframes from the outline rule.

Changes

  • Modified packages/tailwindcss/preflight.css to exclude iframes
  • Updated the corresponding test in integrations/cli/index.test.ts

Related Issue

Fixes #19795

@cyphercodes
fix(preflight): exclude iframes from :-moz-focusring outline
d4adf62 
Prevent Firefox from applying auto outline to iframes when :focus-visible
is triggered. This fixes an issue where iframes would show an unwanted
outline when focused.

Fixes tailwindlabs#19795
@cyphercodes cyphercodes requested a review from a team as a code owner March 27, 2026 07:57
@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai bot commented Mar 27, 2026

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: 16e2af37-264a-494b-baab-592ee79e492b

📥 Commits

Reviewing files that changed from the base of the PR and between d7fc281 and d4adf62.

📒 Files selected for processing (2)
  • integrations/cli/index.test.ts
  • packages/tailwindcss/preflight.css

Walkthrough

The CSS selector for Firefox focus styling was updated from :-moz-focusring to :-moz-focusring:where(:not(iframe)) in the preflight stylesheet. The :where(:not(iframe)) condition restricts the outline: auto rule to not apply to elements within iframes. The corresponding test file was updated to expect this modified selector.

🚥 Pre-merge checks | ✅ 4
✅ Passed checks (4 passed)
Check name Status Explanation
Title check ✅ Passed The PR title clearly describes the main change: excluding iframes from the :-moz-focusring outline rule in preflight CSS.
Description check ✅ Passed The description provides clear context about the problem, solution, and changes made, relating directly to the code modifications.
Linked Issues check ✅ Passed The PR successfully addresses issue #19795 by implementing the exact selector change (:-moz-focusring:where(:not(iframe))) requested to prevent iframes from showing unwanted outlines.
Out of Scope Changes check ✅ Passed All changes are directly scoped to fixing the iframe outline issue: preflight.css selector modification and corresponding test update.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

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

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

jozef-javorsky-dodo pushed a commit to jozef-javorsky-dodo/tailwindcss that referenced this pull request Mar 29, 2026
@depfu
Update eslint 9.29.0 → 9.30.1 (minor) (tailwindlabs#18513)
d565641 
Here is everything you need to know about this update. Please take a
good look at what changed and the test results before merging this pull
request.

### What changed?




#### ✳️ eslint (9.29.0 → 9.30.1) ·
[Repo](https://github.com/eslint/eslint) ·
[Changelog](https://github.com/eslint/eslint/blob/main/CHANGELOG.md)



<details>
<summary>Release Notes</summary>
<h4><a
href="https://github.com/eslint/eslint/releases/tag/v9.30.1">9.30.1</a></h4>

<blockquote><h2 dir="auto">Bug Fixes</h2>
<ul dir="auto">
<li>
<a
href="https://bounce.depfu.com/github.com/eslint/eslint/commit/e91bb870f8c6e38baa508f18048cd2a2d04b8b9c"><code
class="notranslate">e91bb87</code></a> fix: allow separate default and
named type imports (<a
href="https://bounce.depfu.com/github.com/eslint/eslint/pull/19899">#19899</a>)
(xbinaryx)</li>
</ul>
<h2 dir="auto">Documentation</h2>
<ul dir="auto">
<li>
<a
href="https://bounce.depfu.com/github.com/eslint/eslint/commit/ab7c62598a9fca498e495d45029ae92fd5fb9bf3"><code
class="notranslate">ab7c625</code></a> docs: Update README (GitHub
Actions Bot)</li>
<li>
<a
href="https://bounce.depfu.com/github.com/eslint/eslint/commit/dae1e5bb27db0e846efbe3026210013b42817838"><code
class="notranslate">dae1e5b</code></a> docs: update jsdoc's link (<a
href="https://bounce.depfu.com/github.com/eslint/eslint/pull/19896">#19896</a>)
(JamesVanWaza)</li>
</ul>
<h2 dir="auto">Chores</h2>
<ul dir="auto">
<li>
<a
href="https://bounce.depfu.com/github.com/eslint/eslint/commit/b035f747c6e6d1c7a299c90b0ed0b8109cf24a53"><code
class="notranslate">b035f74</code></a> chore: upgrade to <code
class="notranslate">@eslint/js@9.30.1</code> (<a
href="https://bounce.depfu.com/github.com/eslint/eslint/pull/19906">#19906</a>)
(Francesco Trotta)</li>
<li>
<a
href="https://bounce.depfu.com/github.com/eslint/eslint/commit/b3dbc16563cb7036d75edff9814e17053a645321"><code
class="notranslate">b3dbc16</code></a> chore: package.json update for
@eslint/js release (Jenkins)</li>
</ul></blockquote>
<h4><a
href="https://github.com/eslint/eslint/releases/tag/v9.30.0">9.30.0</a></h4>

<blockquote><h2 dir="auto">Features</h2>
<ul dir="auto">
<li>
<a
href="https://bounce.depfu.com/github.com/eslint/eslint/commit/52a5fcaa4e0bb4e55c014c20ed47d6c93b107635"><code
class="notranslate">52a5fca</code></a> feat: Support <code
class="notranslate">basePath</code> property in config objects (<a
href="https://bounce.depfu.com/github.com/eslint/eslint/pull/19879">#19879</a>)
(Milos Djermanovic)</li>
<li>
<a
href="https://bounce.depfu.com/github.com/eslint/eslint/commit/4ab44823df4d4b47d3650da949077a0551e7579e"><code
class="notranslate">4ab4482</code></a> feat: add <code
class="notranslate">allowSeparateTypeImports</code> option to <code
class="notranslate">no-duplicate-imports</code> (<a
href="https://bounce.depfu.com/github.com/eslint/eslint/pull/19872">#19872</a>)
(sethamus)</li>
<li>
<a
href="https://bounce.depfu.com/github.com/eslint/eslint/commit/b8a7e7aeb5f0ed2e1670771ab4dda6fd723d96eb"><code
class="notranslate">b8a7e7a</code></a> feat: throw error when column is
negative in <code class="notranslate">getIndexFromLoc</code> (<a
href="https://bounce.depfu.com/github.com/eslint/eslint/pull/19831">#19831</a>)
(루밀LuMir)</li>
</ul>
<h2 dir="auto">Bug Fixes</h2>
<ul dir="auto">
<li>
<a
href="https://bounce.depfu.com/github.com/eslint/eslint/commit/6a0f164543bf8461d6a27a740c9e08aa77cbe42d"><code
class="notranslate">6a0f164</code></a> fix: handle <code
class="notranslate">null</code> type <code
class="notranslate">loc</code> in <code
class="notranslate">getIndexFromLoc</code> method (<a
href="https://bounce.depfu.com/github.com/eslint/eslint/pull/19862">#19862</a>)
(루밀LuMir)</li>
<li>
<a
href="https://bounce.depfu.com/github.com/eslint/eslint/commit/3fbcd704a0b2aef2a6c1fc34d2bc4b35f6425067"><code
class="notranslate">3fbcd70</code></a> fix: update error message for
<code class="notranslate">no-restricted-properties</code> (<a
href="https://bounce.depfu.com/github.com/eslint/eslint/pull/19855">#19855</a>)
(Tanuj Kanti)</li>
<li>
<a
href="https://bounce.depfu.com/github.com/eslint/eslint/commit/7ef4cf76610d42727a404e495ac6d47868cf5040"><code
class="notranslate">7ef4cf7</code></a> fix: remove unnecessary semicolon
from fixes (<a
href="https://bounce.depfu.com/github.com/eslint/eslint/pull/19857">#19857</a>)
(Francesco Trotta)</li>
<li>
<a
href="https://bounce.depfu.com/github.com/eslint/eslint/commit/7dabc38a8406d470fb2389eec2f0ad1ad214173e"><code
class="notranslate">7dabc38</code></a> fix: use <code
class="notranslate">process.version</code> in <code
class="notranslate">--env-info</code> (<a
href="https://bounce.depfu.com/github.com/eslint/eslint/pull/19865">#19865</a>)
(TKDev7)</li>
</ul>
<h2 dir="auto">Documentation</h2>
<ul dir="auto">
<li>
<a
href="https://bounce.depfu.com/github.com/eslint/eslint/commit/8662ed1f6debc358e22812b145e117aa4a907d78"><code
class="notranslate">8662ed1</code></a> docs: adopt eslint-stylistic sub
packages related changes (<a
href="https://bounce.depfu.com/github.com/eslint/eslint/pull/19887">#19887</a>)
(ntnyq)</li>
<li>
<a
href="https://bounce.depfu.com/github.com/eslint/eslint/commit/20158b09db3430cf00b202ba8c25ce874bbaf00a"><code
class="notranslate">20158b0</code></a> docs: typo in comment for unused
variables handling (<a
href="https://bounce.depfu.com/github.com/eslint/eslint/pull/19870">#19870</a>)
(leopardracer)</li>
<li>
<a
href="https://bounce.depfu.com/github.com/eslint/eslint/commit/ebfb5b46136c4d737c9783333e3057421d1a0bef"><code
class="notranslate">ebfb5b4</code></a> docs: Fixed Typo in
configuration-files.md (<a
href="https://bounce.depfu.com/github.com/eslint/eslint/pull/19873">#19873</a>)
(0-20)</li>
<li>
<a
href="https://bounce.depfu.com/github.com/eslint/eslint/commit/4112fd09531092e9651e9981205bcd603dc56acf"><code
class="notranslate">4112fd0</code></a> docs: clarify that boolean is
still allowed for rule <code class="notranslate">meta.deprecated</code>
(<a
href="https://bounce.depfu.com/github.com/eslint/eslint/pull/19866">#19866</a>)
(Bryan Mishkin)</li>
</ul>
<h2 dir="auto">Chores</h2>
<ul dir="auto">
<li>
<a
href="https://bounce.depfu.com/github.com/eslint/eslint/commit/2b6491cd4b8eec44d4a3f8dea1b71151e8dd0230"><code
class="notranslate">2b6491c</code></a> chore: upgrade to <code
class="notranslate">@eslint/js@9.30.0</code> (<a
href="https://bounce.depfu.com/github.com/eslint/eslint/pull/19889">#19889</a>)
(Francesco Trotta)</li>
<li>
<a
href="https://bounce.depfu.com/github.com/eslint/eslint/commit/5a5d5261037fdf84a91f2f22d3726d58572453f4"><code
class="notranslate">5a5d526</code></a> chore: package.json update for
@eslint/js release (Jenkins)</li>
<li>
<a
href="https://bounce.depfu.com/github.com/eslint/eslint/commit/eaf8a418af32b3190494e4a2284533353c28ccfa"><code
class="notranslate">eaf8a41</code></a> chore: Correct typos in linter
tests (<a
href="https://bounce.depfu.com/github.com/eslint/eslint/pull/19878">#19878</a>)
(kilavvy)</li>
</ul></blockquote>
<p><em>Does any of this look wrong? <a
href="https://depfu.com/packages/npm/eslint/feedback">Please let us
know.</a></em></p>
</details>

<details>
<summary>Commits</summary>
<p><a
href="https://github.com/eslint/eslint/compare/edf232b680390013c68f081a5e41843bcf2dd18f...6769b5fa11ecfb2c2cf78472d3d90564a1e01d3c">See
the full diff on Github</a>. The new version differs by 23 commits:</p>
<ul>
<li><a
href="https://github.com/eslint/eslint/commit/6769b5fa11ecfb2c2cf78472d3d90564a1e01d3c"><code>9.30.1</code></a></li>
<li><a
href="https://github.com/eslint/eslint/commit/b2950ace77663f96cab395b5fe525054d3f49bfe"><code>Build:
changelog update for 9.30.1</code></a></li>
<li><a
href="https://github.com/eslint/eslint/commit/b035f747c6e6d1c7a299c90b0ed0b8109cf24a53"><code>chore:
upgrade to `@eslint/js@9.30.1` (#19906)</code></a></li>
<li><a
href="https://github.com/eslint/eslint/commit/b3dbc16563cb7036d75edff9814e17053a645321"><code>chore:
package.json update for @eslint/js release</code></a></li>
<li><a
href="https://github.com/eslint/eslint/commit/e91bb870f8c6e38baa508f18048cd2a2d04b8b9c"><code>fix:
allow separate default and named type imports (#19899)</code></a></li>
<li><a
href="https://github.com/eslint/eslint/commit/ab7c62598a9fca498e495d45029ae92fd5fb9bf3"><code>docs:
Update README</code></a></li>
<li><a
href="https://github.com/eslint/eslint/commit/dae1e5bb27db0e846efbe3026210013b42817838"><code>docs:
update jsdoc&tailwindlabs#39;s link (#19896)</code></a></li>
<li><a
href="https://github.com/eslint/eslint/commit/ad1d63951773acc7828bcc1eafbb731567447298"><code>9.30.0</code></a></li>
<li><a
href="https://github.com/eslint/eslint/commit/c02d70b71867b4cee9c38a536f74e98e3b810f16"><code>Build:
changelog update for 9.30.0</code></a></li>
<li><a
href="https://github.com/eslint/eslint/commit/2b6491cd4b8eec44d4a3f8dea1b71151e8dd0230"><code>chore:
upgrade to `@eslint/js@9.30.0` (#19889)</code></a></li>
<li><a
href="https://github.com/eslint/eslint/commit/5a5d5261037fdf84a91f2f22d3726d58572453f4"><code>chore:
package.json update for @eslint/js release</code></a></li>
<li><a
href="https://github.com/eslint/eslint/commit/52a5fcaa4e0bb4e55c014c20ed47d6c93b107635"><code>feat:
Support `basePath` property in config objects (tailwindlabs#19879)</code></a></li>
<li><a
href="https://github.com/eslint/eslint/commit/6a0f164543bf8461d6a27a740c9e08aa77cbe42d"><code>fix:
handle `null` type `loc` in `getIndexFromLoc` method
(tailwindlabs#19862)</code></a></li>
<li><a
href="https://github.com/eslint/eslint/commit/8662ed1f6debc358e22812b145e117aa4a907d78"><code>docs:
adopt eslint-stylistic sub packages related changes
(#19887)</code></a></li>
<li><a
href="https://github.com/eslint/eslint/commit/eaf8a418af32b3190494e4a2284533353c28ccfa"><code>chore:
Correct typos in linter tests (tailwindlabs#19878)</code></a></li>
<li><a
href="https://github.com/eslint/eslint/commit/4ab44823df4d4b47d3650da949077a0551e7579e"><code>feat:
add `allowSeparateTypeImports` option to `no-duplicate-imports`
(tailwindlabs#19872)</code></a></li>
<li><a
href="https://github.com/eslint/eslint/commit/3fbcd704a0b2aef2a6c1fc34d2bc4b35f6425067"><code>fix:
update error message for `no-restricted-properties`
(tailwindlabs#19855)</code></a></li>
<li><a
href="https://github.com/eslint/eslint/commit/20158b09db3430cf00b202ba8c25ce874bbaf00a"><code>docs:
typo in comment for unused variables handling (tailwindlabs#19870)</code></a></li>
<li><a
href="https://github.com/eslint/eslint/commit/ebfb5b46136c4d737c9783333e3057421d1a0bef"><code>docs:
Fixed Typo in configuration-files.md (tailwindlabs#19873)</code></a></li>
<li><a
href="https://github.com/eslint/eslint/commit/b8a7e7aeb5f0ed2e1670771ab4dda6fd723d96eb"><code>feat:
throw error when column is negative in `getIndexFromLoc`
(tailwindlabs#19831)</code></a></li>
<li><a
href="https://github.com/eslint/eslint/commit/7ef4cf76610d42727a404e495ac6d47868cf5040"><code>fix:
remove unnecessary semicolon from fixes (tailwindlabs#19857)</code></a></li>
<li><a
href="https://github.com/eslint/eslint/commit/7dabc38a8406d470fb2389eec2f0ad1ad214173e"><code>fix:
use `process.version` in `--env-info` (tailwindlabs#19865)</code></a></li>
<li><a
href="https://github.com/eslint/eslint/commit/4112fd09531092e9651e9981205bcd603dc56acf"><code>docs:
clarify that boolean is still allowed for rule `meta.deprecated`
(tailwindlabs#19866)</code></a></li>
</ul>
</details>












---
![Depfu
Status](https://depfu.com/badges/edd6acd35d74c8d41cbb540c30442adf/stats.svg)

[Depfu](https://depfu.com) will automatically keep this PR
conflict-free, as long as you don't add any commits to this branch
yourself. You can also trigger a rebase manually by commenting with
`@depfu rebase`.

<details><summary>All Depfu comment commands</summary>
<blockquote><dl>
<dt>@​depfu rebase</dt><dd>Rebases against your default branch and
redoes this update</dd>
<dt>@​depfu recreate</dt><dd>Recreates this PR, overwriting any edits
that you've made to it</dd>
<dt>@​depfu merge</dt><dd>Merges this PR once your tests are passing and
conflicts are resolved</dd>
<dt>@​depfu cancel merge</dt><dd>Cancels automatic merging of this
PR</dd>
<dt>@​depfu close</dt><dd>Closes this PR and deletes the branch</dd>
<dt>@​depfu reopen</dt><dd>Restores the branch and reopens this PR (if
it's closed)</dd>
<dt>@​depfu pause</dt><dd>Ignores all future updates for this dependency
and closes this PR</dd>
<dt>@​depfu pause [minor|major]</dt><dd>Ignores all future minor/major
updates for this dependency and closes this PR</dd>
<dt>@​depfu resume</dt><dd>Future versions of this dependency will
create PRs again (leaves this PR as is)</dd>
</dl></blockquote>
</details>

Co-authored-by: depfu[bot] <23717796+depfu[bot]@users.noreply.github.com>
@jmlee9707 jmlee9707 mentioned this pull request Mar 29, 2026
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

Preflight applies auto outline to focus-visible iframes

1 participant

@cyphercodes