Skip to content

Commit 153c571

Browse files
mathieuancelinmathieuancelin
committed
Fix timeout issue with devtools in test
1 parent 11de408 commit 153c571

File tree

9 files changed

+322
-258
lines changed

9 files changed

+322
-258
lines changed

‎step-6-done/src/components/wine-app.js

+8-1
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,12 @@ import { GlobalStats } from './stats';
33
import { connect } from 'react-redux';
44
import { DevTools } from './devtools';
55

6+
const NoDevToolsCauseInTestEnv = React.createClass({
7+
render() {
8+
return null;
9+
}
10+
});
11+
612
const mapStateToProps = (state) => {
713
return {
814
title: state.title,
@@ -29,6 +35,7 @@ export const WineApp = connect(mapStateToProps)(React.createClass({
2935
},
3036

3137
render () {
38+
const Tools = window.TEST ? NoDevToolsCauseInTestEnv : DevTools;
3239
const message = this.props.httpState === 'LOADING' ?
3340
'Loading ...' :
3441
(this.props.httpState === 'LOADED' ?
@@ -57,7 +64,7 @@ export const WineApp = connect(mapStateToProps)(React.createClass({
5764
<GlobalStats />
5865
</div>
5966
</div>
60-
<DevTools />
67+
<Tools />
6168
</div>
6269
);
6370
}

‎step-6-done/tests/bootstrap.js

+2
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,8 @@ export function bootstrapEnv(body = '') {
1414
}
1515
global.document = doc;
1616
global.window = win;
17+
global.TEST = true;
18+
global.window.TEST = true;
1719
propagateToGlobal(win);
1820
// console.log('\nENV setup is done !!!');
1921
}

‎step-6-done/tests/components/wine-app.spec.js

+97-85
Original file line numberDiff line numberDiff line change
@@ -167,103 +167,115 @@ window.fetch = (url, post) => {
167167
global.fetch = window.fetch;
168168

169169
describe('<App />', () => {
170-
it('doit afficher des régions', () => {
171-
const history = createMemoryHistory(window.location);
172-
const wrapper = mount(
173-
<App history={history} />
174-
);
175-
const foundRegions = wrapper.find('Regions').find('div').filterWhere(n => regions.indexOf(n.get(0).innerHTML) > -1);
176-
expect(foundRegions.length).to.equal(2);
177-
});
178-
179-
it('doit afficher des vins après avoir sélectionné une région', () => {
180-
const history = createMemoryHistory(window.location);
181-
const wrapper = mount(
182-
<App history={history} />
183-
);
184-
185-
{
170+
it('doit afficher des régions', (done) => {
171+
setTimeout(() => {
172+
const history = createMemoryHistory(window.location);
173+
const wrapper = mount(
174+
<App history={history} />
175+
);
186176
const foundRegions = wrapper.find('Regions').find('div').filterWhere(n => regions.indexOf(n.get(0).innerHTML) > -1);
187177
expect(foundRegions.length).to.equal(2);
188-
}
189-
190-
const region2 = wrapper.find('Regions').find('div').filterWhere(n => n.get(0).innerHTML === regions[1]);
191-
region2.simulate('click');
192-
193-
{
194-
const wineNames1 = Object.keys(wines1).map(k => wines1[k].name);
195-
const foundWines1 = wrapper.find('WineList').find('div').filterWhere(n => wineNames1.indexOf(n.get(0).innerHTML) > -1);
196-
expect(foundWines1.length).to.equal(0);
197-
198-
const wineNames2 = Object.keys(wines2).map(k => wines2[k].name);
199-
const foundWines2 = wrapper.find('WineList').find('div').filterWhere(n => wineNames2.indexOf(n.get(0).innerHTML) > -1);
200-
expect(foundWines2.length).to.equal(2);
201-
}
202-
203-
history.goBack();
204-
205-
const region1 = wrapper.find('Regions').find('div').filterWhere(n => n.get(0).innerHTML === regions[0]);
206-
region1.simulate('click');
207-
208-
{
209-
const wineNames1 = Object.keys(wines1).map(k => wines1[k].name);
210-
const foundWines1 = wrapper.find('WineList').find('div').filterWhere(n => wineNames1.indexOf(n.get(0).innerHTML) > -1);
211-
expect(foundWines1.length).to.equal(2);
178+
done();
179+
});
180+
});
212181

213-
const wineNames2 = Object.keys(wines2).map(k => wines2[k].name);
214-
const foundWines2 = wrapper.find('WineList').find('div').filterWhere(n => wineNames2.indexOf(n.get(0).innerHTML) > -1);
215-
expect(foundWines2.length).to.equal(0);
216-
}
182+
it('doit afficher des vins après avoir sélectionné une région', (done) => {
183+
setTimeout(() => {
184+
const history = createMemoryHistory(window.location);
185+
const wrapper = mount(
186+
<App history={history} />
187+
);
217188

218-
});
189+
{
190+
const foundRegions = wrapper.find('Regions').find('div').filterWhere(n => regions.indexOf(n.get(0).innerHTML) > -1);
191+
expect(foundRegions.length).to.equal(2);
192+
}
219193

220-
it('doit afficher un vin après avoir sélectionné un nouveau vin', () => {
221-
const history = createMemoryHistory(window.location);
222-
const wrapper = mount(
223-
<App history={history} />
224-
);
194+
const region2 = wrapper.find('Regions').find('div').filterWhere(n => n.get(0).innerHTML === regions[1]);
195+
region2.simulate('click');
225196

226-
const region1 = wrapper.find('Regions').find('div').filterWhere(n => n.get(0).innerHTML === regions[0]);
227-
region1.simulate('click');
197+
{
198+
const wineNames1 = Object.keys(wines1).map(k => wines1[k].name);
199+
const foundWines1 = wrapper.find('WineList').find('div').filterWhere(n => wineNames1.indexOf(n.get(0).innerHTML) > -1);
200+
expect(foundWines1.length).to.equal(0);
228201

229-
const wine1 = wrapper.find('WineList').find('div').filterWhere(n => n.get(0).innerHTML === wines1[0].name);
230-
wine1.simulate('click');
202+
const wineNames2 = Object.keys(wines2).map(k => wines2[k].name);
203+
const foundWines2 = wrapper.find('WineList').find('div').filterWhere(n => wineNames2.indexOf(n.get(0).innerHTML) > -1);
204+
expect(foundWines2.length).to.equal(2);
205+
}
231206

232-
{
233-
const firstWine = wines1[0];
234-
const Wine = wrapper.find('Wine').at(0).first();
235-
const foundName = Wine.find('div').filterWhere(n => n.get(0).innerHTML.indexOf(firstWine.name) > -1);
236-
const foundType = Wine.find('div').filterWhere(n => n.get(0).innerHTML.indexOf(firstWine.type) > -1);
237-
const foundRegion = Wine.find('div').filterWhere(n => n.get(0).innerHTML.indexOf(firstWine.appellation.region) > -1);
238-
const foundAppellation = Wine.find('div').filterWhere(n => n.get(0).innerHTML.indexOf(firstWine.appellation.name) > -1);
239-
const foundGrapes = Wine.find('div').filterWhere(n => n.get(0).innerHTML.indexOf(firstWine.grapes.join(', ')) > -1);
207+
history.goBack();
240208

241-
expect(foundName.length).to.equal(2); // because of root div
242-
expect(foundType.length).to.equal(2);
243-
expect(foundAppellation.length).to.equal(2);
244-
expect(foundRegion.length).to.equal(2);
245-
expect(foundGrapes.length).to.equal(2);
246-
}
209+
const region1 = wrapper.find('Regions').find('div').filterWhere(n => n.get(0).innerHTML === regions[0]);
210+
region1.simulate('click');
247211

248-
history.goBack();
212+
{
213+
const wineNames1 = Object.keys(wines1).map(k => wines1[k].name);
214+
const foundWines1 = wrapper.find('WineList').find('div').filterWhere(n => wineNames1.indexOf(n.get(0).innerHTML) > -1);
215+
expect(foundWines1.length).to.equal(2);
249216

250-
const wine2 = wrapper.find('WineList').find('div').filterWhere(n => n.get(0).innerHTML === wines1[1].name);
251-
wine2.simulate('click');
217+
const wineNames2 = Object.keys(wines2).map(k => wines2[k].name);
218+
const foundWines2 = wrapper.find('WineList').find('div').filterWhere(n => wineNames2.indexOf(n.get(0).innerHTML) > -1);
219+
expect(foundWines2.length).to.equal(0);
220+
}
221+
history.goBack();
222+
history.goBack();
223+
done();
224+
});
225+
});
252226

253-
{
254-
const firstWine = wines1[1];
255-
const Wine = wrapper.find('Wine').at(0).first();
256-
const foundName = Wine.find('div').filterWhere(n => n.get(0).innerHTML.indexOf(firstWine.name) > -1);
257-
const foundType = Wine.find('div').filterWhere(n => n.get(0).innerHTML.indexOf(firstWine.type) > -1);
258-
const foundRegion = Wine.find('div').filterWhere(n => n.get(0).innerHTML.indexOf(firstWine.appellation.region) > -1);
259-
const foundAppellation = Wine.find('div').filterWhere(n => n.get(0).innerHTML.indexOf(firstWine.appellation.name) > -1);
260-
const foundGrapes = Wine.find('div').filterWhere(n => n.get(0).innerHTML.indexOf(firstWine.grapes.join(', ')) > -1);
227+
it('doit afficher un vin après avoir sélectionné un nouveau vin', (done) => {
228+
setTimeout(() => {
229+
const history = createMemoryHistory(window.location);
230+
const wrapper = mount(
231+
<App history={history} />
232+
);
233+
234+
const region1 = wrapper.find('Regions').find('div').filterWhere(n => n.get(0).innerHTML === regions[0]);
235+
region1.simulate('click');
236+
237+
const wine1 = wrapper.find('WineList').find('div').filterWhere(n => n.get(0).innerHTML === wines1[0].name);
238+
wine1.simulate('click');
239+
240+
{
241+
const firstWine = wines1[0];
242+
const Wine = wrapper.find('Wine').at(0).first();
243+
const foundName = Wine.find('div').filterWhere(n => n.get(0).innerHTML.indexOf(firstWine.name) > -1);
244+
const foundType = Wine.find('div').filterWhere(n => n.get(0).innerHTML.indexOf(firstWine.type) > -1);
245+
const foundRegion = Wine.find('div').filterWhere(n => n.get(0).innerHTML.indexOf(firstWine.appellation.region) > -1);
246+
const foundAppellation = Wine.find('div').filterWhere(n => n.get(0).innerHTML.indexOf(firstWine.appellation.name) > -1);
247+
const foundGrapes = Wine.find('div').filterWhere(n => n.get(0).innerHTML.indexOf(firstWine.grapes.join(', ')) > -1);
248+
249+
expect(foundName.length).to.equal(2); // because of root div
250+
expect(foundType.length).to.equal(2);
251+
expect(foundAppellation.length).to.equal(2);
252+
expect(foundRegion.length).to.equal(2);
253+
expect(foundGrapes.length).to.equal(2);
254+
}
261255

262-
expect(foundName.length).to.equal(2); // because of root div
263-
expect(foundType.length).to.equal(2);
264-
expect(foundAppellation.length).to.equal(2);
265-
expect(foundRegion.length).to.equal(2);
266-
expect(foundGrapes.length).to.equal(2);
267-
}
256+
history.goBack();
257+
258+
const wine2 = wrapper.find('WineList').find('div').filterWhere(n => n.get(0).innerHTML === wines1[1].name);
259+
wine2.simulate('click');
260+
261+
{
262+
const firstWine = wines1[1];
263+
const Wine = wrapper.find('Wine').at(0).first();
264+
const foundName = Wine.find('div').filterWhere(n => n.get(0).innerHTML.indexOf(firstWine.name) > -1);
265+
const foundType = Wine.find('div').filterWhere(n => n.get(0).innerHTML.indexOf(firstWine.type) > -1);
266+
const foundRegion = Wine.find('div').filterWhere(n => n.get(0).innerHTML.indexOf(firstWine.appellation.region) > -1);
267+
const foundAppellation = Wine.find('div').filterWhere(n => n.get(0).innerHTML.indexOf(firstWine.appellation.name) > -1);
268+
const foundGrapes = Wine.find('div').filterWhere(n => n.get(0).innerHTML.indexOf(firstWine.grapes.join(', ')) > -1);
269+
270+
expect(foundName.length).to.equal(2); // because of root div
271+
expect(foundType.length).to.equal(2);
272+
expect(foundAppellation.length).to.equal(2);
273+
expect(foundRegion.length).to.equal(2);
274+
expect(foundGrapes.length).to.equal(2);
275+
}
276+
history.goBack();
277+
history.goBack();
278+
done();
279+
});
268280
});
269281
});

‎step-6/src/components/wine-app.js

+9-1
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,15 @@
1+
/* eslint react/no-multi-comp: 0 */
12
import React, { PropTypes } from 'react';
23
import { GlobalStats } from './stats';
34
import { connect } from 'react-redux';
45
import { DevTools } from './devtools';
56

7+
const NoDevToolsCauseInTestEnv = React.createClass({
8+
render() {
9+
return null;
10+
}
11+
});
12+
613
export const WineApp = connect()(React.createClass({
714
propTypes: {
815
children: PropTypes.element
@@ -17,6 +24,7 @@ export const WineApp = connect()(React.createClass({
1724
},
1825

1926
render () {
27+
const Tools = window.TEST ? NoDevToolsCauseInTestEnv : DevTools;
2028
return (
2129
<div>
2230
<div className="grid">
@@ -31,7 +39,7 @@ export const WineApp = connect()(React.createClass({
3139
<GlobalStats />
3240
</div>
3341
</div>
34-
<DevTools />
42+
<Tools />
3543
</div>
3644
);
3745
}

‎step-6/tests/bootstrap.js

+2
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,8 @@ export function bootstrapEnv(body = '') {
1414
}
1515
global.document = doc;
1616
global.window = win;
17+
global.TEST = true;
18+
global.window.TEST = true;
1719
propagateToGlobal(win);
1820
// console.log('\nENV setup is done !!!');
1921
}

0 commit comments

Comments
 (0)