Skip to content

Commit 182f64f

Browse files
gaearongaearon
authored
[Flight] End-to-End Fixture (#17319)
1 parent 6cb6b1d commit 182f64f

File tree

9 files changed

+10031
-0
lines changed

9 files changed

+10031
-0
lines changed

‎fixtures/flight/.env‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
SKIP_PREFLIGHT_CHECK=true

‎fixtures/flight/.gitignore‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
/.pnp
6+
.pnp.js
7+
8+
# testing
9+
/coverage
10+
11+
# production
12+
/build
13+
14+
# misc
15+
.DS_Store
16+
.env.local
17+
.env.development.local
18+
.env.test.local
19+
.env.production.local
20+
21+
npm-debug.log*
22+
yarn-debug.log*
23+
yarn-error.log*

‎fixtures/flight/package.json‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
{
2+
"name": "flight",
3+
"version": "0.1.0",
4+
"private": true,
5+
"dependencies": {
6+
"@babel/register": "^7.7.0",
7+
"concurrently": "^5.0.0",
8+
"express": "^4.17.1",
9+
"react-scripts": "3.2.0"
10+
},
11+
"scripts": {
12+
"prestart": "cp -r ../../build/node_modules/* ./node_modules/",
13+
"prebuild": "cp -r ../../build/node_modules/* ./node_modules/",
14+
"start": "concurrently \"npm run start:server\" \"npm run start:client\"",
15+
"start:client": "react-scripts start",
16+
"start:server": "NODE_ENV=development node server",
17+
"start:prod": "react-scripts build && NODE_ENV=production node server",
18+
"build": "react-scripts build",
19+
"test": "react-scripts test --env=jsdom",
20+
"eject": "react-scripts eject"
21+
},
22+
"eslintConfig": {
23+
"extends": "react-app"
24+
},
25+
"browserslist": {
26+
"production": [
27+
">0.2%",
28+
"not dead",
29+
"not op_mini all"
30+
],
31+
"development": [
32+
"last 1 chrome version",
33+
"last 1 firefox version",
34+
"last 1 safari version"
35+
]
36+
}
37+
}

‎fixtures/flight/public/index.html‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1" />
6+
<title>Flight</title>
7+
</head>
8+
<body>
9+
<div id="root"></div>
10+
</body>
11+
</html>

‎fixtures/flight/server/handler.js‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
'use strict';
2+
3+
const ReactFlightDOMServer = require('react-dom/unstable-flight-server');
4+
const React = require('react');
5+
const Stream = require('stream');
6+
7+
function Text({children}) {
8+
return <span>{children}</span>;
9+
}
10+
11+
function HTML() {
12+
return (
13+
<div>
14+
<Text>Hello</Text>
15+
<Text>world</Text>
16+
</div>
17+
);
18+
}
19+
20+
module.exports = function(req, res) {
21+
res.setHeader('Access-Control-Allow-Origin', '*');
22+
let model = {
23+
content: {
24+
__html: <HTML />,
25+
},
26+
};
27+
ReactFlightDOMServer.pipeToNodeWritable(model, res);
28+
};

‎fixtures/flight/server/index.js‎

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
'use strict';
2+
3+
const babelRegister = require('@babel/register');
4+
5+
babelRegister({
6+
ignore: [/\/(build|node_modules)\//],
7+
presets: ['react-app'],
8+
});
9+
10+
const express = require('express');
11+
const app = express();
12+
13+
// Application
14+
app.get('/', function(req, res) {
15+
if (process.env.NODE_ENV === 'development') {
16+
for (var key in require.cache) {
17+
delete require.cache[key];
18+
}
19+
}
20+
require('./handler')(req, res);
21+
});
22+
23+
app.listen(3001, () => {
24+
console.log('Flight Server listening on port 3001...');
25+
});
26+
27+
app.on('error', function(error) {
28+
if (error.syscall !== 'listen') {
29+
throw error;
30+
}
31+
32+
var bind = typeof port === 'string' ? 'Pipe ' + port : 'Port ' + port;
33+
34+
switch (error.code) {
35+
case 'EACCES':
36+
console.error(bind + ' requires elevated privileges');
37+
process.exit(1);
38+
break;
39+
case 'EADDRINUSE':
40+
console.error(bind + ' is already in use');
41+
process.exit(1);
42+
break;
43+
default:
44+
throw error;
45+
}
46+
});

‎fixtures/flight/src/App.js‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import React, {Suspense} from 'react';
2+
3+
function Content({data}) {
4+
return <p dangerouslySetInnerHTML={data.model.content} />;
5+
}
6+
7+
function App({data}) {
8+
return (
9+
<Suspense fallback={<h1>Loading...</h1>}>
10+
<Content data={data} />
11+
</Suspense>
12+
);
13+
}
14+
15+
export default App;

‎fixtures/flight/src/index.js‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import React from 'react';
2+
import ReactDOM from 'react-dom';
3+
import ReactFlightDOMClient from 'react-dom/unstable-flight-client';
4+
import App from './App';
5+
6+
let data = ReactFlightDOMClient.readFromFetch(fetch('http://localhost:3001'));
7+
ReactDOM.render(<App data={data} />, document.getElementById('root'));

0 commit comments

Comments
 (0)