mirror of
https://github.com/tailwindlabs/tailwindcss.git
synced 2025-12-08 21:36:08 +00:00
ef325ea35b
* add normalizeScreens function This will allow us to normalize the various kinds of inputs to a stable version that is consistent regardless of the input. * use normalized screens * add dedicated test for new tuple syntax * make test consistent with other tests While working on the normalizeScreens feature, some tests started failing (the one with multiple screens), while looking at them I made them consistent with the rest of the codebase. * add test to ensure consistent order in screens output * update changelog * Update CHANGELOG.md * Update CHANGELOG.md Co-authored-by: Adam Wathan <adam.wathan@gmail.com>
99 lines
2.6 KiB
JavaScript
99 lines
2.6 KiB
JavaScript
import { normalizeScreens } from '../src/util/normalizeScreens'
|
|
|
|
it('should normalize an array of string values', () => {
|
|
let screens = ['768px', '1200px']
|
|
|
|
expect(normalizeScreens(screens)).toEqual([
|
|
{ name: '768px', values: [{ min: '768px', max: undefined }] },
|
|
{ name: '1200px', values: [{ min: '1200px', max: undefined }] },
|
|
])
|
|
})
|
|
|
|
it('should normalize an object with string values', () => {
|
|
let screens = {
|
|
a: '768px',
|
|
b: '1200px',
|
|
}
|
|
|
|
expect(normalizeScreens(screens)).toEqual([
|
|
{ name: 'a', values: [{ min: '768px', max: undefined }] },
|
|
{ name: 'b', values: [{ min: '1200px', max: undefined }] },
|
|
])
|
|
})
|
|
|
|
it('should normalize an object with object values', () => {
|
|
let screens = {
|
|
a: { min: '768px' },
|
|
b: { max: '1200px' },
|
|
}
|
|
|
|
expect(normalizeScreens(screens)).toEqual([
|
|
{ name: 'a', values: [{ min: '768px', max: undefined }] },
|
|
{ name: 'b', values: [{ min: undefined, max: '1200px' }] },
|
|
])
|
|
})
|
|
|
|
it('should normalize an object with multiple object values', () => {
|
|
let screens = {
|
|
a: [{ min: '768px' }, { max: '1200px' }],
|
|
}
|
|
|
|
expect(normalizeScreens(screens)).toEqual([
|
|
{
|
|
name: 'a',
|
|
values: [
|
|
{ max: undefined, min: '768px', raw: undefined },
|
|
{ max: '1200px', min: undefined, raw: undefined },
|
|
],
|
|
},
|
|
])
|
|
})
|
|
|
|
it('should normalize an object with object values (min-width normalized to width)', () => {
|
|
let screens = {
|
|
a: { 'min-width': '768px' },
|
|
b: { max: '1200px' },
|
|
}
|
|
|
|
expect(normalizeScreens(screens)).toEqual([
|
|
{ name: 'a', values: [{ min: '768px', max: undefined }] },
|
|
{ name: 'b', values: [{ min: undefined, max: '1200px' }] },
|
|
])
|
|
})
|
|
|
|
it('should normalize a tuple with string values', () => {
|
|
let screens = [
|
|
['a', '768px'],
|
|
['b', '1200px'],
|
|
]
|
|
|
|
expect(normalizeScreens(screens)).toEqual([
|
|
{ name: 'a', values: [{ min: '768px', max: undefined }] },
|
|
{ name: 'b', values: [{ min: '1200px', max: undefined }] },
|
|
])
|
|
})
|
|
|
|
it('should normalize a tuple with object values', () => {
|
|
let screens = [
|
|
['a', { min: '768px' }],
|
|
['b', { max: '1200px' }],
|
|
]
|
|
|
|
expect(normalizeScreens(screens)).toEqual([
|
|
{ name: 'a', values: [{ min: '768px', max: undefined }] },
|
|
{ name: 'b', values: [{ min: undefined, max: '1200px' }] },
|
|
])
|
|
})
|
|
|
|
it('should normalize a tuple with object values (min-width normalized to width)', () => {
|
|
let screens = [
|
|
['a', { 'min-width': '768px' }],
|
|
['b', { max: '1200px' }],
|
|
]
|
|
|
|
expect(normalizeScreens(screens)).toEqual([
|
|
{ name: 'a', values: [{ min: '768px', max: undefined }] },
|
|
{ name: 'b', values: [{ min: undefined, max: '1200px' }] },
|
|
])
|
|
})
|