@pyreon/rocketstyle 0.11.5 → 0.11.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +32 -32
- package/lib/index.d.ts +25 -6
- package/lib/index.js +122 -97
- package/package.json +25 -24
- package/src/__tests__/attrs.test.ts +49 -49
- package/src/__tests__/chaining.test.ts +27 -27
- package/src/__tests__/collection.test.ts +12 -12
- package/src/__tests__/compose.test.ts +10 -10
- package/src/__tests__/context.test.ts +65 -65
- package/src/__tests__/createLocalProvider.test.ts +53 -53
- package/src/__tests__/dimensions.test.ts +54 -54
- package/src/__tests__/e2e-styler.test.ts +142 -136
- package/src/__tests__/hooks.test.ts +41 -70
- package/src/__tests__/isRocketComponent.test.ts +11 -11
- package/src/__tests__/misc.test.ts +91 -91
- package/src/__tests__/providerConsumer.test.ts +54 -126
- package/src/__tests__/rocketstyleIntegration.test.ts +182 -255
- package/src/__tests__/themeUtils.test.ts +173 -173
- package/src/cache/index.ts +1 -1
- package/src/constants/booleanTags.ts +25 -25
- package/src/constants/defaultDimensions.ts +5 -5
- package/src/constants/index.ts +16 -16
- package/src/context/context.ts +13 -10
- package/src/context/createLocalProvider.ts +26 -13
- package/src/context/localContext.ts +2 -2
- package/src/hoc/index.ts +1 -1
- package/src/hoc/rocketstyleAttrsHoc.ts +26 -29
- package/src/hooks/index.ts +2 -2
- package/src/hooks/usePseudoState.ts +3 -3
- package/src/hooks/useTheme.ts +14 -17
- package/src/index.ts +32 -15
- package/src/init.ts +12 -12
- package/src/isRocketComponent.ts +2 -2
- package/src/rocketstyle.ts +125 -112
- package/src/types/attrs.ts +2 -2
- package/src/types/config.ts +4 -4
- package/src/types/configuration.ts +5 -5
- package/src/types/dimensions.ts +5 -5
- package/src/types/hoc.ts +1 -1
- package/src/types/rocketComponent.ts +4 -4
- package/src/types/rocketstyle.ts +10 -10
- package/src/types/styles.ts +9 -4
- package/src/types/theme.ts +4 -4
- package/src/types/utils.ts +1 -1
- package/src/utils/attrs.ts +2 -2
- package/src/utils/chaining.ts +2 -2
- package/src/utils/compose.ts +1 -1
- package/src/utils/dimensions.ts +6 -6
- package/src/utils/statics.ts +2 -2
- package/src/utils/styles.ts +2 -2
- package/src/utils/theme.ts +10 -10
|
@@ -1,25 +1,25 @@
|
|
|
1
|
-
import type { VNodeChild } from
|
|
2
|
-
import { useContext } from
|
|
3
|
-
import { Provider as CoreProvider } from
|
|
4
|
-
import Provider from
|
|
1
|
+
import type { VNodeChild } from '@pyreon/core'
|
|
2
|
+
import { useContext } from '@pyreon/core'
|
|
3
|
+
import { Provider as CoreProvider } from '@pyreon/ui-core'
|
|
4
|
+
import Provider from '../context/context'
|
|
5
5
|
|
|
6
6
|
// Mock @pyreon/core useContext to return controlled values
|
|
7
|
-
vi.mock(
|
|
8
|
-
const original = await importOriginal<typeof import(
|
|
7
|
+
vi.mock('@pyreon/core', async (importOriginal) => {
|
|
8
|
+
const original = await importOriginal<typeof import('@pyreon/core')>()
|
|
9
9
|
return {
|
|
10
10
|
...original,
|
|
11
|
-
useContext: vi.fn(() => ({})),
|
|
11
|
+
useContext: vi.fn(() => (() => ({}))),
|
|
12
12
|
}
|
|
13
13
|
})
|
|
14
14
|
|
|
15
15
|
// Mock @pyreon/ui-core Provider and context
|
|
16
|
-
vi.mock(
|
|
17
|
-
const original = await importOriginal<typeof import(
|
|
16
|
+
vi.mock('@pyreon/ui-core', async (importOriginal) => {
|
|
17
|
+
const original = await importOriginal<typeof import('@pyreon/ui-core')>()
|
|
18
18
|
return {
|
|
19
19
|
...original,
|
|
20
20
|
Provider: vi.fn(((props: Record<string, unknown>) => ({
|
|
21
|
-
type:
|
|
22
|
-
props: { ...props,
|
|
21
|
+
type: 'div',
|
|
22
|
+
props: { ...props, 'data-provider': 'core' },
|
|
23
23
|
children: props.children,
|
|
24
24
|
key: null,
|
|
25
25
|
})) as any),
|
|
@@ -33,97 +33,97 @@ const mockedCoreProvider = vi.mocked(CoreProvider)
|
|
|
33
33
|
beforeEach(() => {
|
|
34
34
|
vi.clearAllMocks()
|
|
35
35
|
// Default: empty context
|
|
36
|
-
mockedUseContext.mockReturnValue({} as any)
|
|
36
|
+
mockedUseContext.mockReturnValue((() => ({})) as any)
|
|
37
37
|
mockedCoreProvider.mockImplementation(((props: Record<string, unknown>) => ({
|
|
38
|
-
type:
|
|
39
|
-
props: { ...props,
|
|
38
|
+
type: 'div',
|
|
39
|
+
props: { ...props, 'data-provider': 'core' },
|
|
40
40
|
children: props.children as VNodeChild,
|
|
41
41
|
key: null,
|
|
42
42
|
})) as any)
|
|
43
43
|
})
|
|
44
44
|
|
|
45
|
-
describe(
|
|
46
|
-
it(
|
|
47
|
-
mockedUseContext.mockReturnValue({} as any)
|
|
45
|
+
describe('Provider (context)', () => {
|
|
46
|
+
it('uses MODE_DEFAULT (light) when no mode is provided', () => {
|
|
47
|
+
mockedUseContext.mockReturnValue((() => ({})) as any)
|
|
48
48
|
|
|
49
|
-
const children = { type:
|
|
49
|
+
const children = { type: 'span', props: {}, children: ['Hello'], key: null }
|
|
50
50
|
Provider({ children })
|
|
51
51
|
|
|
52
52
|
expect(mockedCoreProvider).toHaveBeenCalledTimes(1)
|
|
53
53
|
const callArgs = mockedCoreProvider.mock.calls[0]?.[0] as Record<string, unknown>
|
|
54
|
-
expect(callArgs.mode).toBe(
|
|
54
|
+
expect(callArgs.mode).toBe('light')
|
|
55
55
|
expect(callArgs.isLight).toBe(true)
|
|
56
56
|
expect(callArgs.isDark).toBe(false)
|
|
57
57
|
})
|
|
58
58
|
|
|
59
|
-
it(
|
|
60
|
-
mockedUseContext.mockReturnValue({ mode:
|
|
59
|
+
it('passes mode directly when inversed is false', () => {
|
|
60
|
+
mockedUseContext.mockReturnValue((() => ({ mode: 'dark' })) as any)
|
|
61
61
|
|
|
62
|
-
const children = { type:
|
|
63
|
-
Provider({ children, mode:
|
|
62
|
+
const children = { type: 'span', props: {}, children: ['Hello'], key: null }
|
|
63
|
+
Provider({ children, mode: 'dark', inversed: false })
|
|
64
64
|
|
|
65
65
|
const callArgs = mockedCoreProvider.mock.calls[0]?.[0] as Record<string, unknown>
|
|
66
|
-
expect(callArgs.mode).toBe(
|
|
66
|
+
expect(callArgs.mode).toBe('dark')
|
|
67
67
|
expect(callArgs.isDark).toBe(true)
|
|
68
68
|
expect(callArgs.isLight).toBe(false)
|
|
69
69
|
})
|
|
70
70
|
|
|
71
|
-
it(
|
|
72
|
-
const children = { type:
|
|
73
|
-
Provider({ children, mode:
|
|
71
|
+
it('passes mode directly when inversed is undefined', () => {
|
|
72
|
+
const children = { type: 'span', props: {}, children: ['Hello'], key: null }
|
|
73
|
+
Provider({ children, mode: 'dark' })
|
|
74
74
|
|
|
75
75
|
const callArgs = mockedCoreProvider.mock.calls[0]?.[0] as Record<string, unknown>
|
|
76
|
-
expect(callArgs.mode).toBe(
|
|
76
|
+
expect(callArgs.mode).toBe('dark')
|
|
77
77
|
expect(callArgs.isDark).toBe(true)
|
|
78
78
|
expect(callArgs.isLight).toBe(false)
|
|
79
79
|
})
|
|
80
80
|
|
|
81
|
-
it(
|
|
82
|
-
const children = { type:
|
|
83
|
-
Provider({ children, mode:
|
|
81
|
+
it('inverts light to dark when inversed is true', () => {
|
|
82
|
+
const children = { type: 'span', props: {}, children: ['Hello'], key: null }
|
|
83
|
+
Provider({ children, mode: 'light', inversed: true })
|
|
84
84
|
|
|
85
85
|
const callArgs = mockedCoreProvider.mock.calls[0]?.[0] as Record<string, unknown>
|
|
86
|
-
expect(callArgs.mode).toBe(
|
|
86
|
+
expect(callArgs.mode).toBe('dark')
|
|
87
87
|
expect(callArgs.isDark).toBe(true)
|
|
88
88
|
expect(callArgs.isLight).toBe(false)
|
|
89
89
|
})
|
|
90
90
|
|
|
91
|
-
it(
|
|
92
|
-
const children = { type:
|
|
93
|
-
Provider({ children, mode:
|
|
91
|
+
it('inverts dark to light when inversed is true', () => {
|
|
92
|
+
const children = { type: 'span', props: {}, children: ['Hello'], key: null }
|
|
93
|
+
Provider({ children, mode: 'dark', inversed: true })
|
|
94
94
|
|
|
95
95
|
const callArgs = mockedCoreProvider.mock.calls[0]?.[0] as Record<string, unknown>
|
|
96
|
-
expect(callArgs.mode).toBe(
|
|
96
|
+
expect(callArgs.mode).toBe('light')
|
|
97
97
|
expect(callArgs.isLight).toBe(true)
|
|
98
98
|
expect(callArgs.isDark).toBe(false)
|
|
99
99
|
})
|
|
100
100
|
|
|
101
|
-
it(
|
|
101
|
+
it('passes theme to provider when provided', () => {
|
|
102
102
|
const theme = { rootSize: 16, breakpoints: { sm: 576 } }
|
|
103
|
-
const children = { type:
|
|
103
|
+
const children = { type: 'span', props: {}, children: ['Hello'], key: null }
|
|
104
104
|
Provider({ children, theme })
|
|
105
105
|
|
|
106
106
|
const callArgs = mockedCoreProvider.mock.calls[0]?.[0] as Record<string, unknown>
|
|
107
107
|
expect(callArgs.theme).toEqual(theme)
|
|
108
108
|
})
|
|
109
109
|
|
|
110
|
-
it(
|
|
111
|
-
const children = { type:
|
|
110
|
+
it('does not pass theme key when theme is undefined', () => {
|
|
111
|
+
const children = { type: 'span', props: {}, children: ['Hello'], key: null }
|
|
112
112
|
Provider({ children })
|
|
113
113
|
|
|
114
114
|
const callArgs = mockedCoreProvider.mock.calls[0]?.[0] as Record<string, unknown>
|
|
115
|
-
expect(
|
|
115
|
+
expect('theme' in callArgs).toBe(false)
|
|
116
116
|
})
|
|
117
117
|
|
|
118
|
-
it(
|
|
118
|
+
it('uses custom provider when specified', () => {
|
|
119
119
|
const customProvider = vi.fn((props: Record<string, unknown>) => ({
|
|
120
|
-
type:
|
|
120
|
+
type: 'section',
|
|
121
121
|
props,
|
|
122
122
|
children: props.children as VNodeChild,
|
|
123
123
|
key: null,
|
|
124
124
|
}))
|
|
125
125
|
|
|
126
|
-
const children = { type:
|
|
126
|
+
const children = { type: 'span', props: {}, children: ['Hello'], key: null }
|
|
127
127
|
Provider({ children, provider: customProvider as any })
|
|
128
128
|
|
|
129
129
|
expect(customProvider).toHaveBeenCalledTimes(1)
|
|
@@ -131,70 +131,70 @@ describe("Provider (context)", () => {
|
|
|
131
131
|
expect(mockedCoreProvider).not.toHaveBeenCalled()
|
|
132
132
|
})
|
|
133
133
|
|
|
134
|
-
it(
|
|
135
|
-
const children = { type:
|
|
134
|
+
it('defaults to CoreProvider when no provider prop is given', () => {
|
|
135
|
+
const children = { type: 'span', props: {}, children: ['Hello'], key: null }
|
|
136
136
|
Provider({ children })
|
|
137
137
|
|
|
138
138
|
expect(mockedCoreProvider).toHaveBeenCalledTimes(1)
|
|
139
139
|
})
|
|
140
140
|
|
|
141
|
-
it(
|
|
142
|
-
const children = { type:
|
|
141
|
+
it('passes children through to the provider', () => {
|
|
142
|
+
const children = { type: 'span', props: {}, children: ['Hello World'], key: null }
|
|
143
143
|
Provider({ children })
|
|
144
144
|
|
|
145
145
|
const callArgs = mockedCoreProvider.mock.calls[0]?.[0] as Record<string, unknown>
|
|
146
146
|
expect(callArgs.children).toBe(children)
|
|
147
147
|
})
|
|
148
148
|
|
|
149
|
-
it(
|
|
150
|
-
const children = { type:
|
|
149
|
+
it('passes provider reference to the provider call', () => {
|
|
150
|
+
const children = { type: 'span', props: {}, children: ['Hello'], key: null }
|
|
151
151
|
Provider({ children })
|
|
152
152
|
|
|
153
153
|
const callArgs = mockedCoreProvider.mock.calls[0]?.[0] as Record<string, unknown>
|
|
154
154
|
expect(callArgs.provider).toBe(CoreProvider)
|
|
155
155
|
})
|
|
156
156
|
|
|
157
|
-
it(
|
|
157
|
+
it('returns null when provider returns null', () => {
|
|
158
158
|
mockedCoreProvider.mockReturnValue(null as any)
|
|
159
159
|
|
|
160
|
-
const children = { type:
|
|
160
|
+
const children = { type: 'span', props: {}, children: ['Hello'], key: null }
|
|
161
161
|
const result = Provider({ children })
|
|
162
162
|
|
|
163
163
|
expect(result).toBeNull()
|
|
164
164
|
})
|
|
165
165
|
|
|
166
|
-
it(
|
|
166
|
+
it('returns null when provider returns undefined', () => {
|
|
167
167
|
mockedCoreProvider.mockReturnValue(undefined as any)
|
|
168
168
|
|
|
169
|
-
const children = { type:
|
|
169
|
+
const children = { type: 'span', props: {}, children: ['Hello'], key: null }
|
|
170
170
|
const result = Provider({ children })
|
|
171
171
|
|
|
172
172
|
expect(result).toBeNull()
|
|
173
173
|
})
|
|
174
174
|
|
|
175
|
-
it(
|
|
176
|
-
mockedUseContext.mockReturnValue({
|
|
177
|
-
mode:
|
|
175
|
+
it('merges context values with incoming props (props take precedence)', () => {
|
|
176
|
+
mockedUseContext.mockReturnValue((() => ({
|
|
177
|
+
mode: 'light',
|
|
178
178
|
theme: { rootSize: 12 },
|
|
179
|
-
} as any)
|
|
179
|
+
})) as any)
|
|
180
180
|
|
|
181
181
|
const overrideTheme = { rootSize: 20 }
|
|
182
|
-
const children = { type:
|
|
183
|
-
Provider({ children, theme: overrideTheme, mode:
|
|
182
|
+
const children = { type: 'span', props: {}, children: ['Hello'], key: null }
|
|
183
|
+
Provider({ children, theme: overrideTheme, mode: 'dark' })
|
|
184
184
|
|
|
185
185
|
const callArgs = mockedCoreProvider.mock.calls[0]?.[0] as Record<string, unknown>
|
|
186
|
-
expect(callArgs.mode).toBe(
|
|
186
|
+
expect(callArgs.mode).toBe('dark')
|
|
187
187
|
expect(callArgs.theme).toEqual(overrideTheme)
|
|
188
188
|
})
|
|
189
189
|
|
|
190
|
-
it(
|
|
191
|
-
mockedUseContext.mockReturnValue({ mode:
|
|
190
|
+
it('uses context mode when no mode prop is given', () => {
|
|
191
|
+
mockedUseContext.mockReturnValue((() => ({ mode: 'dark' })) as any)
|
|
192
192
|
|
|
193
|
-
const children = { type:
|
|
193
|
+
const children = { type: 'span', props: {}, children: ['Hello'], key: null }
|
|
194
194
|
Provider({ children })
|
|
195
195
|
|
|
196
196
|
const callArgs = mockedCoreProvider.mock.calls[0]?.[0] as Record<string, unknown>
|
|
197
|
-
expect(callArgs.mode).toBe(
|
|
197
|
+
expect(callArgs.mode).toBe('dark')
|
|
198
198
|
expect(callArgs.isDark).toBe(true)
|
|
199
199
|
})
|
|
200
200
|
})
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { provide } from
|
|
2
|
-
import createLocalProvider from
|
|
1
|
+
import { provide } from '@pyreon/core'
|
|
2
|
+
import createLocalProvider from '../context/createLocalProvider'
|
|
3
3
|
|
|
4
4
|
// Mock @pyreon/core provide
|
|
5
|
-
vi.mock(
|
|
6
|
-
const original = await importOriginal<typeof import(
|
|
5
|
+
vi.mock('@pyreon/core', async (importOriginal) => {
|
|
6
|
+
const original = await importOriginal<typeof import('@pyreon/core')>()
|
|
7
7
|
return {
|
|
8
8
|
...original,
|
|
9
9
|
provide: vi.fn(),
|
|
@@ -18,31 +18,31 @@ beforeEach(() => {
|
|
|
18
18
|
|
|
19
19
|
/** Simple base component that returns its received props as a VNode for inspection. */
|
|
20
20
|
const BaseComponent: any = vi.fn((props: Record<string, unknown>) => ({
|
|
21
|
-
type:
|
|
21
|
+
type: 'div',
|
|
22
22
|
props,
|
|
23
23
|
children: props.children,
|
|
24
24
|
key: null,
|
|
25
25
|
}))
|
|
26
26
|
|
|
27
|
-
describe(
|
|
28
|
-
it(
|
|
27
|
+
describe('createLocalProvider', () => {
|
|
28
|
+
it('returns a component function', () => {
|
|
29
29
|
const HOC = createLocalProvider(BaseComponent)
|
|
30
|
-
expect(typeof HOC).toBe(
|
|
30
|
+
expect(typeof HOC).toBe('function')
|
|
31
31
|
})
|
|
32
32
|
|
|
33
|
-
it(
|
|
33
|
+
it('calls the wrapped component with forwarded props', () => {
|
|
34
34
|
const HOC = createLocalProvider(BaseComponent)
|
|
35
35
|
|
|
36
|
-
HOC({
|
|
36
|
+
HOC({ 'data-testid': 'test', title: 'Hello', children: 'Content' } as any)
|
|
37
37
|
|
|
38
38
|
expect(BaseComponent).toHaveBeenCalledTimes(1)
|
|
39
39
|
const callProps = BaseComponent.mock.calls[0]?.[0] as Record<string, unknown>
|
|
40
|
-
expect(callProps[
|
|
41
|
-
expect(callProps.title).toBe(
|
|
42
|
-
expect(callProps.children).toBe(
|
|
40
|
+
expect(callProps['data-testid']).toBe('test')
|
|
41
|
+
expect(callProps.title).toBe('Hello')
|
|
42
|
+
expect(callProps.children).toBe('Content')
|
|
43
43
|
})
|
|
44
44
|
|
|
45
|
-
it(
|
|
45
|
+
it('provides local context via provide()', () => {
|
|
46
46
|
const HOC = createLocalProvider(BaseComponent)
|
|
47
47
|
|
|
48
48
|
HOC({} as any)
|
|
@@ -50,7 +50,7 @@ describe("createLocalProvider", () => {
|
|
|
50
50
|
expect(mockedProvide).toHaveBeenCalledTimes(1)
|
|
51
51
|
})
|
|
52
52
|
|
|
53
|
-
it(
|
|
53
|
+
it('initial pseudo state is all false', () => {
|
|
54
54
|
const HOC = createLocalProvider(BaseComponent)
|
|
55
55
|
|
|
56
56
|
HOC({} as any)
|
|
@@ -64,24 +64,24 @@ describe("createLocalProvider", () => {
|
|
|
64
64
|
expect(pseudo.pressed).toBe(false)
|
|
65
65
|
})
|
|
66
66
|
|
|
67
|
-
it(
|
|
67
|
+
it('injects mouse and focus event handlers', () => {
|
|
68
68
|
const HOC = createLocalProvider(BaseComponent)
|
|
69
69
|
|
|
70
70
|
HOC({} as any)
|
|
71
71
|
|
|
72
72
|
const callProps = BaseComponent.mock.calls[0]?.[0] as Record<string, unknown>
|
|
73
|
-
expect(typeof callProps.onMouseEnter).toBe(
|
|
74
|
-
expect(typeof callProps.onMouseLeave).toBe(
|
|
75
|
-
expect(typeof callProps.onMouseDown).toBe(
|
|
76
|
-
expect(typeof callProps.onMouseUp).toBe(
|
|
77
|
-
expect(typeof callProps.onFocus).toBe(
|
|
78
|
-
expect(typeof callProps.onBlur).toBe(
|
|
73
|
+
expect(typeof callProps.onMouseEnter).toBe('function')
|
|
74
|
+
expect(typeof callProps.onMouseLeave).toBe('function')
|
|
75
|
+
expect(typeof callProps.onMouseDown).toBe('function')
|
|
76
|
+
expect(typeof callProps.onMouseUp).toBe('function')
|
|
77
|
+
expect(typeof callProps.onFocus).toBe('function')
|
|
78
|
+
expect(typeof callProps.onBlur).toBe('function')
|
|
79
79
|
})
|
|
80
80
|
|
|
81
|
-
it(
|
|
81
|
+
it('forwards original onMouseEnter handler', () => {
|
|
82
82
|
const HOC = createLocalProvider(BaseComponent)
|
|
83
83
|
const originalHandler = vi.fn()
|
|
84
|
-
const mockEvent = new MouseEvent(
|
|
84
|
+
const mockEvent = new MouseEvent('mouseenter')
|
|
85
85
|
|
|
86
86
|
HOC({ onMouseEnter: originalHandler } as any)
|
|
87
87
|
|
|
@@ -91,10 +91,10 @@ describe("createLocalProvider", () => {
|
|
|
91
91
|
expect(originalHandler).toHaveBeenCalledWith(mockEvent)
|
|
92
92
|
})
|
|
93
93
|
|
|
94
|
-
it(
|
|
94
|
+
it('forwards original onMouseLeave handler', () => {
|
|
95
95
|
const HOC = createLocalProvider(BaseComponent)
|
|
96
96
|
const originalHandler = vi.fn()
|
|
97
|
-
const mockEvent = new MouseEvent(
|
|
97
|
+
const mockEvent = new MouseEvent('mouseleave')
|
|
98
98
|
|
|
99
99
|
HOC({ onMouseLeave: originalHandler } as any)
|
|
100
100
|
|
|
@@ -104,10 +104,10 @@ describe("createLocalProvider", () => {
|
|
|
104
104
|
expect(originalHandler).toHaveBeenCalledWith(mockEvent)
|
|
105
105
|
})
|
|
106
106
|
|
|
107
|
-
it(
|
|
107
|
+
it('forwards original onMouseDown handler', () => {
|
|
108
108
|
const HOC = createLocalProvider(BaseComponent)
|
|
109
109
|
const originalHandler = vi.fn()
|
|
110
|
-
const mockEvent = new MouseEvent(
|
|
110
|
+
const mockEvent = new MouseEvent('mousedown')
|
|
111
111
|
|
|
112
112
|
HOC({ onMouseDown: originalHandler } as any)
|
|
113
113
|
|
|
@@ -117,10 +117,10 @@ describe("createLocalProvider", () => {
|
|
|
117
117
|
expect(originalHandler).toHaveBeenCalledWith(mockEvent)
|
|
118
118
|
})
|
|
119
119
|
|
|
120
|
-
it(
|
|
120
|
+
it('forwards original onMouseUp handler', () => {
|
|
121
121
|
const HOC = createLocalProvider(BaseComponent)
|
|
122
122
|
const originalHandler = vi.fn()
|
|
123
|
-
const mockEvent = new MouseEvent(
|
|
123
|
+
const mockEvent = new MouseEvent('mouseup')
|
|
124
124
|
|
|
125
125
|
HOC({ onMouseUp: originalHandler } as any)
|
|
126
126
|
|
|
@@ -130,10 +130,10 @@ describe("createLocalProvider", () => {
|
|
|
130
130
|
expect(originalHandler).toHaveBeenCalledWith(mockEvent)
|
|
131
131
|
})
|
|
132
132
|
|
|
133
|
-
it(
|
|
133
|
+
it('forwards original onFocus handler', () => {
|
|
134
134
|
const HOC = createLocalProvider(BaseComponent)
|
|
135
135
|
const originalHandler = vi.fn()
|
|
136
|
-
const mockEvent = new FocusEvent(
|
|
136
|
+
const mockEvent = new FocusEvent('focus')
|
|
137
137
|
|
|
138
138
|
HOC({ onFocus: originalHandler } as any)
|
|
139
139
|
|
|
@@ -143,10 +143,10 @@ describe("createLocalProvider", () => {
|
|
|
143
143
|
expect(originalHandler).toHaveBeenCalledWith(mockEvent)
|
|
144
144
|
})
|
|
145
145
|
|
|
146
|
-
it(
|
|
146
|
+
it('forwards original onBlur handler', () => {
|
|
147
147
|
const HOC = createLocalProvider(BaseComponent)
|
|
148
148
|
const originalHandler = vi.fn()
|
|
149
|
-
const mockEvent = new FocusEvent(
|
|
149
|
+
const mockEvent = new FocusEvent('blur')
|
|
150
150
|
|
|
151
151
|
HOC({ onBlur: originalHandler } as any)
|
|
152
152
|
|
|
@@ -156,7 +156,7 @@ describe("createLocalProvider", () => {
|
|
|
156
156
|
expect(originalHandler).toHaveBeenCalledWith(mockEvent)
|
|
157
157
|
})
|
|
158
158
|
|
|
159
|
-
it(
|
|
159
|
+
it('does not forward event handlers that were not provided', () => {
|
|
160
160
|
const HOC = createLocalProvider(BaseComponent)
|
|
161
161
|
|
|
162
162
|
HOC({} as any)
|
|
@@ -164,26 +164,26 @@ describe("createLocalProvider", () => {
|
|
|
164
164
|
const callProps = BaseComponent.mock.calls[0]?.[0] as Record<string, unknown>
|
|
165
165
|
// The HOC event handlers should not throw when no original handler exists
|
|
166
166
|
expect(() => {
|
|
167
|
-
;(callProps.onMouseEnter as (e: MouseEvent) => void)(new MouseEvent(
|
|
168
|
-
;(callProps.onMouseLeave as (e: MouseEvent) => void)(new MouseEvent(
|
|
169
|
-
;(callProps.onMouseDown as (e: MouseEvent) => void)(new MouseEvent(
|
|
170
|
-
;(callProps.onMouseUp as (e: MouseEvent) => void)(new MouseEvent(
|
|
171
|
-
;(callProps.onFocus as (e: FocusEvent) => void)(new FocusEvent(
|
|
172
|
-
;(callProps.onBlur as (e: FocusEvent) => void)(new FocusEvent(
|
|
167
|
+
;(callProps.onMouseEnter as (e: MouseEvent) => void)(new MouseEvent('mouseenter'))
|
|
168
|
+
;(callProps.onMouseLeave as (e: MouseEvent) => void)(new MouseEvent('mouseleave'))
|
|
169
|
+
;(callProps.onMouseDown as (e: MouseEvent) => void)(new MouseEvent('mousedown'))
|
|
170
|
+
;(callProps.onMouseUp as (e: MouseEvent) => void)(new MouseEvent('mouseup'))
|
|
171
|
+
;(callProps.onFocus as (e: FocusEvent) => void)(new FocusEvent('focus'))
|
|
172
|
+
;(callProps.onBlur as (e: FocusEvent) => void)(new FocusEvent('blur'))
|
|
173
173
|
}).not.toThrow()
|
|
174
174
|
})
|
|
175
175
|
|
|
176
|
-
it(
|
|
176
|
+
it('merges existing $rocketstate with pseudo state', () => {
|
|
177
177
|
const HOC = createLocalProvider(BaseComponent)
|
|
178
178
|
|
|
179
179
|
HOC({
|
|
180
|
-
$rocketstate: { someExisting:
|
|
180
|
+
$rocketstate: { someExisting: 'value', pseudo: { disabled: true } },
|
|
181
181
|
} as any)
|
|
182
182
|
|
|
183
183
|
const callProps = BaseComponent.mock.calls[0]?.[0] as Record<string, unknown>
|
|
184
184
|
const rocketstate = callProps.$rocketstate as Record<string, unknown>
|
|
185
185
|
|
|
186
|
-
expect(rocketstate.someExisting).toBe(
|
|
186
|
+
expect(rocketstate.someExisting).toBe('value')
|
|
187
187
|
const pseudo = rocketstate.pseudo as Record<string, unknown>
|
|
188
188
|
expect(pseudo.disabled).toBe(true)
|
|
189
189
|
expect(pseudo.hover).toBe(false)
|
|
@@ -191,7 +191,7 @@ describe("createLocalProvider", () => {
|
|
|
191
191
|
expect(pseudo.pressed).toBe(false)
|
|
192
192
|
})
|
|
193
193
|
|
|
194
|
-
it(
|
|
194
|
+
it('provides updated state to local context', () => {
|
|
195
195
|
const HOC = createLocalProvider(BaseComponent)
|
|
196
196
|
|
|
197
197
|
HOC({} as any)
|
|
@@ -204,20 +204,20 @@ describe("createLocalProvider", () => {
|
|
|
204
204
|
expect(pseudo.pressed).toBe(false)
|
|
205
205
|
})
|
|
206
206
|
|
|
207
|
-
it(
|
|
207
|
+
it('does not pass event handler props to wrapped component as original handler names', () => {
|
|
208
208
|
const HOC = createLocalProvider(BaseComponent)
|
|
209
209
|
const originalMouseEnter = vi.fn()
|
|
210
210
|
|
|
211
|
-
HOC({ onMouseEnter: originalMouseEnter, customProp:
|
|
211
|
+
HOC({ onMouseEnter: originalMouseEnter, customProp: 'keep' } as any)
|
|
212
212
|
|
|
213
213
|
const callProps = BaseComponent.mock.calls[0]?.[0] as Record<string, unknown>
|
|
214
214
|
// The wrapped component should receive the HOC event handlers, not the original ones
|
|
215
|
-
expect(callProps.customProp).toBe(
|
|
215
|
+
expect(callProps.customProp).toBe('keep')
|
|
216
216
|
// The onMouseEnter on the component should be the HOC wrapper, not the original
|
|
217
217
|
expect(callProps.onMouseEnter).not.toBe(originalMouseEnter)
|
|
218
218
|
})
|
|
219
219
|
|
|
220
|
-
it(
|
|
220
|
+
it('strips $rocketstate from forwarded props and passes updated version', () => {
|
|
221
221
|
const HOC = createLocalProvider(BaseComponent)
|
|
222
222
|
const originalState = { existing: true }
|
|
223
223
|
|
|
@@ -231,11 +231,11 @@ describe("createLocalProvider", () => {
|
|
|
231
231
|
expect(rocketstate.existing).toBe(true)
|
|
232
232
|
})
|
|
233
233
|
|
|
234
|
-
it(
|
|
234
|
+
it('returns the result of the wrapped component', () => {
|
|
235
235
|
const expectedResult = {
|
|
236
|
-
type:
|
|
237
|
-
props: {
|
|
238
|
-
children: [
|
|
236
|
+
type: 'div',
|
|
237
|
+
props: { 'data-result': 'yes' },
|
|
238
|
+
children: ['Result'],
|
|
239
239
|
key: null,
|
|
240
240
|
}
|
|
241
241
|
const MockComponent = vi.fn(() => expectedResult)
|