mirror of
https://github.com/tailwindlabs/tailwindcss.git
synced 2025-12-08 21:36:08 +00:00
3fb57e55ab
* Add dark mode variant option * Tweak warning messages * Add legacy dark mode option * wip * Use `class` for legacy behavior, `selector` for new behavior * Add simplified failing apply/where test case * Switch to `where` list, apply changes to `dir` variants * Don’t let `:where`, `:is:`, or `:has` be attached to pseudo elements * Updating tests... * Finish updating tests * Remove `variant` dark mode strategy * Update types * Update comments * Update changelog * Revert "Remove `variant` dark mode strategy" This reverts commit 185250438ccb2f61ba876d4676823c1807891122. * Add variant back to types * wip * Update comments * Update tests * Rename variable * Update changelog * Update changelog * Update changelog * Fix CS --------- Co-authored-by: Adam Wathan <4323180+adamwathan@users.noreply.github.com>
29 lines
2.2 KiB
JavaScript
29 lines
2.2 KiB
JavaScript
import { crosscheck } from '../util/run'
|
|
import { applyImportantSelector } from '../../src/util/applyImportantSelector'
|
|
|
|
crosscheck(() => {
|
|
it.each`
|
|
before | after
|
|
${'.foo'} | ${'#app :is(.foo)'}
|
|
${'.foo .bar'} | ${'#app :is(.foo .bar)'}
|
|
${'.foo:hover'} | ${'#app :is(.foo:hover)'}
|
|
${'.foo .bar:hover'} | ${'#app :is(.foo .bar:hover)'}
|
|
${'.foo::before'} | ${'#app :is(.foo)::before'}
|
|
${'.foo::before'} | ${'#app :is(.foo)::before'}
|
|
${'.foo::file-selector-button'} | ${'#app :is(.foo)::file-selector-button'}
|
|
${'.foo::-webkit-progress-bar'} | ${'#app :is(.foo)::-webkit-progress-bar'}
|
|
${'.foo:hover::before'} | ${'#app :is(.foo:hover)::before'}
|
|
${':is(:where(.dark) :is(:where([dir="rtl"]) .foo::before))'} | ${'#app :is(:where(.dark) :is(:where([dir="rtl"]) .foo))::before'}
|
|
${':is(:where(.dark) .foo) .bar'} | ${'#app :is(:is(:where(.dark) .foo) .bar)'}
|
|
${':is(.foo) :is(.bar)'} | ${'#app :is(:is(.foo) :is(.bar))'}
|
|
${':is(.foo)::before'} | ${'#app :is(.foo)::before'}
|
|
${'.foo:before'} | ${'#app :is(.foo):before'}
|
|
${'.foo::some-uknown-pseudo'} | ${'#app :is(.foo)::some-uknown-pseudo'}
|
|
${'.foo::some-uknown-pseudo:hover'} | ${'#app :is(.foo)::some-uknown-pseudo:hover'}
|
|
${'.foo:focus::some-uknown-pseudo:hover'} | ${'#app :is(.foo:focus)::some-uknown-pseudo:hover'}
|
|
${'.foo:hover::some-uknown-pseudo:focus'} | ${'#app :is(.foo:hover)::some-uknown-pseudo:focus'}
|
|
`('should generate "$after" from "$before"', ({ before, after }) => {
|
|
expect(applyImportantSelector(before, '#app')).toEqual(after)
|
|
})
|
|
})
|