integrations/turbopack/loader.test.ts - main - githubmirror/tailwindcss

integrations/turbopack/loader.test.ts
83 строки2 KB
Tim Neutkens
Use default Turbopack mode in integration test
31 июл 2026, 16:13
31 июл 2026, 16:1325fa72c
import { candidate, css, fetchStyles, js, json, jsx, retryAssertion, test } from '../utils'

test(
  '@tailwindcss/turbopack loader (dev)',
  {
    timeout: 120_000,
    fs: {
      'package.json': json`
        {
          "dependencies": {
            "next": "^16.2.7",
            "react": "^19.2.7",
            "react-dom": "^19.2.7",
            "tailwindcss": "workspace:^",
            "@tailwindcss/turbopack": "workspace:^"
          }
        }
      `,
      'next.config.mjs': js`
        export default {
          turbopack: {
            rules: {
              '*.css': {
                loaders: ['@tailwindcss/turbopack'],
                as: '*.css',
              },
            },
          },
        }
      `,
      'app/layout.js': jsx`
        import './globals.css'

        export default function RootLayout({ children }) {
          return (
            <html>
              <body>{children}</body>
            </html>
          )
        }
      `,
      'app/page.js': jsx`
        export default function Page() {
          return <div className="flex">Hello, Next.js!</div>
        }
      `,
      'app/globals.css': css` @import 'tailwindcss'; `,
    },
  },
  async ({ fs, spawn, expect }) => {
    let process = await spawn('pnpm next dev')

    let url = ''
    await process.onStdout((message) => {
      let match = /Local:\s*(http.*)/.exec(message)
      if (match) url = match[1]
      return Boolean(url)
    })

    await process.onStdout((message) => message.includes('Ready in'))

    await retryAssertion(async () => {
      let styles = await fetchStyles(url)
      expect(styles).toContain(candidate`flex`)
      expect(styles).not.toContain(candidate`underline`)
    })

    await fs.write(
      'app/page.js',
      jsx`
        export default function Page() {
          return <div className="flex underline">Hello, Next.js!</div>
        }
      `,
    )

    await retryAssertion(async () => {
      let styles = await fetchStyles(url)
      expect(styles).toContain(candidate`flex`)
      expect(styles).toContain(candidate`underline`)
    })
  },
)