diff --git a/integrations/cli/index.test.ts b/integrations/cli/index.test.ts index f392f7544..f17ca0e6a 100644 --- a/integrations/cli/index.test.ts +++ b/integrations/cli/index.test.ts @@ -1,6 +1,6 @@ import os from 'node:os' import path from 'node:path' -import { describe } from 'vitest' +import { describe, expect } from 'vitest' import { candidate, css, html, js, json, test, yaml } from '../utils' const STANDALONE_BINARY = (() => { @@ -255,3 +255,110 @@ describe.each([ }, ) }) + +describe.only('@source', () => { + test( + 'it works', + { + fs: { + 'package.json': json`{}`, + 'pnpm-workspace.yaml': yaml` + # + packages: + - project-a + `, + 'project-a/package.json': json` + { + "dependencies": { + "tailwindcss": "workspace:^", + "@tailwindcss/cli": "workspace:^" + } + } + `, + 'project-a/src/index.css': css` + @import 'tailwindcss/theme' theme(reference); + + /* Run auto-content detection in ../../project-b */ + @import 'tailwindcss/utilities' source('../../project-b'); + + /* Additive: */ + /* {my-lib-1,my-lib-2}: expand */ + /* *.html: only look for .html */ + @source '../node_modules/{my-lib-1,my-lib-2}/src/**/*.html'; + @source './logo.{jpg,png}'; /* Don't worry about it */ + `, + 'project-a/src/index.html': html` +
+ `, + 'project-a/src/logo.jpg': html` + + `, + 'project-a/node_modules/my-lib-1/src/index.html': html` + + `, + 'project-a/node_modules/my-lib-2/src/index.html': html` + + `, + 'project-b/src/index.html': html` + + `, + 'project-b/node_modules/my-lib-3/src/index.html': html` + + `, + }, + }, + async ({ fs, exec, root }) => { + await exec('pnpm tailwindcss --input src/index.css --output dist/out.css', { + cwd: path.join(root, 'project-a'), + }) + + expect(await fs.dumpFiles('./project-a/dist/*.css')).toMatchInlineSnapshot(` + " + --- ./project-a/dist/out.css --- + @tailwind utilities source('../../project-b') { + .content-\\[\\'project-a\\/node_modules\\/my-lib-1\\/src\\/index\\.html\\'\\] { + --tw-content: 'project-a/node modules/my-lib-1/src/index.html'; + content: var(--tw-content); + } + .content-\\[\\'project-a\\/node_modules\\/my-lib-2\\/src\\/index\\.html\\'\\] { + --tw-content: 'project-a/node modules/my-lib-2/src/index.html'; + content: var(--tw-content); + } + .content-\\[\\'project-a\\/src\\/logo\\.jpg\\'\\] { + --tw-content: 'project-a/src/logo.jpg'; + content: var(--tw-content); + } + .content-\\[\\'project-b\\/src\\/index\\.html\\'\\] { + --tw-content: 'project-b/src/index.html'; + content: var(--tw-content); + } + } + @supports (-moz-orient: inline) { + @layer base { + *, ::before, ::after, ::backdrop { + --tw-content: ""; + } + } + } + @property --tw-content { + syntax: "*"; + inherits: false; + initial-value: ""; + } + " + `) + }, + ) +}) diff --git a/integrations/utils.ts b/integrations/utils.ts index 5eed468a0..9e11c5a73 100644 --- a/integrations/utils.ts +++ b/integrations/utils.ts @@ -303,7 +303,11 @@ export function test( return Promise.all( files.map(async (file) => { let content = await fs.readFile(path.join(root, file), 'utf8') - return [file, content] + return [ + file, + // Drop license comment + content.replace(/[\s\n]*\/\*! tailwindcss .*? \*\/[\s\n]*/g, ''), + ] }), ) },