Skip to content

Commit 003e1a4

Browse files
committed
Karma test cleanup
1 parent e8024e4 commit 003e1a4

File tree

3 files changed

+69
-63
lines changed

3 files changed

+69
-63
lines changed

karma.conf.js

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -19,8 +19,6 @@ module.exports = function(config) {
1919
},
2020

2121
webpack: {
22-
cache: true,
23-
devtool: 'eval',
2422
module: {
2523
loaders: [
2624
{
@@ -51,6 +49,7 @@ module.exports = function(config) {
5149

5250
webpackServer: {
5351
stats: {
52+
chunks: false,
5453
colors: true
5554
}
5655
},
@@ -65,16 +64,22 @@ module.exports = function(config) {
6564

6665
autoWatch: false,
6766

68-
browsers: ['PhantomJS', 'Firefox', process.env.TRAVIS ? 'Chrome_travis_ci' : 'Chrome'],
67+
browsers: ['PhantomJS_custom', 'Firefox', process.env.TRAVIS ? 'Chrome_travis_ci' : 'Chrome'],
6968

7069
customLaunchers: {
7170
Chrome_travis_ci: {
7271
base: 'Chrome',
7372
flags: ['--no-sandbox']
73+
},
74+
PhantomJS_custom: {
75+
base: 'PhantomJS',
76+
options: {
77+
viewportSize: {width: 1024, height: 768}
78+
}
7479
}
7580
},
7681

77-
singleRun: false,
82+
singleRun: true,
7883

7984
plugins: [
8085
require('karma-jasmine'),

package.json

Lines changed: 28 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -27,45 +27,45 @@
2727
},
2828
"homepage": "https://github.com/mzabriskie/react-draggable",
2929
"devDependencies": {
30-
"babel-cli": "^6.5.1",
31-
"babel-core": "^6.5.1",
32-
"babel-eslint": "^6.0.2",
33-
"babel-loader": "^6.2.2",
34-
"babel-plugin-espower": "^2.1.2",
35-
"babel-plugin-transform-flow-comments": "^6.7.0",
36-
"babel-preset-es2015": "^6.5.0",
37-
"babel-preset-react": "^6.5.0",
30+
"babel-cli": "^6.10.1",
31+
"babel-core": "^6.10.4",
32+
"babel-eslint": "^6.1.2",
33+
"babel-loader": "^6.2.4",
34+
"babel-plugin-espower": "^2.3.1",
35+
"babel-plugin-transform-flow-comments": "^6.8.0",
36+
"babel-preset-es2015": "^6.9.0",
37+
"babel-preset-react": "^6.11.1",
3838
"babel-preset-stage-1": "^6.5.0",
39-
"eslint": "^2.7.0",
40-
"eslint-plugin-react": "^4.3.0",
39+
"eslint": "^3.1.1",
40+
"eslint-plugin-react": "^5.2.2",
4141
"jasmine-core": "^2.4.1",
4242
"json-loader": "^0.5.4",
43-
"karma": "^0.13.14",
44-
"karma-chrome-launcher": "^0.2.1",
45-
"karma-cli": "0.1.2",
46-
"karma-firefox-launcher": "^0.1.6",
47-
"karma-jasmine": "^0.3.6",
48-
"karma-phantomjs-launcher": "^1.0.0",
49-
"karma-phantomjs-shim": "^1.1.1",
43+
"karma": "^1.1.1",
44+
"karma-chrome-launcher": "^1.0.1",
45+
"karma-cli": "1.0.1",
46+
"karma-firefox-launcher": "^1.0.0",
47+
"karma-jasmine": "^1.0.2",
48+
"karma-phantomjs-launcher": "^1.0.1",
49+
"karma-phantomjs-shim": "^1.4.0",
5050
"karma-webpack": "^1.7.0",
51-
"lodash": "^4.11.1",
51+
"lodash": "^4.13.1",
5252
"open": "0.0.5",
53-
"phantomjs-prebuilt": ">=1.9",
53+
"phantomjs-prebuilt": ">=2.1",
5454
"power-assert": "^1.4.1",
55-
"pre-commit": "^1.1.2",
56-
"react": "^15.0.0",
57-
"react-dom": "^15.0.0",
58-
"semver": "^5.0.3",
59-
"static-server": "^2.0.0",
60-
"uglify-js": "^2.5.0",
61-
"webpack": "^1.12.2",
62-
"webpack-dev-server": "^1.12.1"
55+
"pre-commit": "^1.1.3",
56+
"react": "^15.2.1",
57+
"react-dom": "^15.2.1",
58+
"semver": "^5.3.0",
59+
"static-server": "^2.0.3",
60+
"uglify-js": "^2.7.0",
61+
"webpack": "^1.13.1",
62+
"webpack-dev-server": "^1.14.1"
6363
},
6464
"precommit": [
6565
"lint",
6666
"test"
6767
],
6868
"dependencies": {
69-
"classnames": "^2.2.0"
69+
"classnames": "^2.2.5"
7070
}
7171
}

specs/draggable.spec.jsx

Lines changed: 32 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ describe('react-draggable', function () {
5050
it('should pass style and className properly from child', function () {
5151
drag = (<Draggable><div className="foo" style={{color: 'black'}}/></Draggable>);
5252

53-
var node = renderToNode(drag);
53+
const node = renderToNode(drag);
5454
if ('touchAction' in document.body.style) {
5555
assert(node.getAttribute('style').indexOf('touch-action: none') >= 0);
5656
}
@@ -62,11 +62,11 @@ describe('react-draggable', function () {
6262
// NOTE: this runs a shallow renderer, which DOES NOT actually render <DraggableCore>
6363
it('should pass handle on to <DraggableCore>', function () {
6464
drag = <Draggable handle=".foo"><div /></Draggable>;
65-
var renderer = TestUtils.createRenderer();
65+
const renderer = TestUtils.createRenderer();
6666
renderer.render(drag);
67-
var output = renderer.getRenderOutput();
67+
const output = renderer.getRenderOutput();
6868

69-
var expected = (
69+
const expected = (
7070
<DraggableCore {...Draggable.defaultProps} handle=".foo">
7171
<div
7272
className="react-draggable"
@@ -78,7 +78,7 @@ describe('react-draggable', function () {
7878
);
7979

8080
// Not easy to actually test equality here. The functions are bound as static props so we can't test those easily.
81-
var toOmit = ['onStart', 'onStop', 'onDrag', 'onMouseDown', 'children'];
81+
const toOmit = ['onStart', 'onStop', 'onDrag', 'onMouseDown', 'children'];
8282
assert(_.isEqual(
8383
_.omit(output.props, toOmit),
8484
_.omit(expected.props, toOmit))
@@ -154,7 +154,7 @@ describe('react-draggable', function () {
154154
});
155155

156156
it('should call onStart when dragging begins', function () {
157-
var called = false;
157+
let called = false;
158158
drag = TestUtils.renderIntoDocument(
159159
<Draggable onStart={function () { called = true; }}>
160160
<div/>
@@ -166,7 +166,7 @@ describe('react-draggable', function () {
166166
});
167167

168168
it('should call onStop when dragging ends', function () {
169-
var called = false;
169+
let called = false;
170170
drag = TestUtils.renderIntoDocument(
171171
<Draggable onStop={function () { called = true; }}>
172172
<div/>
@@ -179,7 +179,7 @@ describe('react-draggable', function () {
179179
});
180180

181181
it('should not call onStart when dragging begins and disabled', function () {
182-
var called = false;
182+
let called = false;
183183
drag = TestUtils.renderIntoDocument(
184184
<Draggable onStart={function () { called = true; }} disabled={true}>
185185
<div/>
@@ -191,7 +191,7 @@ describe('react-draggable', function () {
191191
});
192192

193193
it('should immediately call onStop if onDrag returns false', function () {
194-
var called = false;
194+
let called = false;
195195
drag = TestUtils.renderIntoDocument(
196196
<Draggable onDrag={function () { return false; }} onStop={function () { called = true; }}>
197197
<div/>
@@ -207,65 +207,65 @@ describe('react-draggable', function () {
207207
});
208208

209209
it('should render with style translate() for DOM nodes', function () {
210-
var dragged = false;
210+
let dragged = false;
211211
drag = TestUtils.renderIntoDocument(
212212
<Draggable onDrag={function() { dragged = true; }}>
213213
<div />
214214
</Draggable>
215215
);
216216

217-
var node = ReactDOM.findDOMNode(drag);
217+
const node = ReactDOM.findDOMNode(drag);
218218
simulateMovementFromTo(drag, 0, 0, 100, 100);
219219

220-
var style = node.getAttribute('style');
220+
const style = node.getAttribute('style');
221221
assert(dragged === true);
222222
assert(style.indexOf('transform: translate(100px, 100px);') >= 0);
223223
});
224224

225225
it('should honor "x" axis', function () {
226-
var dragged = false;
226+
let dragged = false;
227227
drag = TestUtils.renderIntoDocument(
228228
<Draggable onDrag={function() { dragged = true; }} axis="x">
229229
<div />
230230
</Draggable>
231231
);
232232

233-
var node = ReactDOM.findDOMNode(drag);
233+
const node = ReactDOM.findDOMNode(drag);
234234
simulateMovementFromTo(drag, 0, 0, 100, 100);
235235

236-
var style = node.getAttribute('style');
236+
const style = node.getAttribute('style');
237237
assert(dragged === true);
238238
assert(style.indexOf('transform: translate(100px, 0px);') >= 0);
239239
});
240240

241241
it('should honor "y" axis', function () {
242-
var dragged = false;
242+
let dragged = false;
243243
drag = TestUtils.renderIntoDocument(
244244
<Draggable onDrag={function() { dragged = true; }} axis="y">
245245
<div />
246246
</Draggable>
247247
);
248248

249-
var node = ReactDOM.findDOMNode(drag);
249+
const node = ReactDOM.findDOMNode(drag);
250250
simulateMovementFromTo(drag, 0, 0, 100, 100);
251251

252-
var style = node.getAttribute('style');
252+
const style = node.getAttribute('style');
253253
assert(dragged === true);
254254
assert(style.indexOf('transform: translate(0px, 100px);') >= 0);
255255
});
256256

257257
it('should honor "none" axis', function () {
258-
var dragged = false;
258+
let dragged = false;
259259
drag = TestUtils.renderIntoDocument(
260260
<Draggable onDrag={function() { dragged = true; }} axis="none">
261261
<div />
262262
</Draggable>
263263
);
264264

265-
var node = ReactDOM.findDOMNode(drag);
265+
const node = ReactDOM.findDOMNode(drag);
266266
simulateMovementFromTo(drag, 0, 0, 100, 100);
267267

268-
var style = node.getAttribute('style');
268+
const style = node.getAttribute('style');
269269
assert(dragged === true);
270270
assert(style.indexOf('transform: translate(0px, 0px);') >= 0);
271271
});
@@ -297,23 +297,23 @@ describe('react-draggable', function () {
297297
</Draggable>
298298
);
299299

300-
var node = ReactDOM.findDOMNode(drag);
300+
const node = ReactDOM.findDOMNode(drag);
301301
simulateMovementFromTo(drag, 0, 0, 100, 100);
302302

303-
var transform = node.getAttribute('transform');
303+
const transform = node.getAttribute('transform');
304304
assert(transform.indexOf('translate(100,100)') >= 0);
305305
});
306306

307307
it('should add and remove user-select styles', function () {
308-
var userSelectStyleStr = `;${userSelectStyle}: none;`;
308+
const userSelectStyleStr = `;${userSelectStyle}: none;`;
309309

310310
drag = TestUtils.renderIntoDocument(
311311
<Draggable>
312312
<div />
313313
</Draggable>
314314
);
315315

316-
var node = ReactDOM.findDOMNode(drag);
316+
const node = ReactDOM.findDOMNode(drag);
317317

318318
assert(document.body.getAttribute('style') === '');
319319
TestUtils.Simulate.mouseDown(node, {clientX: 0, clientY: 0});
@@ -330,7 +330,7 @@ describe('react-draggable', function () {
330330
</Draggable>
331331
);
332332

333-
var node = ReactDOM.findDOMNode(drag);
333+
const node = ReactDOM.findDOMNode(drag);
334334

335335
assert(document.body.getAttribute('style') === '');
336336
TestUtils.Simulate.mouseDown(node, {clientX: 0, clientY: 0});
@@ -348,7 +348,7 @@ describe('react-draggable', function () {
348348
</Draggable>
349349
);
350350

351-
var node = ReactDOM.findDOMNode(drag);
351+
const node = ReactDOM.findDOMNode(drag);
352352

353353
assert(document.body.getAttribute('style') === '');
354354
TestUtils.Simulate.mouseDown(node, {clientX: 0, clientY: 0});
@@ -524,6 +524,7 @@ describe('react-draggable', function () {
524524
document.body.removeChild(fragment);
525525
done();
526526
}, 50);
527+
});
527528
});
528529

529530
describe('draggable callbacks', function () {
@@ -586,7 +587,7 @@ describe('react-draggable', function () {
586587
it('should result with invariant when there isn\'t a child', function () {
587588
drag = (<Draggable/>);
588589

589-
var error = false;
590+
let error = false;
590591
try {
591592
TestUtils.renderIntoDocument(drag);
592593
} catch (e) {
@@ -599,7 +600,7 @@ describe('react-draggable', function () {
599600
it('should result with invariant if there\'s more than a single child', function () {
600601
drag = (<Draggable><div/><div/></Draggable>);
601602

602-
var error = false;
603+
let error = false;
603604
try {
604605
TestUtils.renderIntoDocument(drag);
605606
} catch (e) {
@@ -624,7 +625,7 @@ function renderToNode(component) {
624625
// Would love to new MouseEvent() here but it doesn't work with PhantomJS / old browsers.
625626
// var e = new MouseEvent('mousemove', {clientX: 100, clientY: 100});
626627
function mouseMove(x, y) {
627-
var evt = document.createEvent('MouseEvents');
628+
const evt = document.createEvent('MouseEvents');
628629
evt.initMouseEvent('mousemove', true, true, window,
629630
0, 0, 0, x, y, false, false, false, false, 0, null);
630631
document.dispatchEvent(evt);
@@ -633,7 +634,7 @@ function mouseMove(x, y) {
633634

634635

635636
function simulateMovementFromTo(drag, fromX, fromY, toX, toY) {
636-
var node = ReactDOM.findDOMNode(drag);
637+
const node = ReactDOM.findDOMNode(drag);
637638

638639
TestUtils.Simulate.mouseDown(node, {clientX: fromX, clientY: fromX});
639640
mouseMove(toX, toY);

0 commit comments

Comments
 (0)