tailwindcss/tests/syntax-lit-html.test.js
Robin Malfait b643d399db
use oxide
- Setup the codebase to be able to use the Rust parts based on an
  environment variable: `OXIDE=1`.
- Setup some tests that run both the non-Rust and Rust version in the
  same test.
- Sort the candidates in a consistent way, to guarantee the order for
  now (especially in tests).
- Reflect sorting related changes in tests.
- Ensure tests run in both the Rust and non-Rust version. (Some tests
  are explicitly skipped when using the Rust version since we haven't
  implemented those features yet. These include: custom prefix,
  transformers and extractors).
  - `jest`
  -`OXIDE=1 jest`
2023-01-05 16:01:11 +01:00

47 lines
1.1 KiB
JavaScript

import { run } from './util/run'
let css = String.raw
test('it detects classes in lit-html templates', () => {
let config = {
content: [
{
raw: `html\`<button class="bg-blue-400 hover:bg-blue-600 text-white font-bold py-2 px-4 rounded">\${data.title}</button>\`;`,
},
],
corePlugins: { preflight: false },
theme: {},
plugins: [],
}
return run('@tailwind utilities', config).then((result) => {
expect(result.css).toMatchCss(css`
.rounded {
border-radius: 0.25rem;
}
.bg-blue-400 {
--tw-bg-opacity: 1;
background-color: rgb(96 165 250 / var(--tw-bg-opacity));
}
.px-4 {
padding-left: 1rem;
padding-right: 1rem;
}
.py-2 {
padding-top: 0.5rem;
padding-bottom: 0.5rem;
}
.font-bold {
font-weight: 700;
}
.text-white {
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity));
}
.hover\:bg-blue-600:hover {
--tw-bg-opacity: 1;
background-color: rgb(37 99 235 / var(--tw-bg-opacity));
}
`)
})
})