mirror of
https://github.com/tailwindlabs/tailwindcss.git
synced 2025-12-08 21:36:08 +00:00
* Run test suite against both engines * make eslint happy * only run `stable` tests on Node 12 * use normal expectation instead of snapshot file When we run the tests only against `stable` (for node 12), then the snapshots exists for the `Oxide` build. They are marked as `obsolete` and will cause the `npm run test` script to fail. Sadly. Inlined them for now, but ideally we make those tests more blackbox-y so that we test that we get source maps and that we can map the sourcemap back to the input files (without looking at the actual annotations). * properly indent inline css Co-authored-by: Adam Wathan <4323180+adamwathan@users.noreply.github.com> Co-authored-by: Robin Malfait <malfait.robin@gmail.com>
85 lines
2.1 KiB
JavaScript
85 lines
2.1 KiB
JavaScript
import { crosscheck } from './util/run'
|
|
import flattenColorPalette from '../src/util/flattenColorPalette'
|
|
|
|
crosscheck(() => {
|
|
test('it flattens nested color objects', () => {
|
|
expect(
|
|
flattenColorPalette({
|
|
purple: 'purple',
|
|
white: {
|
|
25: 'rgba(255,255,255,.25)',
|
|
50: 'rgba(255,255,255,.5)',
|
|
75: 'rgba(255,255,255,.75)',
|
|
DEFAULT: '#fff',
|
|
},
|
|
red: {
|
|
1: 'rgb(33,0,0)',
|
|
2: 'rgb(67,0,0)',
|
|
3: 'rgb(100,0,0)',
|
|
},
|
|
green: {
|
|
1: 'rgb(0,33,0)',
|
|
2: 'rgb(0,67,0)',
|
|
3: 'rgb(0,100,0)',
|
|
},
|
|
blue: {
|
|
1: 'rgb(0,0,33)',
|
|
2: 'rgb(0,0,67)',
|
|
3: 'rgb(0,0,100)',
|
|
},
|
|
})
|
|
).toEqual({
|
|
purple: 'purple',
|
|
'white-25': 'rgba(255,255,255,.25)',
|
|
'white-50': 'rgba(255,255,255,.5)',
|
|
'white-75': 'rgba(255,255,255,.75)',
|
|
white: '#fff',
|
|
'red-1': 'rgb(33,0,0)',
|
|
'red-2': 'rgb(67,0,0)',
|
|
'red-3': 'rgb(100,0,0)',
|
|
'green-1': 'rgb(0,33,0)',
|
|
'green-2': 'rgb(0,67,0)',
|
|
'green-3': 'rgb(0,100,0)',
|
|
'blue-1': 'rgb(0,0,33)',
|
|
'blue-2': 'rgb(0,0,67)',
|
|
'blue-3': 'rgb(0,0,100)',
|
|
})
|
|
})
|
|
|
|
test('it flattens deeply nested color objects', () => {
|
|
expect(
|
|
flattenColorPalette({
|
|
primary: 'purple',
|
|
secondary: {
|
|
DEFAULT: 'blue',
|
|
hover: 'cyan',
|
|
focus: 'red',
|
|
},
|
|
button: {
|
|
primary: {
|
|
DEFAULT: 'magenta',
|
|
hover: 'green',
|
|
focus: {
|
|
DEFAULT: 'yellow',
|
|
variant: 'orange',
|
|
},
|
|
},
|
|
},
|
|
})
|
|
).toEqual({
|
|
primary: 'purple',
|
|
secondary: 'blue',
|
|
'secondary-hover': 'cyan',
|
|
'secondary-focus': 'red',
|
|
'button-primary': 'magenta',
|
|
'button-primary-hover': 'green',
|
|
'button-primary-focus': 'yellow',
|
|
'button-primary-focus-variant': 'orange',
|
|
})
|
|
})
|
|
|
|
test('it handles empty objects', () => {
|
|
expect(flattenColorPalette({})).toEqual({})
|
|
})
|
|
})
|