1 |
|
2 |
|
3 |
|
4 |
|
5 | import trigger from '@f/trigger-event'
|
6 | import element from 'vdux/element'
|
7 | import vdux from 'vdux/dom'
|
8 | import Form from '../src'
|
9 | import test from 'tape'
|
10 |
|
11 |
|
12 |
|
13 |
|
14 |
|
15 | test('should work', t => {
|
16 | const {render, subscribe} = vdux()
|
17 | let node
|
18 |
|
19 | const stop = subscribe(() => {})
|
20 | node = render(
|
21 | <Form onSubmit={() => t.pass()} validate={validate} cast={cast}>
|
22 | <input name='username' value='test' />
|
23 | </Form>
|
24 | )
|
25 |
|
26 | t.plan(5)
|
27 | trigger(node, 'submit')
|
28 | t.end()
|
29 | stop()
|
30 |
|
31 | function cast (user) {
|
32 | t.equal(user.username, 'test')
|
33 | t.deepEqual(Object.keys(user), ['username'])
|
34 |
|
35 | return {
|
36 | name: user.username
|
37 | }
|
38 | }
|
39 |
|
40 | function validate (user) {
|
41 | t.equal(user.name, 'test')
|
42 | t.deepEqual(Object.keys(user), ['name'])
|
43 |
|
44 | return {
|
45 | valid: true
|
46 | }
|
47 | }
|
48 | })
|
49 |
|
50 | test('should invalidate fields', t => {
|
51 | const {subscribe, render} = vdux()
|
52 | let node
|
53 |
|
54 | const stop = subscribe(() => {})
|
55 | node = render(
|
56 | <Form onSubmit={() => t.fail()} validate={validate}>
|
57 | <input onInvalid={e => t.equal(e.target.validationMessage, 'username is invalid', 'validation message')} name='username' value='test' />
|
58 | </Form>
|
59 | )
|
60 |
|
61 | t.plan(1)
|
62 | trigger(node, 'submit')
|
63 | t.end()
|
64 | stop()
|
65 |
|
66 | function validate (user) {
|
67 | return {
|
68 | valid: false,
|
69 | errors: [
|
70 | {
|
71 | field: 'username',
|
72 | message: 'username is invalid'
|
73 | }
|
74 | ]
|
75 | }
|
76 | }
|
77 | })
|
78 |
|
79 | test('loading should block submits', t => {
|
80 | const {subscribe, render} = vdux()
|
81 | let node
|
82 | const stop = subscribe(() => {})
|
83 |
|
84 | node = render(<Form onSubmit={() => t.fail()} loading={true}></Form>)
|
85 | trigger(node, 'submit')
|
86 |
|
87 | t.end()
|
88 | stop()
|
89 | })
|