@@ -45,7 +45,7 @@ test('user-defined dark mode variants do not stack', () => {
4545 } )
4646} )
4747
48- test ( 'generating dark mode variants uses the media strategy by default ' , ( ) => {
48+ test ( 'dark mode variants can be generated using the class strategy ' , ( ) => {
4949 const input = `
5050 @variants dark {
5151 .text-red {
@@ -67,7 +67,7 @@ test('generating dark mode variants uses the media strategy by default', () => {
6767
6868 expect . assertions ( 2 )
6969
70- return run ( input ) . then ( ( result ) => {
70+ return run ( input , { darkMode : 'media' } ) . then ( ( result ) => {
7171 expect ( result . css ) . toMatchCss ( expected )
7272 expect ( result . warnings ( ) . length ) . toBe ( 0 )
7373 } )
@@ -95,7 +95,7 @@ test('dark mode variants can be generated even when the user has their own plugi
9595
9696 expect . assertions ( 2 )
9797
98- return run ( input , { plugins : [ ] } ) . then ( ( result ) => {
98+ return run ( input , { darkMode : 'media' , plugins : [ ] } ) . then ( ( result ) => {
9999 expect ( result . css ) . toMatchCss ( expected )
100100 expect ( result . warnings ( ) . length ) . toBe ( 0 )
101101 } )
@@ -121,7 +121,7 @@ test('dark mode variants can be generated using the class strategy', () => {
121121
122122 expect . assertions ( 2 )
123123
124- return run ( input , { dark : 'class' } ) . then ( ( result ) => {
124+ return run ( input , { darkMode : 'class' } ) . then ( ( result ) => {
125125 expect ( result . css ) . toMatchCss ( expected )
126126 expect ( result . warnings ( ) . length ) . toBe ( 0 )
127127 } )
@@ -150,6 +150,29 @@ test('dark mode variants can be disabled', () => {
150150 } )
151151} )
152152
153+ test ( 'dark mode variants are disabled by default' , ( ) => {
154+ const input = `
155+ @variants dark {
156+ .text-red {
157+ color: red;
158+ }
159+ }
160+ `
161+
162+ const expected = `
163+ .text-red {
164+ color: red;
165+ }
166+ `
167+
168+ expect . assertions ( 2 )
169+
170+ return run ( input ) . then ( ( result ) => {
171+ expect ( result . css ) . toMatchCss ( expected )
172+ expect ( result . warnings ( ) . length ) . toBe ( 0 )
173+ } )
174+ } )
175+
153176test ( 'dark mode variants stack with other variants' , ( ) => {
154177 const input = `
155178 @variants responsive, dark, hover, focus {
@@ -228,10 +251,12 @@ test('dark mode variants stack with other variants', () => {
228251
229252 expect . assertions ( 2 )
230253
231- return run ( input , { theme : { screens : { sm : '500px' , lg : '800px' } } } ) . then ( ( result ) => {
232- expect ( result . css ) . toMatchCss ( expected )
233- expect ( result . warnings ( ) . length ) . toBe ( 0 )
234- } )
254+ return run ( input , { darkMode : 'media' , theme : { screens : { sm : '500px' , lg : '800px' } } } ) . then (
255+ ( result ) => {
256+ expect ( result . css ) . toMatchCss ( expected )
257+ expect ( result . warnings ( ) . length ) . toBe ( 0 )
258+ }
259+ )
235260} )
236261
237262test ( 'dark mode variants stack with other variants when using the class strategy' , ( ) => {
@@ -324,7 +349,7 @@ test('dark mode variants stack with other variants when using the class strategy
324349
325350 expect . assertions ( 2 )
326351
327- return run ( input , { dark : 'class' , theme : { screens : { sm : '500px' , lg : '800px' } } } ) . then (
352+ return run ( input , { darkMode : 'class' , theme : { screens : { sm : '500px' , lg : '800px' } } } ) . then (
328353 ( result ) => {
329354 expect ( result . css ) . toMatchCss ( expected )
330355 expect ( result . warnings ( ) . length ) . toBe ( 0 )
0 commit comments