tailwindcss/integrations/postcss/core-as-postcss-plugin.test.ts
Robin Malfait 52f94c74bb
Improve codebase quality (#19999)
Small PR that improves the overall quality of the codebase. It's a bit
of everything:

1. Using correct variants for the variants we are testing
2. Use `@reference` instead of `@import` in a test, testing the
`@reference` according to the test name
3. Use `using` for Vitest related mocks. They have a `Symbol.dispose`
implemented, so we can don't have to restore mocks ourselves (right now,
some of them are not cleaned up at all).
4. Updated deprecated `.toThrowError` with `.toThrow` APIs

## Test plan

Everything still passes.

[ci-all]
2026-04-30 23:32:37 +02:00

58 lines
1.5 KiB
TypeScript

import { describe } from 'vitest'
import { css, js, json, test } from '../utils'
const variantConfig = {
string: {
'postcss.config.js': js`
module.exports = {
plugins: {
tailwindcss: {},
},
}
`,
},
ESM: {
'postcss.config.mjs': js`
import tailwindcss from 'tailwindcss'
export default {
plugins: [tailwindcss()],
}
`,
},
CJS: {
'postcss.config.cjs': js`
let tailwindcss = require('tailwindcss')
module.exports = {
plugins: [tailwindcss()],
}
`,
},
}
describe.each(Object.keys(variantConfig))('%s', (variant) => {
test(
`can not use \`tailwindcss\` as a postcss module`,
{
fs: {
...variantConfig[variant],
'package.json': json`
{
"dependencies": {
"postcss": "^8",
"postcss-cli": "^10",
"tailwindcss": "workspace:^"
}
}
`,
'src/index.css': css`@import 'tailwindcss';`,
},
},
async ({ exec, expect }) => {
await expect(
exec('pnpm postcss src/index.css --output dist/out.css', undefined, { ignoreStdErr: true }),
).rejects.toThrow(
`It looks like you're trying to use \`tailwindcss\` directly as a PostCSS plugin. The PostCSS plugin has moved to a separate package, so to continue using Tailwind CSS with PostCSS you'll need to install \`@tailwindcss/postcss\` and update your PostCSS configuration.`,
)
},
)
})