Skip to content

Commit adab23f

Browse files
TimerTimer
committedFeb 8, 2017
e2e: Reduce complexity of e2e and improve Jest coverage (facebook#1484)
1 parent 65e6340 commit adab23f

37 files changed

+269
-185
lines changed
 

‎packages/react-scripts/fixtures/kitchensink/.babelrc

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
11
{
2-
"presets": ["latest"]
2+
"presets": ["react-app"]
33
}

‎packages/react-scripts/fixtures/kitchensink/.template.dependencies.json

-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
{
22
"dependencies": {
3-
"babel-preset-latest": "6.16.0",
43
"babel-register": "6.22.0",
54
"babel-polyfill": "6.20.0",
65
"chai": "3.5.0",

‎packages/react-scripts/fixtures/kitchensink/src/App.js

+33-20
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,40 @@
1-
import React from 'react';
1+
import React, { Component, PropTypes, createElement } from 'react';
22

3-
class BuiltEmitter extends React.Component {
4-
constructor(props) {
5-
super(props)
6-
7-
this.callWhenDone = done => done();
3+
class BuiltEmitter extends Component {
4+
static propTypes = {
5+
feature: PropTypes.func.isRequired
86
}
97

108
componentDidMount() {
11-
this.callWhenDone(() => document.dispatchEvent(new Event('ReactFeatureDidMount')));
9+
const { feature } = this.props
10+
11+
// Class components must call this.props.onReady when they're ready for the test.
12+
// We will assume functional components are ready immediately after mounting.
13+
if (!Component.isPrototypeOf(feature)) {
14+
this.handleReady();
15+
}
1216
}
1317

14-
render() {
15-
const feature = React.cloneElement(React.Children.only(this.props.children), {
16-
setCallWhenDone: done => {
17-
this.callWhenDone = done;
18-
}
19-
});
18+
handleReady() {
19+
document.dispatchEvent(new Event('ReactFeatureDidMount'));
20+
}
2021

21-
return <div>{feature}</div>;
22+
render() {
23+
const {
24+
props: { feature },
25+
handleReady
26+
} = this;
27+
return (
28+
<div>
29+
{createElement(feature, {
30+
onReady: handleReady
31+
})}
32+
</div>
33+
);
2234
}
2335
}
2436

25-
class App extends React.Component {
37+
class App extends Component {
2638
constructor(props) {
2739
super(props);
2840

@@ -105,9 +117,7 @@ class App extends React.Component {
105117
case 'unknown-ext-inclusion':
106118
require.ensure([], () => this.setFeature(require('./features/webpack/UnknownExtInclusion').default));
107119
break;
108-
default:
109-
this.setFeature(null);
110-
break;
120+
default: throw new Error('Unknown feature!');
111121
}
112122
}
113123

@@ -116,8 +126,11 @@ class App extends React.Component {
116126
}
117127

118128
render() {
119-
const Feature = this.state.feature;
120-
return Feature ? <BuiltEmitter><Feature /></BuiltEmitter> : null;
129+
const { feature } = this.state;
130+
if (feature !== null) {
131+
return <BuiltEmitter feature={feature} />;
132+
}
133+
return null;
121134
}
122135
}
123136

‎packages/react-scripts/fixtures/kitchensink/src/App.test.js

-8
This file was deleted.

‎packages/react-scripts/fixtures/kitchensink/src/features/env/NodePath.js

+11-9
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,23 @@
1-
import React from 'react'
1+
import React, { Component, PropTypes } from 'react'
22
import load from 'absoluteLoad'
33

4-
export default class extends React.Component {
4+
export default class extends Component {
5+
static propTypes = {
6+
onReady: PropTypes.func.isRequired
7+
}
8+
59
constructor(props) {
610
super(props);
7-
8-
this.done = () => {};
9-
this.props.setCallWhenDone && this.props.setCallWhenDone((done) => {
10-
this.done = done;
11-
});
12-
1311
this.state = { users: [] };
1412
}
1513

1614
async componentDidMount() {
1715
const users = load();
18-
this.setState({ users }, () => this.done());
16+
this.setState({ users });
17+
}
18+
19+
componentDidUpdate() {
20+
this.props.onReady();
1921
}
2022

2123
render() {

‎packages/react-scripts/fixtures/kitchensink/src/features/env/NodePath.test.js

+3-1
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,8 @@ import NodePath from './NodePath';
55
describe('NODE_PATH', () => {
66
it('renders without crashing', () => {
77
const div = document.createElement('div');
8-
ReactDOM.render(<NodePath />, div);
8+
return new Promise(resolve => {
9+
ReactDOM.render(<NodePath onReady={resolve} />, div);
10+
});
911
});
1012
});

‎packages/react-scripts/fixtures/kitchensink/src/features/syntax/ArrayDestructuring.js

+11-9
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react'
1+
import React, { Component, PropTypes } from 'react'
22

33
function load() {
44
return [
@@ -9,21 +9,23 @@ function load() {
99
];
1010
}
1111

12-
export default class extends React.Component {
12+
export default class extends Component {
13+
static propTypes = {
14+
onReady: PropTypes.func.isRequired
15+
}
16+
1317
constructor(props) {
1418
super(props);
15-
16-
this.done = () => {};
17-
this.props.setCallWhenDone && this.props.setCallWhenDone((done) => {
18-
this.done = done;
19-
});
20-
2119
this.state = { users: [] };
2220
}
2321

2422
async componentDidMount() {
2523
const users = load();
26-
this.setState({ users }, () => this.done());
24+
this.setState({ users });
25+
}
26+
27+
componentDidUpdate() {
28+
this.props.onReady();
2729
}
2830

2931
render() {

‎packages/react-scripts/fixtures/kitchensink/src/features/syntax/ArrayDestructuring.test.js

+3-1
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,8 @@ import ArrayDestructuring from './ArrayDestructuring';
55
describe('array destructuring', () => {
66
it('renders without crashing', () => {
77
const div = document.createElement('div');
8-
ReactDOM.render(<ArrayDestructuring />, div);
8+
return new Promise(resolve => {
9+
ReactDOM.render(<ArrayDestructuring onReady={resolve} />, div);
10+
});
911
});
1012
});

‎packages/react-scripts/fixtures/kitchensink/src/features/syntax/ArraySpread.js

+11-9
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react'
1+
import React, { Component, PropTypes } from 'react'
22

33
function load(users) {
44
return [
@@ -9,21 +9,23 @@ function load(users) {
99
];
1010
}
1111

12-
export default class extends React.Component {
12+
export default class extends Component {
13+
static propTypes = {
14+
onReady: PropTypes.func.isRequired
15+
}
16+
1317
constructor(props) {
1418
super(props);
15-
16-
this.done = () => {};
17-
this.props.setCallWhenDone && this.props.setCallWhenDone((done) => {
18-
this.done = done;
19-
});
20-
2119
this.state = { users: [] };
2220
}
2321

2422
async componentDidMount() {
2523
const users = load([{ id: 42, name: '42' }]);
26-
this.setState({ users }, () => this.done());
24+
this.setState({ users });
25+
}
26+
27+
componentDidUpdate() {
28+
this.props.onReady();
2729
}
2830

2931
render() {

‎packages/react-scripts/fixtures/kitchensink/src/features/syntax/ArraySpread.test.js

+3-1
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,8 @@ import ArraySpread from './ArraySpread';
55
describe('array spread', () => {
66
it('renders without crashing', () => {
77
const div = document.createElement('div');
8-
ReactDOM.render(<ArraySpread />, div);
8+
return new Promise(resolve => {
9+
ReactDOM.render(<ArraySpread onReady={resolve} />, div);
10+
});
911
});
1012
});

‎packages/react-scripts/fixtures/kitchensink/src/features/syntax/AsyncAwait.js

+11-9
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react'
1+
import React, { Component, PropTypes } from 'react'
22

33
async function load() {
44
return [
@@ -9,21 +9,23 @@ async function load() {
99
];
1010
}
1111

12-
export default class extends React.Component {
12+
export default class extends Component {
13+
static propTypes = {
14+
onReady: PropTypes.func.isRequired
15+
}
16+
1317
constructor(props) {
1418
super(props);
15-
16-
this.done = () => {};
17-
this.props.setCallWhenDone && this.props.setCallWhenDone((done) => {
18-
this.done = done;
19-
});
20-
2119
this.state = { users: [] };
2220
}
2321

2422
async componentDidMount() {
2523
const users = await load();
26-
this.setState({ users }, () => this.done());
24+
this.setState({ users });
25+
}
26+
27+
componentDidUpdate() {
28+
this.props.onReady();
2729
}
2830

2931
render() {

‎packages/react-scripts/fixtures/kitchensink/src/features/syntax/AsyncAwait.test.js

+3-1
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,8 @@ import AsyncAwait from './AsyncAwait';
55
describe('async/await', () => {
66
it('renders without crashing', () => {
77
const div = document.createElement('div');
8-
ReactDOM.render(<AsyncAwait />, div);
8+
return new Promise(resolve => {
9+
ReactDOM.render(<AsyncAwait onReady={resolve} />, div);
10+
});
911
});
1012
});

‎packages/react-scripts/fixtures/kitchensink/src/features/syntax/ClassProperties.js

+10-2
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,21 @@
1-
import React from 'react'
1+
import React, { Component, PropTypes } from 'react'
2+
3+
export default class extends Component {
4+
static propTypes = {
5+
onReady: PropTypes.func.isRequired
6+
}
27

3-
export default class extends React.Component {
48
users = [
59
{ id: 1, name: '1' },
610
{ id: 2, name: '2' },
711
{ id: 3, name: '3' },
812
{ id: 4, name: '4' }
913
];
1014

15+
componentDidMount() {
16+
this.props.onReady()
17+
}
18+
1119
render() {
1220
return (
1321
<div id="feature-class-properties">

‎packages/react-scripts/fixtures/kitchensink/src/features/syntax/ClassProperties.test.js

+3-1
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,8 @@ import ClassProperties from './ClassProperties';
55
describe('class properties', () => {
66
it('renders without crashing', () => {
77
const div = document.createElement('div');
8-
ReactDOM.render(<ClassProperties />, div);
8+
return new Promise(resolve => {
9+
ReactDOM.render(<ClassProperties onReady={resolve} />, div);
10+
});
911
});
1012
});

‎packages/react-scripts/fixtures/kitchensink/src/features/syntax/ComputedProperties.js

+11-9
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react'
1+
import React, { Component, PropTypes } from 'react'
22

33
function load(prefix) {
44
return [
@@ -9,21 +9,23 @@ function load(prefix) {
99
];
1010
}
1111

12-
export default class extends React.Component {
12+
export default class extends Component {
13+
static propTypes = {
14+
onReady: PropTypes.func.isRequired
15+
}
16+
1317
constructor(props) {
1418
super(props);
15-
16-
this.done = () => {};
17-
this.props.setCallWhenDone && this.props.setCallWhenDone((done) => {
18-
this.done = done;
19-
});
20-
2119
this.state = { users: [] };
2220
}
2321

2422
async componentDidMount() {
2523
const users = load('user_');
26-
this.setState({ users }, () => this.done());
24+
this.setState({ users });
25+
}
26+
27+
componentDidUpdate() {
28+
this.props.onReady();
2729
}
2830

2931
render() {

‎packages/react-scripts/fixtures/kitchensink/src/features/syntax/ComputedProperties.test.js

+3-1
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,8 @@ import ComputedProperties from './ComputedProperties';
55
describe('computed properties', () => {
66
it('renders without crashing', () => {
77
const div = document.createElement('div');
8-
ReactDOM.render(<ComputedProperties />, div);
8+
return new Promise(resolve => {
9+
ReactDOM.render(<ComputedProperties onReady={resolve} />, div);
10+
});
911
});
1012
});

0 commit comments

Comments
 (0)