-
Notifications
You must be signed in to change notification settings - Fork 671
/
ssr.tsx
80 lines (71 loc) · 2.1 KB
/
ssr.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
/**
* @jest-environment node
* @jsx jsx
*/
import { jsx, ThemeProvider } from 'theme-ui'
import { Fragment } from 'react'
import ReactDOMServer from 'react-dom/server'
import { useResponsiveValue, useBreakpointIndex } from '../src'
test("falls back to user's default index", () => {
const Component = () => {
const value = useResponsiveValue(['a', 'b'], { defaultIndex: 1 })
const index = useBreakpointIndex({ defaultIndex: 2 })
return (
<Fragment>
{value} {index}
</Fragment>
)
}
const root = ReactDOMServer.renderToStaticMarkup(<Component />)
expect(root).toEqual('b 2')
})
test('defaults to first breakpoint without user input', () => {
let value
let index
const Component = () => {
value = useResponsiveValue(['a', 'b'])
index = useBreakpointIndex()
return null
}
ReactDOMServer.renderToStaticMarkup(<Component />)
expect(value).toEqual('a')
expect(index).toEqual(0)
})
test('requires default index be in range', () => {
const Component = () => {
const value = useResponsiveValue(['a', 'b'], { defaultIndex: 4 })
const index = useBreakpointIndex({ defaultIndex: 4 })
return (
<Fragment>
{value} {index}
</Fragment>
)
}
const Example = () =>
ReactDOMServer.renderToStaticMarkup(
<ThemeProvider
theme={{
breakpoints: ['30em', '45em', '55em'],
}}
>
<Component />
</ThemeProvider>
)
expect(Example).toThrowError(RangeError)
})
test('requires default index be a number', () => {
const Component = ({ index }: { index: number }) => {
const value = useResponsiveValue(['a', 'b'], { defaultIndex: index })
const themeIndex = useBreakpointIndex({ defaultIndex: index })
return (
<Fragment>
{value} {themeIndex}
</Fragment>
)
}
const createRender = (defaultIndex: any) => () =>
ReactDOMServer.renderToStaticMarkup(<Component index={defaultIndex} />)
expect(createRender(() => 2)).toThrowError(TypeError)
expect(createRender('2')).toThrowError(TypeError)
expect(createRender({ index: 2 })).toThrowError(TypeError)
})