All files / tabs/__tests__ Tabs-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
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
 
 
1x
1x
1x
1x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1x
1x
1x
1x
 
 
1x
1x
 
 
 
 
 
 
 
 
 
6x
 
 
 
1x
 
 
1x
 
 
 
1x
 
 
 
1x
 
 
 
1x
 
 
 
1x
 
 
 
1x
 
 
 
 
/* global describe, xit, it */
 
import assert from 'assert'
import React from 'react'
import Tabs from '../'
import {mount} from 'enzyme'
 
/**
 * Create parent component and include button.
 */
// class App extends React.Component {
//   render () {
//     var tabs = [
//       {href: '/one', text: 'one'},
//       {href: '/two', text: 'two'},
//       {href: '/three', text: 'three'}
//     ]
//     return (
//       <div>
//         <header>
//           <Tabs tabs={tabs} />
//         </header>
//         <div className='content'>
//           {this.props.children}
//         </div>
//       </div>
//     )
//   }
// }
// /**
//  * Tab One content
//  */
// class One extends React.Component {
//   render () {
//     return (
//       <div>
//         One
//       </div>
//     )
//   }
// }
// /**
//  * Tab Two content
//  */
// class Two extends React.Component {
//   render () {
//     return (
//       <div>
//         Two
//       </div>
//     )
//   }
// }
// /**
//  * Tab Three content
//  */
// class Three extends React.Component {
//   render () {
//     return (
//       <div>
//         Three
//       </div>
//     )
//   }
// }
 
/**
 * Define routes
 */
// var routes = (
//   <Router history={hashHistory}>
//     <Route path='/' component={App}>
//       <Route path='/one' component={One} />
//       <Route path='/two' component={Two} />
//       <Route path='/three' component={Three} />
//     </Route>
//   </Router>
// )
 
describe('Tabs', () => {
  it('should work', () => {
    const wrapper = mount(<Tabs />)
    assert.equal(wrapper.find('.Tabs').length, 1)
  })
 
  it('should make the first tab active by default', () => {
    const wrapper = mount(<Tabs tabs={[{href: '/one', text: 'one'}, {href: '/two', text: 'two'}]} />, {
      context: {
        router: {
          push: () => {},
          replace: () => {},
          go: () => {},
          goBack: () => {},
          goForward: () => {},
          setRouteLeaveHook: () => {},
          createHref: () => {},
          isActive: (link) => link === '/one'
        }
      }
    })
    assert(wrapper.find('.Tabs-Item').at(0).hasClass('active'))
  })
 
  xit('should render given tabs', () => {
 
  })
 
  xit('should change the url on tab click', () => {
 
  })
 
  xit('should change the content on tab click', () => {
 
  })
 
  xit('should move the inkbar on tab click', () => {
 
  })
 
  xit('should highlight the currently active tab', () => {
 
  })
 
  xit('should render the inkbar at the right position on initial rendering', () => {
 
  })
})