Skip to content

Commit 22bcdd4

Browse files
committed
more tests
1 parent 1f115d4 commit 22bcdd4

File tree

5 files changed

+186
-48
lines changed

5 files changed

+186
-48
lines changed

tests/Scrollbar.spec.js

Lines changed: 0 additions & 48 deletions
This file was deleted.

tests/Scrollbars/index.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import rendering from "./rendering";
2+
3+
export default function createTests(scrollbarWidth) {
4+
rendering(scrollbarWidth);
5+
}

tests/Scrollbars/rendering.js

Lines changed: 175 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,175 @@
1+
import React from 'react';
2+
import { findDOMNode, render, unmountComponentAtNode } from 'react-dom';
3+
import { Scrollbar } from "react-scrollbars-custom";
4+
5+
export default function createTests(scrollbarWidth) {
6+
describe('rendering', () => {
7+
let node;
8+
beforeEach(() => {
9+
node = document.createElement('div');
10+
document.body.appendChild(node);
11+
});
12+
afterEach(() => {
13+
unmountComponentAtNode(node);
14+
document.body.removeChild(node);
15+
});
16+
17+
describe("when <Scrollbar /> is rendered", function () {
18+
it('renders content wrapper', (done) => {
19+
render(<Scrollbar />, node, function () {
20+
expect(this.wrapper).to.be.an.instanceof(Node);
21+
22+
done();
23+
});
24+
});
25+
it('renders content', (done) => {
26+
render(<Scrollbar />, node, function () {
27+
expect(this.content).to.be.an.instanceof(Node);
28+
29+
done();
30+
});
31+
});
32+
it('content should have an absolute positioning', (done) => {
33+
render(<Scrollbar />, node, function () {
34+
expect(this.content.style.position).to.be.equal('absolute');
35+
expect(this.content.style.top).to.be.equal('0px');
36+
expect(this.content.style.left).to.be.equal('0px');
37+
expect(this.content.style.right).to.be.equal('0px');
38+
expect(this.content.style.bottom).to.be.equal('0px');
39+
40+
done();
41+
});
42+
});
43+
it('renders tracks', (done) => {
44+
render(<Scrollbar />, node, function () {
45+
expect(this.trackVertical).to.be.an.instanceof(Node);
46+
expect(this.trackHorizontal).to.be.an.instanceof(Node);
47+
48+
done();
49+
});
50+
});
51+
it('renders thumbs', (done) => {
52+
render(<Scrollbar />, node, function () {
53+
expect(this.thumbVertical).to.be.an.instanceof(Node);
54+
expect(this.thumbHorizontal).to.be.an.instanceof(Node);
55+
56+
done();
57+
});
58+
});
59+
it('renders thumbs with proper size', (done) => {
60+
render(<Scrollbar style={ {width: 100, height: 100} }>
61+
<div style={ {width: 200, height: 200} }></div>
62+
</Scrollbar>,
63+
node,
64+
function () {
65+
setTimeout(() => {
66+
// 92 / 200 * 92 = 42.32
67+
expect(this.thumbVertical.style.height).to.be.equal('43px');
68+
expect(this.thumbHorizontal.style.width).to.be.equal('43px');
69+
70+
done();
71+
}, 50);
72+
});
73+
});
74+
it('thumbs size should not be less than `thumbSizeMin`', (done) => {
75+
render(<Scrollbar style={ {width: 100, height: 100} } thumbSizeMin={ 50 }>
76+
<div style={ {width: 2000, height: 2000} }></div>
77+
</Scrollbar>,
78+
node,
79+
function () {
80+
setTimeout(() => {
81+
expect(this.thumbVertical.style.height).to.be.equal('50px');
82+
expect(this.thumbHorizontal.style.width).to.be.equal('50px');
83+
84+
done();
85+
}, 50);
86+
});
87+
});
88+
});
89+
90+
describe('when using custom tagName', () => {
91+
it('should use it', (done) => {
92+
render(<Scrollbar tagName="label" />,
93+
node,
94+
function () {
95+
expect(findDOMNode(this).tagName.toLowerCase()).to.be.equal('label');
96+
97+
done();
98+
});
99+
});
100+
});
101+
102+
describe('when using custom style', () => {
103+
it('should use it except the default styles', (done) => {
104+
render(<Scrollbar style={ {maxWidth: '100%'} } />,
105+
node,
106+
function () {
107+
expect(findDOMNode(this).style.maxWidth).to.be.equal('100%');
108+
expect(findDOMNode(this).style.display).to.be.equal('grid');
109+
110+
done();
111+
});
112+
});
113+
});
114+
115+
describe('when content does not overflow wrapper', () => {
116+
it('tracks should be hidden', (done) => {
117+
render(<Scrollbar style={ {width: 100, height: 100} }>
118+
<div style={ {width: 50, height: 50} }></div>
119+
</Scrollbar>,
120+
node,
121+
function () {
122+
setTimeout(() => {
123+
expect(this.trackVertical.style.display).to.be.equal('none');
124+
expect(this.trackHorizontal.style.display).to.be.equal('none');
125+
126+
done();
127+
}, 50);
128+
});
129+
});
130+
131+
it('except situation when `permanentScrollbars={true}`', (done) => {
132+
render(<Scrollbar style={ {width: 100, height: 100} } permanentScrollbars={ true }>
133+
<div style={ {width: 50, height: 50} }></div>
134+
</Scrollbar>,
135+
node,
136+
function () {
137+
setTimeout(() => {
138+
expect(this.trackVertical.style.display).to.not.be.equal('none');
139+
expect(this.trackHorizontal.style.display).to.not.be.equal('none');
140+
141+
done();
142+
}, 50);
143+
});
144+
});
145+
146+
it('or `permanentScrollbarVertical={true}`', (done) => {
147+
render(<Scrollbar style={ {width: 100, height: 100} } permanentScrollbarVertical={ true }>
148+
<div style={ {width: 50, height: 50} }></div>
149+
</Scrollbar>,
150+
node,
151+
function () {
152+
setTimeout(() => {
153+
expect(this.trackVertical.style.display).to.not.be.equal('none');
154+
155+
done();
156+
}, 50);
157+
});
158+
});
159+
160+
it('or `permanentScrollbarHorizontal={true}`', (done) => {
161+
render(<Scrollbar style={ {width: 100, height: 100} } permanentScrollbarHorizontal={ true }>
162+
<div style={ {width: 50, height: 50} }></div>
163+
</Scrollbar>,
164+
node,
165+
function () {
166+
setTimeout(() => {
167+
expect(this.trackHorizontal.style.display).to.not.be.equal('none');
168+
169+
done();
170+
}, 50);
171+
});
172+
});
173+
});
174+
});
175+
}

tests/browser.spec.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import {getScrollbarWidth} from "./../src/util/utilities";
2+
import createTests from "./Scrollbars";
3+
4+
describe("on desktop browser", ()=>{
5+
createTests(getScrollbarWidth());
6+
});

tests/mobile.spec.js

Whitespace-only changes.

0 commit comments

Comments
 (0)