Skip to content

Commit 1f37123

Browse files
hasparushasparus
committed
Pass empty theme to ThemeProvider in tests and examples
1 parent b5e0849 commit 1f37123

File tree

7 files changed

+36
-40
lines changed

7 files changed

+36
-40
lines changed

‎examples/codesandbox-starter/src/index.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import { jsx, Layout, Styled } from 'theme-ui'
66

77
function App() {
88
return (
9-
<ThemeProvider>
9+
<ThemeProvider theme={{}}>
1010
<Layout sx={{ p: 3 }}>
1111
<Reset />
1212
<Styled.h1 sx={{ color: 'primary', mb: 3 }}>Hello Theme UI</Styled.h1>

‎packages/color-modes/test/index.js

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -90,7 +90,7 @@ test('useColorMode updates color mode state', () => {
9090
)
9191
}
9292
const tree = render(
93-
<ThemeProvider>
93+
<ThemeProvider theme={{}}>
9494
<ColorModeProvider>
9595
<Button />
9696
</ColorModeProvider>
@@ -182,7 +182,7 @@ test('uses default mode', () => {
182182
return <button children="test" />
183183
}
184184
const tree = render(
185-
<ThemeProvider>
185+
<ThemeProvider theme={{}}>
186186
<ColorModeProvider>
187187
<Button />
188188
</ColorModeProvider>
@@ -200,7 +200,7 @@ test('initializes mode based on localStorage', () => {
200200
return <button children="test" />
201201
}
202202
const tree = render(
203-
<ThemeProvider>
203+
<ThemeProvider theme={{}}>
204204
<ColorModeProvider>
205205
<Button />
206206
</ColorModeProvider>
@@ -237,7 +237,7 @@ test('retains initial context', () => {
237237
return false
238238
}
239239
render(
240-
<ThemeProvider>
240+
<ThemeProvider theme={{}}>
241241
<ColorModeProvider>
242242
<Consumer />
243243
</ColorModeProvider>
@@ -340,7 +340,7 @@ test('does not initialize mode from prefers-color-scheme media query when useCol
340340
return false
341341
}
342342
render(
343-
<ThemeProvider>
343+
<ThemeProvider theme={{}}>
344344
<ColorModeProvider>
345345
<Consumer />
346346
</ColorModeProvider>
@@ -606,7 +606,7 @@ test('warns when localStorage is disabled', () => {
606606
}
607607

608608
render(
609-
<ThemeProvider>
609+
<ThemeProvider theme={{}}>
610610
<ColorModeProvider>
611611
<Consumer />
612612
</ColorModeProvider>

‎packages/core/test/index.js

Lines changed: 19 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,7 @@ import renderer from 'react-test-renderer'
44
import { render, fireEvent, cleanup, act } from '@testing-library/react'
55
import { matchers } from 'jest-emotion'
66
import mockConsole from 'jest-mock-console'
7-
import {
8-
jsx,
9-
Context,
10-
useThemeUI,
11-
merge,
12-
ThemeProvider,
13-
} from '../src'
7+
import { jsx, Context, useThemeUI, merge, ThemeProvider } from '../src'
148

159
afterEach(cleanup)
1610

@@ -21,7 +15,7 @@ const renderJSON = el => renderer.create(el).toJSON()
2115
describe('ThemeProvider', () => {
2216
test('renders', () => {
2317
const json = renderJSON(
24-
<ThemeProvider>
18+
<ThemeProvider theme={{}}>
2519
<h1>Hello</h1>
2620
</ThemeProvider>
2721
)
@@ -35,7 +29,7 @@ describe('ThemeProvider', () => {
3529
value={{
3630
emotionVersion: '9.0.0',
3731
}}>
38-
<ThemeProvider>Conflicting versions</ThemeProvider>
32+
<ThemeProvider theme={{}}>Conflicting versions</ThemeProvider>
3933
</Context.Provider>
4034
)
4135
expect(console.warn).toBeCalled()
@@ -104,20 +98,21 @@ describe('ThemeProvider', () => {
10498
cards: {
10599
default: {
106100
border: t => `1px solid ${t.colors.primary}`,
107-
}
108-
}
101+
},
102+
},
109103
}
110104
const json = renderJSON(
111-
jsx(ThemeProvider, { theme },
105+
jsx(
106+
ThemeProvider,
107+
{ theme },
112108
jsx('div', {
113109
sx: {
114110
variant: 'cards.default',
115-
}
111+
},
116112
})
117113
)
118114
)
119115
expect(json).toHaveStyleRule('border', '1px solid tomato')
120-
121116
})
122117
})
123118

@@ -151,13 +146,15 @@ describe('jsx', () => {
151146

152147
test('css prop accepts functions', () => {
153148
const json = renderJSON(
154-
jsx(ThemeProvider, {
155-
theme: {
156-
colors: {
157-
primary: 'tomato',
158-
}
159-
}
160-
},
149+
jsx(
150+
ThemeProvider,
151+
{
152+
theme: {
153+
colors: {
154+
primary: 'tomato',
155+
},
156+
},
157+
},
161158
jsx('div', {
162159
css: t => ({
163160
color: t.colors.primary,
@@ -338,7 +335,7 @@ describe('useThemeUI', () => {
338335
theme={{
339336
colors: {
340337
text: 'tomato',
341-
}
338+
},
342339
}}>
343340
<GetContext />
344341
</ThemeProvider>
@@ -347,4 +344,3 @@ describe('useThemeUI', () => {
347344
expect(context.theme.colors.text).toBe('tomato')
348345
})
349346
})
350-

‎packages/docs/src/pages/guides/mdx-layout-components.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ As an example, create a new component with the `ThemeProvider` and a wrapping `<
1818
import { jsx, ThemeProvider } from 'theme-ui'
1919

2020
export default props => (
21-
<ThemeProvider>
21+
<ThemeProvider theme={{}}>
2222
<div {...props} />
2323
</ThemeProvider>
2424
)

‎packages/theme-ui/test/color-modes.js

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -84,7 +84,7 @@ test('useColorMode updates color mode state', () => {
8484
)
8585
}
8686
const tree = render(
87-
<ThemeProvider>
87+
<ThemeProvider theme={{}}>
8888
<Button />
8989
</ThemeProvider>
9090
)
@@ -170,7 +170,7 @@ test('uses default mode', () => {
170170
return <button children="test" />
171171
}
172172
const tree = render(
173-
<ThemeProvider>
173+
<ThemeProvider theme={{}}>
174174
<Button />
175175
</ThemeProvider>
176176
)
@@ -186,7 +186,7 @@ test('initializes mode based on localStorage', () => {
186186
return <button children="test" />
187187
}
188188
const tree = render(
189-
<ThemeProvider>
189+
<ThemeProvider theme={{}}>
190190
<Button />
191191
</ThemeProvider>
192192
)
@@ -228,7 +228,7 @@ test('retains initial context', () => {
228228
return false
229229
}
230230
render(
231-
<ThemeProvider>
231+
<ThemeProvider theme={{}}>
232232
<Consumer />
233233
</ThemeProvider>
234234
)
@@ -298,7 +298,7 @@ test('does not initialize mode from prefers-color-scheme media query when useCol
298298
return false
299299
}
300300
render(
301-
<ThemeProvider>
301+
<ThemeProvider theme={{}}>
302302
<Consumer />
303303
</ThemeProvider>
304304
)
@@ -494,7 +494,7 @@ test('warns when localStorage is disabled', () => {
494494
}
495495

496496
render(
497-
<ThemeProvider>
497+
<ThemeProvider theme={{}}>
498498
<Consumer />
499499
</ThemeProvider>
500500
)

‎packages/theme-ui/test/index.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ const renderJSON = el => renderer.create(el).toJSON()
2121

2222
test('renders', () => {
2323
const json = renderJSON(
24-
<ThemeProvider>
24+
<ThemeProvider theme={{}}>
2525
<h1>Hello</h1>
2626
</ThemeProvider>
2727
)
@@ -110,7 +110,7 @@ test('warns when multiple versions of emotion are installed', () => {
110110
value={{
111111
emotionVersion: '9.0.0',
112112
}}>
113-
<ThemeProvider>Conflicting versions</ThemeProvider>
113+
<ThemeProvider theme={{}}>Conflicting versions</ThemeProvider>
114114
</Context.Provider>
115115
)
116116
expect(console.warn).toBeCalled()

‎packages/theme-ui/test/node.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ test('does note initializes mode based on localStorage', () => {
1212
}
1313
expect(() => {
1414
renderToString(
15-
<ThemeProvider>
15+
<ThemeProvider theme={{}}>
1616
<Button />
1717
</ThemeProvider>
1818
)

0 commit comments

Comments
 (0)