tailwindcss/tests/custom-transformers.test.js
Robin Malfait 1454190ea0
inline tests (#10362)
This will reduce the amount of different test "implementations" and
should further unify/normalise the tests. Some tests are very large and
can be split up more but this is a start in the right direction.

One of the biggest benefits is that changes in the tests file re-trigger
a jest run in watch mode. A change in the HTML/CSS file won't.
2023-01-19 11:42:52 +01:00

71 lines
1.5 KiB
JavaScript

import { run, html, css } from './util/run'
import { env } from '../src/lib/sharedState'
let t = env.OXIDE ? test.skip : test
function customTransformer(content) {
return content.replace(/uppercase/g, 'lowercase')
}
t('transform function', () => {
let config = {
content: {
files: [{ raw: html`<div class="uppercase"></div>` }],
transform: customTransformer,
},
}
return run('@tailwind utilities', config).then((result) => {
expect(result.css).toMatchFormattedCss(css`
.lowercase {
text-transform: lowercase;
}
`)
})
})
t('transform.DEFAULT', () => {
let config = {
content: {
files: [{ raw: html`<div class="uppercase"></div>` }],
transform: {
DEFAULT: customTransformer,
},
},
}
return run('@tailwind utilities', config).then((result) => {
expect(result.css).toMatchFormattedCss(css`
.lowercase {
text-transform: lowercase;
}
`)
})
})
t('transform.{extension}', () => {
let config = {
content: {
files: [
{ raw: 'blah blah blah', extension: 'html' },
{ raw: 'blah blah blah', extension: 'php' },
],
transform: {
html: () => 'uppercase',
php: () => 'lowercase',
},
},
}
return run('@tailwind utilities', config).then((result) => {
expect(result.css).toMatchFormattedCss(css`
.uppercase {
text-transform: uppercase;
}
.lowercase {
text-transform: lowercase;
}
`)
})
})