Skip to content

Commit b92f033

Browse files
authored
Disable dark mode by default, rename config option to darkMode (#2631)
* Disable dark mode by default, rename config option to `darkMode` * Rebuild fixtures
1 parent fc5c9ce commit b92f033

9 files changed

+270517
-471370
lines changed

__tests__/darkMode.test.js

+34-9
Original file line numberDiff line numberDiff line change
@@ -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+
153176
test('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

237262
test('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

Comments
 (0)