/
UncontrolledCarousel.spec.js
147 lines (129 loc) · 5.29 KB
/
UncontrolledCarousel.spec.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
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
import React from 'react';
import { shallow } from 'enzyme';
import { Carousel, UncontrolledCarousel } from '../';
const items = [
{ src: '', altText: 'a', caption: 'caption 1', key: '1' },
{ src: '', altText: 'b', caption: 'caption 2', key: '2' },
{ src: '', altText: 'c', caption: 'caption 3', key: '3' }
];
describe('UncontrolledCarousel', () => {
it('should be an Carousel', () => {
const carousel = shallow(<UncontrolledCarousel items={items} />);
expect(carousel.type()).toBe(Carousel);
});
it('should have activeIndex default to 0', () => {
const carousel = shallow(<UncontrolledCarousel items={items} />);
expect(carousel.prop('activeIndex')).toBe(0);
});
it('should have next function', () => {
const carousel = shallow(<UncontrolledCarousel items={items} />);
expect(carousel.prop('next')).toEqual(expect.any(Function));
});
it('should have prev function', () => {
const carousel = shallow(<UncontrolledCarousel items={items} />);
expect(carousel.prop('previous')).toEqual(expect.any(Function));
});
it('should have ride set to "carousel" by default', () => {
const carousel = shallow(<UncontrolledCarousel items={items} />);
expect(carousel.prop('ride')).toBe('carousel');
});
it('should have ride set to undefined when autoPlay is false', () => {
const carousel = shallow(<UncontrolledCarousel items={items} autoPlay={false} />);
expect(carousel.prop('ride')).toBe(undefined);
});
it('should have ride set to "carousel" when autoPlay is true', () => {
const carousel = shallow(<UncontrolledCarousel items={items} autoPlay />);
expect(carousel.prop('ride')).toBe('carousel');
});
it('should increase the activeIndex when next is called', () => {
const carousel = shallow(<UncontrolledCarousel items={items} />);
const instance = carousel.instance();
instance.next();
carousel.update();
expect(carousel.prop('activeIndex')).toBe(1);
});
it('should not increase the activeIndex when next is called while animating', () => {
const carousel = shallow(<UncontrolledCarousel items={items} />);
const instance = carousel.instance();
instance.animating = true;
instance.next();
expect(carousel.prop('activeIndex')).toBe(0);
});
it('should wrap the activeIndex when next is called on the last item', () => {
const carousel = shallow(<UncontrolledCarousel items={items} />);
const instance = carousel.instance();
instance.next();
carousel.update();
expect(carousel.prop('activeIndex')).toBe(1);
instance.next();
carousel.update();
expect(carousel.prop('activeIndex')).toBe(2);
instance.next();
carousel.update();
expect(carousel.prop('activeIndex')).toBe(0);
instance.next();
carousel.update();
expect(carousel.prop('activeIndex')).toBe(1);
});
it('should decrease the activeIndex when previous is called', () => {
const carousel = shallow(<UncontrolledCarousel items={items} />);
const instance = carousel.instance();
instance.next();
carousel.update();
expect(carousel.prop('activeIndex')).toBe(1);
instance.previous();
carousel.update();
expect(carousel.prop('activeIndex')).toBe(0);
});
it('should not decrease the activeIndex when previous is called while animating', () => {
const carousel = shallow(<UncontrolledCarousel items={items} />);
const instance = carousel.instance();
instance.next();
carousel.update();
expect(carousel.prop('activeIndex')).toBe(1);
instance.animating = true;
instance.previous();
carousel.update();
expect(carousel.prop('activeIndex')).toBe(1);
});
it('should wrap the activeIndex when previous is called on the first item', () => {
const carousel = shallow(<UncontrolledCarousel items={items} />);
const instance = carousel.instance();
instance.previous();
carousel.update();
expect(carousel.prop('activeIndex')).toBe(2);
});
it('should set the activeIndex when goToIndex is called with a value', () => {
const carousel = shallow(<UncontrolledCarousel items={items} />);
const instance = carousel.instance();
instance.goToIndex(2);
carousel.update();
expect(carousel.prop('activeIndex')).toBe(2);
});
it('should not set the activeIndex when goToIndex is called with a value when animating', () => {
const carousel = shallow(<UncontrolledCarousel items={items} />);
const instance = carousel.instance();
instance.animating = true;
instance.goToIndex(2);
carousel.update();
expect(carousel.prop('activeIndex')).toBe(0);
});
it('should track animating of the slides', () => {
const carousel = shallow(<UncontrolledCarousel items={items} />);
const instance = carousel.instance();
expect(instance.animating).toBe(false);
instance.onExiting();
expect(instance.animating).toBe(true);
instance.onExited();
expect(instance.animating).toBe(false);
});
it('should render carousel items with provided key', () => {
const carousel = shallow(<UncontrolledCarousel items={items} indicators={false} />);
const carouselItem1 = carousel.childAt(0);
const carouselItem2 = carousel.childAt(1);
const carouselItem3 = carousel.childAt(2);
expect(carouselItem1.key()).toBe('1');
expect(carouselItem2.key()).toBe('2');
expect(carouselItem3.key()).toBe('3');
});
});