diff --git a/integrations/upgrade/index.test.ts b/integrations/upgrade/index.test.ts index 3680e8ae353c..cd89f6d38b6f 100644 --- a/integrations/upgrade/index.test.ts +++ b/integrations/upgrade/index.test.ts @@ -1560,7 +1560,7 @@ test( `, 'tailwind.config.js': js`module.exports = {}`, 'src/index.css': css` - @import 'tailwindcss/utilities'; + @import 'tailwindcss/components'; /* No layer expected */ @import './my-components.css'; @@ -1571,7 +1571,7 @@ test( /* Expecting a layer */ @import './my-other.css'; - @import 'tailwindcss/components'; + @import 'tailwindcss/utilities'; `, 'src/my-components.css': css` @layer components { @@ -1600,8 +1600,6 @@ test( expect(await fs.dumpFiles('./src/**/*.css')).toMatchInlineSnapshot(` " --- ./src/index.css --- - @import 'tailwindcss/utilities' layer(utilities); - /* No layer expected */ @import './my-components.css'; @@ -1609,7 +1607,9 @@ test( @import './my-utilities.css'; /* Expecting a layer */ - @import './my-other.css' layer(utilities); + @import './my-other.css' layer(components); + + @import 'tailwindcss/utilities' layer(utilities); --- ./src/my-components.css --- @utility foo { diff --git a/packages/@tailwindcss-upgrade/src/index.ts b/packages/@tailwindcss-upgrade/src/index.ts index b2f211b45957..46b1fd6729e6 100644 --- a/packages/@tailwindcss-upgrade/src/index.ts +++ b/packages/@tailwindcss-upgrade/src/index.ts @@ -158,8 +158,8 @@ async function run() { ) if (!importedSheet) continue - // Only remove the `layer(…)` next to the import, if any of the children - // contains an `@utility`. Otherwise the `@utility` will not be top-level. + // Only remove the `layer(…)` next to the import if any of the children + // contain `@utility`. Otherwise `@utility` will not be top-level. if ( !importedSheet.containsRule((node) => node.type === 'atrule' && node.name === 'utility') ) {