1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253 |
- import postcss from 'postcss'
- import fs from 'fs'
- import path from 'path'
- import { run } from './util/run'
- function pluginThatMutatesRules() {
- return (root) => {
- root.walkRules((rule) => {
- rule.nodes
- .filter((node) => node.prop === 'background-image')
- .forEach((node) => {
- node.value = 'url("./bar.png")'
- })
- return rule
- })
- }
- }
- test.only('plugins mutating rules after tailwind doesnt break it', async () => {
- let config = {
- content: [path.resolve(__dirname, './mutable.test.html')],
- theme: {
- backgroundImage: {
- foo: 'url("./foo.png")',
- },
- },
- plugins: [],
- }
- function checkResult(result) {
- let expectedPath = path.resolve(__dirname, './mutable.test.css')
- let expected = fs.readFileSync(expectedPath, 'utf8')
- expect(result.css).toMatchFormattedCss(expected)
- }
- // Verify the first run produces the expected result
- let firstRun = await run('@tailwind utilities', config)
- checkResult(firstRun)
- // Outside of the context of tailwind jit more postcss plugins may operate on the AST:
- // In this case we have a plugin that mutates rules directly
- await postcss([pluginThatMutatesRules()]).process(firstRun, {
- from: path.resolve(__filename),
- })
- // Verify subsequent runs don't produce mutated rules
- let secondRun = await run('@tailwind utilities', config)
- checkResult(secondRun)
- })
|