All files / textfield/__tests__ Textfield-test.js

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
 
 
1x
1x
1x
1x
 
1x
1x
1x
1x
 
 
1x
1x
1x
 
 
1x
1x
1x
 
 
1x
1x
1x
 
 
1x
1x
1x
 
 
1x
1x
1x
1x
 
1x
1x
 
 
 
 
 
 
1x
1x
1x
 
 
1x
1x
1x
 
 
1x
1x
1x
 
 
 
/* global it, describe */
 
import assert from 'assert'
import React from 'react'
import Textfield from '../'
import {mount} from 'enzyme'
 
describe('Textfield', () => {
  it('should be empty by default', () => {
    const wrapper = mount(<Textfield />)
    assert.equal(wrapper.find('.Textfield-input').node.value, '')
  })
 
  it('should be able to set a custom value', () => {
    const wrapper = mount(<Textfield value='my custom value' onChange={() => {}} />)
    assert.equal(wrapper.find('.Textfield-input').node.value, 'my custom value')
  })
 
  it('should be able to set a custom label', () => {
    const wrapper = mount(<Textfield label='my custom label' />)
    assert.equal(wrapper.find('label').text(), 'my custom label')
  })
 
  it('should be able to set to disabled', () => {
    const wrapper = mount(<Textfield disabled />)
    assert(wrapper.find('.Textfield-input').node.disabled)
  })
 
  it('should be able to set to readOnly', () => {
    const wrapper = mount(<Textfield readOnly />)
    assert(wrapper.find('.Textfield-input').node.readOnly)
  })
 
  it('should callback upon typing', (done) => {
    const callback = (event) => {
      assert.equal(event.target.value, 'hello world')
      done()
    }
    const wrapper = mount(<Textfield onChange={callback} />)
    wrapper.find('.Textfield-input').simulate('change', {
      target: {
        value: 'hello world'
      }
    })
  })
 
  it('should show an error message', () => {
    const wrapper = mount(<Textfield error='username or password incorrect' />)
    assert.equal(wrapper.find('.Textfield-error').text(), 'username or password incorrect')
  })
 
  it('should apply error styles', () => {
    const wrapper = mount(<Textfield error='username or password incorrect' />)
    assert(wrapper.find('.Textfield-input').hasClass('Textfield-input--error'))
  })
 
  it('should have the right type', () => {
    const wrapper = mount(<Textfield type='password' />)
    assert.equal(wrapper.find('.Textfield-input').node.type, 'password')
  })
})