Skip to content

Commit b934731

Browse files
gtarnopolskigtarnopolski
committed
added tests
1 parent c90f3bc commit b934731

File tree

9 files changed

+11090
-154
lines changed

9 files changed

+11090
-154
lines changed

‎.env

+1
Original file line numberDiff line numberDiff line change
@@ -1 +1,2 @@
11
NODE_PATH=src/
2+
SKIP_PREFLIGHT_CHECK=true

‎package.json

+13-3
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,8 @@
66
"scripts": {
77
"build": "del -rf ./dist && yarn tsc",
88
"tsc": "node_modules/typescript/bin/tsc",
9-
"tsc:watch": "node_modules/typescript/bin/tsc --watch"
9+
"tsc:watch": "node_modules/typescript/bin/tsc --watch",
10+
"test": "react-scripts-ts test --env=jsdom"
1011
},
1112
"typings": "index.d.ts",
1213
"repository": {
@@ -27,11 +28,20 @@
2728
},
2829
"homepage": "https://github.com/codegateinc/react-smart-slider#readme",
2930
"devDependencies": {
30-
"@types/jest": "^24.0.13",
31+
"@types/enzyme": "3.1.15",
32+
"@types/enzyme-adapter-react-16": "1.0.3",
33+
"@types/jest": "24.0.13",
3134
"@types/react": "16.8.17",
3235
"@types/react-dom": "16.8.4",
33-
"@types/styled-components": "^4.1.16",
36+
"@types/styled-components": "4.1.16",
37+
"enzyme": "3.9.0",
38+
"enzyme-adapter-react-16": "1.9.1",
39+
"react-scripts-ts": "4.0.8",
40+
"jsdom": "15.1.0",
3441
"tslint": "5.17.0",
3542
"typescript": "3.4.5"
43+
},
44+
"dependencies": {
45+
"styled-components": "4.3.1"
3646
}
3747
}

‎src/lib/components/ReactSmartSlider.spec.tsx

+132
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,132 @@
1+
import React from 'react'
2+
import { shallow } from 'enzyme'
3+
import { colors } from 'styles'
4+
import {
5+
Wrapper,
6+
ReactSmartSlider,
7+
CustomScrollbar,
8+
ScrollCircle,
9+
SecondWrapper
10+
} from './ReactSmartSlider'
11+
12+
const mockConfig = (device: string) => ({
13+
value: device,
14+
configurable: true
15+
})
16+
const agent = 'userAgent'
17+
const initialProps = {
18+
cols: 6,
19+
spacing: 16,
20+
circleSize: 15,
21+
barHeight: 5,
22+
circleColor: colors.primary,
23+
barColor: colors.gray.mediumGray
24+
}
25+
26+
describe('ReactSmartSlider: lib/components', () => {
27+
it('should render itself', () => {
28+
const wrapper = shallow(<ReactSmartSlider {...initialProps}/>)
29+
30+
expect(wrapper.find(Wrapper).exists()).toEqual(true)
31+
expect(wrapper.find(SecondWrapper).exists()).toEqual(true)
32+
expect(wrapper.find(CustomScrollbar).exists()).toEqual(true)
33+
expect(wrapper.find(ScrollCircle).exists()).toEqual(true)
34+
})
35+
36+
it('should not render CustomScrollbar', () => {
37+
Object.defineProperty(window.navigator, agent, mockConfig('iPhone'))
38+
39+
const wrapper = shallow(<ReactSmartSlider {...initialProps}/>)
40+
41+
expect(wrapper.find(CustomScrollbar).exists()).toEqual(false)
42+
expect(wrapper.find(ScrollCircle).exists()).toEqual(false)
43+
})
44+
45+
it('should invoke onOverflowContentScroll onScroll', () => {
46+
const onOverflowContentScrollSpy = jest.spyOn(ReactSmartSlider.prototype, 'onOverflowContentScroll')
47+
const wrapper = shallow(<ReactSmartSlider {...initialProps}/>)
48+
49+
wrapper.find(SecondWrapper).simulate('scroll')
50+
51+
expect(onOverflowContentScrollSpy).toHaveBeenCalled()
52+
})
53+
54+
it('should invoke measureContainers onLoad', () => {
55+
const measureContainersSpy = jest.spyOn(ReactSmartSlider.prototype, 'measureContainers')
56+
const wrapper = shallow(<ReactSmartSlider {...initialProps}/>)
57+
58+
wrapper.find(SecondWrapper).simulate('load')
59+
60+
expect(measureContainersSpy).toHaveBeenCalled()
61+
})
62+
63+
it('should invoke addEventListener', () => {
64+
window.addEventListener = jest.fn()
65+
66+
shallow(<ReactSmartSlider {...initialProps}/>)
67+
68+
expect(window.addEventListener).toHaveBeenCalled()
69+
})
70+
71+
it('should invoke removeEventListener', () => {
72+
window.removeEventListener = jest.fn()
73+
74+
const wrapper = shallow(<ReactSmartSlider {...initialProps}/>)
75+
76+
wrapper.unmount()
77+
78+
expect(window.removeEventListener).toHaveBeenCalled()
79+
})
80+
81+
it('should invoke onMouseDown', () => {
82+
Object.defineProperty(window.navigator, agent, mockConfig('web'))
83+
84+
const onMouseDownSpy = jest.spyOn(ReactSmartSlider.prototype, 'onMouseDown')
85+
const wrapper = shallow(<ReactSmartSlider {...initialProps}/>)
86+
87+
const event = {
88+
preventDefault: jest.fn()
89+
}
90+
91+
wrapper.find(ScrollCircle).simulate('mousedown', event)
92+
93+
expect(onMouseDownSpy).toHaveBeenCalled()
94+
})
95+
96+
it('should render CustomScrollbar with props', () => {
97+
const wrapper = shallow(<ReactSmartSlider {...initialProps}/>)
98+
const bottom = (initialProps.circleSize - initialProps.barHeight) / 2
99+
const style = {
100+
height: initialProps.barHeight,
101+
color: initialProps.barColor,
102+
bottom
103+
}
104+
105+
expect(wrapper.find(CustomScrollbar).props().style).toEqual(style)
106+
})
107+
108+
it('should invoke onScrollbarClick after CustomScrollbar clicked', () => {
109+
ReactSmartSlider.prototype.onScrollbarClick = jest.fn()
110+
111+
const onScrollbarClickSpy = jest.spyOn(ReactSmartSlider.prototype, 'onScrollbarClick')
112+
const wrapper = shallow(<ReactSmartSlider {...initialProps}/>)
113+
const event = {
114+
clientX: 123
115+
} as React.MouseEvent
116+
117+
wrapper.find(CustomScrollbar).simulate('click', event)
118+
119+
expect(onScrollbarClickSpy).toHaveBeenCalled()
120+
})
121+
122+
it('should render ScrollCircle with props', () => {
123+
const wrapper = shallow(<ReactSmartSlider {...initialProps}/>)
124+
const style = {
125+
height: initialProps.circleSize,
126+
width: initialProps.circleSize,
127+
color: initialProps.circleColor
128+
}
129+
130+
expect(wrapper.find(ScrollCircle).props().style).toEqual(style)
131+
})
132+
})

‎src/setupTests.ts

+41
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
import { configure } from 'enzyme'
2+
import ReactSixteenAdapter from 'enzyme-adapter-react-16'
3+
import { Global } from 'types'
4+
5+
const { JSDOM } = require('jsdom')
6+
7+
const jsdom = new JSDOM('<!doctype html><html><body></body></html>')
8+
const { window } = jsdom
9+
10+
window.Object = Object
11+
window.Math = Math
12+
13+
declare var global: Global
14+
15+
global.window = window
16+
global.document = window.document
17+
global.navigator = {
18+
userAgent: 'node.js',
19+
}
20+
21+
function copyProps(src: Global, target: Global) {
22+
const props = Object.getOwnPropertyNames(src)
23+
.filter(prop => typeof target[prop] === 'undefined')
24+
.reduce((result, prop) => ({
25+
...result,
26+
[prop]: Object.getOwnPropertyDescriptor(src, prop),
27+
}), {})
28+
29+
Object.defineProperties(target, props)
30+
}
31+
32+
const matchMediaPolyfill = () => ({
33+
matches: false,
34+
addListener: () => {},
35+
removeListener: () => {}
36+
})
37+
38+
window.matchMedia = window.matchMedia || matchMediaPolyfill
39+
40+
copyProps(window, global)
41+
configure({ adapter: new ReactSixteenAdapter() })

‎src/types/common.ts

+8
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,11 @@
11
export type KeyValuePair = {
22
[key: string]: any // tslint:disable-line no-any
33
}
4+
5+
export interface Global extends NodeJS.Global {
6+
document: Document,
7+
window: Window,
8+
navigator: {
9+
userAgent: string
10+
}
11+
}

‎src/utils/deviceDetect.spec.ts

+47
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
import { isIOS, isAndroid, isMobile, isMsEdge } from './deviceDetect'
2+
3+
const mockConfig = (device: string) => ({
4+
value: device,
5+
configurable: true
6+
})
7+
const agent = 'userAgent'
8+
9+
describe('utils: deviceDetect', () => {
10+
it('should return corresponding values for Android device', () => {
11+
Object.defineProperty(window.navigator, agent, mockConfig('Android'))
12+
13+
expect(isIOS()).toEqual(false)
14+
expect(isAndroid()).toEqual(true)
15+
expect(isMobile()).toEqual(true)
16+
})
17+
18+
it('should return corresponding values for iOS device', () => {
19+
Object.defineProperty(window.navigator, agent, mockConfig('iPhone'))
20+
21+
expect(isIOS()).toEqual(true)
22+
expect(isAndroid()).toEqual(false)
23+
expect(isMobile()).toEqual(true)
24+
})
25+
26+
it('should return corresponding values for iPad', () => {
27+
Object.defineProperty(window.navigator, agent, mockConfig('iPad'))
28+
29+
expect(isIOS()).toEqual(true)
30+
expect(isAndroid()).toEqual(false)
31+
expect(isMobile()).toEqual(true)
32+
})
33+
34+
it('should return false for unmated platforms', () => {
35+
Object.defineProperty(window.navigator, agent, {value: ''})
36+
37+
expect(isIOS()).toEqual(false)
38+
expect(isAndroid()).toEqual(false)
39+
expect(isMobile()).toEqual(false)
40+
})
41+
42+
it('should return true for Edge browser', () => {
43+
Object.defineProperty(window.navigator, agent, mockConfig('Edge'))
44+
45+
expect(isMsEdge()).toEqual(true)
46+
})
47+
})

‎src/utils/helpers.spec.ts

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import { clearObject } from './helpers'
2+
3+
describe('utils: clearObject', () => {
4+
it('should return object without undefined fields', () => {
5+
const inputObject = {
6+
a: 'a',
7+
b: undefined,
8+
c: 3
9+
}
10+
const expectedObject = {
11+
a: 'a',
12+
c: 3
13+
}
14+
const undefinedObject = {
15+
a: undefined
16+
}
17+
18+
expect(clearObject(inputObject)).toEqual(expectedObject)
19+
expect(clearObject(undefinedObject)).toEqual({})
20+
})
21+
})

‎tsconfig.test.json

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
{
2+
"extends": "./tsconfig.json",
3+
"compilerOptions": {
4+
"module": "commonjs",
5+
"strictNullChecks": false
6+
}
7+
}

0 commit comments

Comments
 (0)