Skip to content

Commit b5b3872

Browse files
committed
Test apply partitioning and media queries
This has already been fixed due to another change but wanted to add an explicit test for it
1 parent a891867 commit b5b3872

File tree

1 file changed

+51
-0
lines changed

1 file changed

+51
-0
lines changed

tests/apply.test.js

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1202,3 +1202,54 @@ it('should work in layer', async () => {
12021202
}
12031203
`)
12041204
})
1205+
1206+
it('apply partitioning works with media queries', async () => {
1207+
let config = {
1208+
content: [{ raw: html`` }],
1209+
corePlugins: { preflight: false },
1210+
}
1211+
1212+
let input = css`
1213+
@tailwind base;
1214+
@layer base {
1215+
html,
1216+
body {
1217+
@apply text-green-600;
1218+
font-size: 1rem;
1219+
}
1220+
1221+
@media print {
1222+
html,
1223+
body {
1224+
@apply text-red-600;
1225+
font-size: 2rem;
1226+
}
1227+
}
1228+
}
1229+
`
1230+
1231+
await run(input, config)
1232+
const result = await run(input, config)
1233+
1234+
expect(result.css).toMatchFormattedCss(css`
1235+
html,
1236+
body {
1237+
--tw-text-opacity: 1;
1238+
color: rgb(22 163 74 / var(--tw-text-opacity));
1239+
font-size: 1rem;
1240+
}
1241+
1242+
@media print {
1243+
html,
1244+
body {
1245+
--tw-text-opacity: 1;
1246+
color: rgb(220 38 38 / var(--tw-text-opacity));
1247+
}
1248+
html,
1249+
body {
1250+
font-size: 2rem;
1251+
}
1252+
}
1253+
${defaults}
1254+
`)
1255+
})

0 commit comments

Comments
 (0)