Skip to content

Commit 4240fc3

Browse files
RobinMalfaitRobinMalfait
committed
add integration tests for tailwind.config.ts and tailwind.config.js with ESM syntax
1 parent b6798de commit 4240fc3

File tree

6 files changed

+699
-12
lines changed

6 files changed

+699
-12
lines changed

‎integrations/parcel/tests/integration.test.js

+130-3
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,12 @@ let { css, html, javascript } = require('../../syntax')
33
let { env } = require('../../../lib/lib/sharedState')
44

55
let {
6-
readOutputFile,
76
appendToInputFile,
8-
writeInputFile,
9-
waitForOutputFileCreation,
7+
readOutputFile,
8+
removeFile,
109
waitForOutputFileChange,
10+
waitForOutputFileCreation,
11+
writeInputFile,
1112
} = require('../../io')({ output: 'dist', input: 'src' })
1213

1314
describe('static build', () => {
@@ -32,6 +33,132 @@ describe('static build', () => {
3233
`
3334
)
3435
})
36+
37+
it('can use a tailwind.config.js configuration file with ESM syntax', async () => {
38+
await removeFile('tailwind.config.js')
39+
await writeInputFile(
40+
'index.html',
41+
html`
42+
<link rel="stylesheet" href="./index.css" />
43+
<div class="bg-primary"></div>
44+
`
45+
)
46+
await writeInputFile(
47+
'index.css',
48+
css`
49+
@tailwind base;
50+
@tailwind components;
51+
@tailwind utilities;
52+
`
53+
)
54+
await writeInputFile(
55+
'../tailwind.config.js',
56+
javascript`
57+
export default {
58+
content: ['./src/index.html'],
59+
theme: {
60+
extend: {
61+
colors: {
62+
primary: 'black',
63+
},
64+
},
65+
},
66+
corePlugins: {
67+
preflight: false,
68+
},
69+
}
70+
`
71+
)
72+
73+
await $('parcel build ./src/index.html --no-cache', {
74+
env: { NODE_ENV: 'production' },
75+
})
76+
77+
if (!env.OXIDE) {
78+
expect(await readOutputFile(/index\.\w+\.css$/)).toIncludeCss(
79+
css`
80+
.bg-primary {
81+
--tw-bg-opacity: 1;
82+
background-color: rgb(0 0 0 / var(--tw-bg-opacity));
83+
}
84+
`
85+
)
86+
}
87+
88+
if (env.OXIDE) {
89+
expect(await readOutputFile(/index\.\w+\.css$/)).toIncludeCss(
90+
css`
91+
.bg-primary {
92+
background-color: black;
93+
}
94+
`
95+
)
96+
}
97+
})
98+
99+
it('can use a tailwind.config.ts configuration file', async () => {
100+
await removeFile('tailwind.config.js')
101+
await writeInputFile(
102+
'index.html',
103+
html`
104+
<link rel="stylesheet" href="./index.css" />
105+
<div class="bg-primary"></div>
106+
`
107+
)
108+
await writeInputFile(
109+
'index.css',
110+
css`
111+
@tailwind base;
112+
@tailwind components;
113+
@tailwind utilities;
114+
`
115+
)
116+
await writeInputFile(
117+
'../tailwind.config.ts',
118+
javascript`
119+
import type { Config } from 'tailwindcss'
120+
121+
export default {
122+
content: ['./src/index.html'],
123+
theme: {
124+
extend: {
125+
colors: {
126+
primary: 'black',
127+
},
128+
},
129+
},
130+
corePlugins: {
131+
preflight: false,
132+
},
133+
} satisfies Config
134+
`
135+
)
136+
137+
await $('parcel build ./src/index.html --no-cache', {
138+
env: { NODE_ENV: 'production' },
139+
})
140+
141+
if (!env.OXIDE) {
142+
expect(await readOutputFile(/index\.\w+\.css$/)).toIncludeCss(
143+
css`
144+
.bg-primary {
145+
--tw-bg-opacity: 1;
146+
background-color: rgb(0 0 0 / var(--tw-bg-opacity));
147+
}
148+
`
149+
)
150+
}
151+
152+
if (env.OXIDE) {
153+
expect(await readOutputFile(/index\.\w+\.css$/)).toIncludeCss(
154+
css`
155+
.bg-primary {
156+
background-color: black;
157+
}
158+
`
159+
)
160+
}
161+
})
35162
})
36163

37164
describe('watcher', () => {

‎integrations/rollup/tests/integration.test.js

+115-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ let $ = require('../../execute')
22
let { css, html, javascript } = require('../../syntax')
33
let { env } = require('../../../lib/lib/sharedState')
44

5-
let { readOutputFile, appendToInputFile, writeInputFile } = require('../../io')({
5+
let { readOutputFile, appendToInputFile, writeInputFile, removeFile } = require('../../io')({
66
output: 'dist',
77
input: 'src',
88
})
@@ -27,6 +27,120 @@ describe('static build', () => {
2727
`
2828
)
2929
})
30+
31+
it('can use a tailwind.config.js configuration file with ESM syntax', async () => {
32+
await removeFile('tailwind.config.js')
33+
await writeInputFile('index.html', html`<div class="bg-primary"></div>`)
34+
await writeInputFile(
35+
'index.css',
36+
css`
37+
@tailwind base;
38+
@tailwind components;
39+
@tailwind utilities;
40+
`
41+
)
42+
await writeInputFile(
43+
'../tailwind.config.js',
44+
javascript`
45+
export default {
46+
content: ['./src/index.html'],
47+
theme: {
48+
extend: {
49+
colors: {
50+
primary: 'black',
51+
},
52+
},
53+
},
54+
corePlugins: {
55+
preflight: false,
56+
},
57+
}
58+
`
59+
)
60+
61+
await $('rollup -c', {
62+
env: { NODE_ENV: 'production' },
63+
})
64+
65+
if (!env.OXIDE) {
66+
expect(await readOutputFile('index.css')).toIncludeCss(
67+
css`
68+
.bg-primary {
69+
--tw-bg-opacity: 1;
70+
background-color: rgb(0 0 0 / var(--tw-bg-opacity));
71+
}
72+
`
73+
)
74+
}
75+
76+
if (env.OXIDE) {
77+
expect(await readOutputFile('index.css')).toIncludeCss(
78+
css`
79+
.bg-primary {
80+
background-color: black;
81+
}
82+
`
83+
)
84+
}
85+
})
86+
87+
it('can use a tailwind.config.ts configuration file', async () => {
88+
await removeFile('tailwind.config.js')
89+
await writeInputFile('index.html', html`<div class="bg-primary"></div>`)
90+
await writeInputFile(
91+
'index.css',
92+
css`
93+
@tailwind base;
94+
@tailwind components;
95+
@tailwind utilities;
96+
`
97+
)
98+
await writeInputFile(
99+
'../tailwind.config.ts',
100+
javascript`
101+
import type { Config } from 'tailwindcss'
102+
103+
export default {
104+
content: ['./src/index.html'],
105+
theme: {
106+
extend: {
107+
colors: {
108+
primary: 'black',
109+
},
110+
},
111+
},
112+
corePlugins: {
113+
preflight: false,
114+
},
115+
} satisfies Config
116+
`
117+
)
118+
119+
await $('rollup -c', {
120+
env: { NODE_ENV: 'production' },
121+
})
122+
123+
if (!env.OXIDE) {
124+
expect(await readOutputFile('index.css')).toIncludeCss(
125+
css`
126+
.bg-primary {
127+
--tw-bg-opacity: 1;
128+
background-color: rgb(0 0 0 / var(--tw-bg-opacity));
129+
}
130+
`
131+
)
132+
}
133+
134+
if (env.OXIDE) {
135+
expect(await readOutputFile('index.css')).toIncludeCss(
136+
css`
137+
.bg-primary {
138+
background-color: black;
139+
}
140+
`
141+
)
142+
}
143+
})
30144
})
31145

32146
describe('watcher', () => {

0 commit comments

Comments
 (0)