|
1 | 1 | import * as React from 'react'
|
2 | 2 | import { shallow, mount } from 'enzyme'
|
| 3 | +import { Value } from 'react-powerplug' |
3 | 4 |
|
4 | 5 | import { adopt } from './'
|
5 | 6 |
|
6 | 7 | test('return one component with children props as function', () => {
|
7 |
| - const Foo = ({ children }) => |
8 |
| - children && typeof children === 'function' && children('foo') |
9 |
| - |
10 | 8 | interface RenderProps {
|
11 |
| - foo: string |
| 9 | + foo: { value: string } |
12 | 10 | }
|
13 | 11 |
|
14 | 12 | const Composed = adopt<RenderProps>({
|
15 |
| - foo: <Foo />, |
| 13 | + foo: <Value initial="foo" />, |
16 | 14 | })
|
17 | 15 |
|
18 |
| - const result = mount(<Composed>{props => <div>{props.foo}</div>}</Composed>) |
| 16 | + const result = mount( |
| 17 | + <Composed>{({ foo }) => <div>{foo.value}</div>}</Composed> |
| 18 | + ) |
19 | 19 | const { children } = result.props()
|
20 | 20 |
|
21 | 21 | expect(children).toBeDefined()
|
22 | 22 | expect(typeof children).toBe('function')
|
23 | 23 | })
|
24 | 24 |
|
25 | 25 | test('rendering children component', () => {
|
26 |
| - const Foo = ({ children, tor }) => |
27 |
| - children && typeof children === 'function' && children(tor + 'foo') |
28 |
| - |
29 |
| - const Bar = ({ render, tor }) => |
30 |
| - render && typeof render === 'function' && render(tor + 'bar') |
31 |
| - |
32 | 26 | interface RenderProps {
|
33 |
| - foo: 'foo' |
34 |
| - bar: 'bar' |
| 27 | + foo: { value: string } |
| 28 | + bar: { value: string } |
35 | 29 | }
|
36 | 30 |
|
37 | 31 | interface Props {
|
38 | 32 | tor: string
|
39 | 33 | }
|
40 | 34 |
|
41 | 35 | const Composed = adopt<RenderProps, Props>({
|
42 |
| - bar: ({ tor, render }) => <Bar tor={tor} render={render} />, |
43 |
| - foo: ({ tor, render }) => <Foo tor={tor}>{render}</Foo>, |
| 36 | + foo: ({ tor, render }) => <Value initial={tor + 'foo'}>{render}</Value>, |
| 37 | + bar: ({ tor, render }) => <Value initial={tor + 'bar'}>{render}</Value>, |
44 | 38 | })
|
45 | 39 |
|
46 | 40 | const result = shallow(
|
47 | 41 | <Composed tor="tor">
|
48 |
| - {props => ( |
| 42 | + {({ foo, bar }) => ( |
49 | 43 | <div>
|
50 |
| - <div>{props.foo}</div> |
51 |
| - <div>{props.bar}</div> |
| 44 | + <div>{foo.value}</div> |
| 45 | + <div>{bar.value}</div> |
52 | 46 | </div>
|
53 | 47 | )}
|
54 | 48 | </Composed>
|
|
0 commit comments