@samitouri / QOS-React / commits / 429da399e9

Move build fixtures to fixtures/packaging, updated paths

Brandon Dail committed Jan 9, 2017 at 15:55 UTC 429da399e94438226a3c93b2865879fb2d03a62b
37 files changed +535 -1
fixtures/dom/package.json
+1 -1
@@ -1,5 +1,5 @@
1 {
2 - "name": "_fixtures",
2 + "name": "react-fixtures",
3 "version": "0.1.0",
4 "private": true,
5 "devDependencies": {
fixtures/packaging/README.md new
+50
@@ -0,0 +1,50 @@
1 +# Manual Testing Fixtures
2 +
3 +This folder exists for **React contributors** only.
4 +If you use React you don't need to worry about it.
5 +
6 +These fixtures verify that the built React distributions are usable in different environments.
7 +**They are not running automatically.** (At least not yet, feel free to contribute to automate them.)
8 +
9 +Run them when you make changes to how we package React, ReactDOM, and addons.
10 +
11 +## How to Run
12 +
13 +First, build React and the fixtures:
14 +
15 +```
16 +cd react
17 +npm run build
18 +
19 +cd fixtures
20 +node build-all.js
21 +```
22 +
23 +Then run a local server at the root of the repo, e.g.
24 +
25 +```
26 +npm i -g pushstate-server
27 +cd ..
28 +pushstate-server .
29 +```
30 +
31 +(Too complicated? Send a PR to simplify this :-).
32 +
33 +Then open the corresponding URLs, for example:
34 +
35 +```
36 +open http://localhost:9000/fixtures/globals.html
37 +open http://localhost:9000/fixtures/requirejs.html
38 +open http://localhost:9000/fixtures/systemjs.html
39 +open http://localhost:9000/fixtures/browserify/index.html
40 +open http://localhost:9000/fixtures/brunch/index.html
41 +open http://localhost:9000/fixtures/rjs/index.html
42 +open http://localhost:9000/fixtures/systemjs-builder/index.html
43 +open http://localhost:9000/fixtures/webpack/index.html
44 +open http://localhost:9000/fixtures/webpack-alias/index.html
45 +```
46 +
47 +You should see two things:
48 +
49 +* "Hello World" fading in with an animation.
50 +* No errors in the console.
fixtures/packaging/browserify/.gitignore new
+1
@@ -0,0 +1 @@
1 +output.js
fixtures/packaging/browserify/index.html new
+16
@@ -0,0 +1,16 @@
1 +<html>
2 + <body>
3 + <style>
4 + .example-appear {
5 + opacity: 0.01;
6 + }
7 +
8 + .example-appear.example-appear-active {
9 + opacity: 1;
10 + transition: opacity .5s ease-in;
11 + }
12 + </style>
13 + <div id="container"></div>
14 + <script src="output.js"></script>
15 + </body>
16 +</html>
\ No newline at end of file
fixtures/packaging/browserify/input.js new
+16
@@ -0,0 +1,16 @@
1 +var React = require('react');
2 +var CSSTransitionGroup = require('react-addons-css-transition-group');
3 +var ReactDOM = require('react-dom');
4 +
5 +ReactDOM.render(
6 + React.createElement(CSSTransitionGroup, {
7 + transitionName: 'example',
8 + transitionAppear: true,
9 + transitionAppearTimeout: 500,
10 + transitionEnterTimeout: 0,
11 + transitionLeaveTimeout: 0,
12 + }, React.createElement('h1', null,
13 + 'Hello World!'
14 + )),
15 + document.getElementById('container')
16 +);
fixtures/packaging/browserify/package.json new
+10
@@ -0,0 +1,10 @@
1 +{
2 + "name": "webpack-test",
3 + "private": true,
4 + "dependencies": {
5 + "browserify": "^13.3.0"
6 + },
7 + "scripts": {
8 + "build": "rm -f output.js && NODE_PATH=../../../build/packages browserify ./input.js -o output.js"
9 + }
10 +}
fixtures/packaging/brunch/.gitignore new
+2
@@ -0,0 +1,2 @@
1 +output.js
2 +output.js.map
\ No newline at end of file
fixtures/packaging/brunch/app/initialize.js new
+16
@@ -0,0 +1,16 @@
1 +var React = require('react');
2 +var CSSTransitionGroup = require('react-addons-css-transition-group');
3 +var ReactDOM = require('react-dom');
4 +
5 +ReactDOM.render(
6 + React.createElement(CSSTransitionGroup, {
7 + transitionName: 'example',
8 + transitionAppear: true,
9 + transitionAppearTimeout: 500,
10 + transitionEnterTimeout: 0,
11 + transitionLeaveTimeout: 0,
12 + }, React.createElement('h1', null,
13 + 'Hello World!'
14 + )),
15 + document.getElementById('container')
16 +);
fixtures/packaging/brunch/config.js new
+10
@@ -0,0 +1,10 @@
1 +exports.config = {
2 + paths: {
3 + public: '.',
4 + },
5 + files: {
6 + javascripts: {
7 + joinTo: 'output.js',
8 + },
9 + },
10 +};
fixtures/packaging/brunch/index.html new
+17
@@ -0,0 +1,17 @@
1 +<html>
2 + <body>
3 + <style>
4 + .example-appear {
5 + opacity: 0.01;
6 + }
7 +
8 + .example-appear.example-appear-active {
9 + opacity: 1;
10 + transition: opacity .5s ease-in;
11 + }
12 + </style>
13 + <div id="container"></div>
14 + <script src="output.js"></script>
15 + <script>require('initialize');</script>
16 + </body>
17 +</html>
\ No newline at end of file
fixtures/packaging/brunch/input.js new
+16
@@ -0,0 +1,16 @@
1 +var React = require('react');
2 +var CSSTransitionGroup = require('react-addons-css-transition-group');
3 +var ReactDOM = require('react-dom');
4 +
5 +ReactDOM.render(
6 + React.createElement(CSSTransitionGroup, {
7 + transitionName: 'example',
8 + transitionAppear: true,
9 + transitionAppearTimeout: 500,
10 + transitionEnterTimeout: 0,
11 + transitionLeaveTimeout: 0,
12 + }, React.createElement('h1', null,
13 + 'Hello World!'
14 + )),
15 + document.getElementById('container')
16 +);
fixtures/packaging/brunch/package.json new
+10
@@ -0,0 +1,10 @@
1 +{
2 + "name": "brunch-test",
3 + "devDependencies": {
4 + "brunch": "^2.9.1",
5 + "javascript-brunch": "^2.0.0"
6 + },
7 + "scripts": {
8 + "build": "rm -rf public && ln -fs ../../../../build/packages/react node_modules/react && ln -fs ../../../../build/packages/react-dom node_modules/react-dom && ln -fs ../../../../build/packages/react-addons-css-transition-group node_modules/react-addons-css-transition-group && brunch build"
9 + }
10 +}
\ No newline at end of file
fixtures/packaging/build-all.js new
+30
@@ -0,0 +1,30 @@
1 +var fs = require('fs');
2 +var path = require('path');
3 +var { spawnSync } = require('child_process');
4 +
5 +var fixtureDirs = fs.readdirSync(__dirname).filter((file) => {
6 + return fs.statSync(path.join(__dirname, file)).isDirectory();
7 +});
8 +
9 +var cmdArgs = [
10 + {cmd: 'npm', args: ['install']},
11 + {cmd: 'npm', args: ['run', 'build']},
12 +];
13 +
14 +for (const dir of fixtureDirs) {
15 + for (const cmdArg of cmdArgs) {
16 + const opts = {
17 + cwd: path.join(__dirname, dir),
18 + stdio: 'inherit',
19 + };
20 + let result = spawnSync(cmdArg.cmd, cmdArg.args, opts);
21 + if (result.status !== 0) {
22 + throw new Error('Failed to build fixtures.');
23 + }
24 + }
25 +}
26 +
27 +console.log('-------------------------');
28 +console.log('All fixtures were built!');
29 +console.log('Now make sure to open each HTML file in this directory and each index.html in subdirectories.');
30 +console.log('-------------------------');
fixtures/packaging/globals.html new
+32
@@ -0,0 +1,32 @@
1 +<html>
2 + <body>
3 + <script src="../../build/react-with-addons.js"></script>
4 + <script src="../../build/react-dom.js"></script>
5 + <style>
6 + .example-appear {
7 + opacity: 0.01;
8 + }
9 +
10 + .example-appear.example-appear-active {
11 + opacity: 1;
12 + transition: opacity .5s ease-in;
13 + }
14 + </style>
15 + <div id="container"></div>
16 + <script>
17 + var CSSTransitionGroup = React.addons.CSSTransitionGroup;
18 + ReactDOM.render(
19 + React.createElement(CSSTransitionGroup, {
20 + transitionName: 'example',
21 + transitionAppear: true,
22 + transitionAppearTimeout: 500,
23 + transitionEnterTimeout: 0,
24 + transitionLeaveTimeout: 0,
25 + }, React.createElement('h1', null,
26 + 'Hello World!'
27 + )),
28 + document.getElementById('container')
29 + );
30 + </script>
31 + </body>
32 +</html>
\ No newline at end of file
fixtures/packaging/requirejs.html new
+40
@@ -0,0 +1,40 @@
1 +<html>
2 + <body>
3 + <script src="https://unpkg.com/requirejs@2.3.2/require.js"></script>
4 + <style>
5 + .example-appear {
6 + opacity: 0.01;
7 + }
8 +
9 + .example-appear.example-appear-active {
10 + opacity: 1;
11 + transition: opacity .5s ease-in;
12 + }
13 + </style>
14 + <div id="container"></div>
15 + <script>
16 + requirejs.config({
17 + paths: {
18 + react: '../../build/react-with-addons',
19 + 'react-dom': '../../build/react-dom'
20 + }
21 + });
22 +
23 + require(['react', 'react-dom'], function(React, ReactDOM) {
24 + var CSSTransitionGroup = React.addons.CSSTransitionGroup;
25 + ReactDOM.render(
26 + React.createElement(CSSTransitionGroup, {
27 + transitionName: 'example',
28 + transitionAppear: true,
29 + transitionAppearTimeout: 500,
30 + transitionEnterTimeout: 0,
31 + transitionLeaveTimeout: 0,
32 + }, React.createElement('h1', null,
33 + 'Hello World!'
34 + )),
35 + document.getElementById('container')
36 + );
37 + });
38 + </script>
39 + </body>
40 +</html>
\ No newline at end of file
fixtures/packaging/rjs/.gitignore new
+1
@@ -0,0 +1 @@
1 +output.js
\ No newline at end of file
fixtures/packaging/rjs/config.js new
+10
@@ -0,0 +1,10 @@
1 +module.exports = {
2 + baseUrl: '.',
3 + name: 'input',
4 + out: 'output.js',
5 + optimize: 'none',
6 + paths: {
7 + react: '../../../build/react-with-addons',
8 + 'react-dom': '../../../build/react-dom',
9 + },
10 +};
fixtures/packaging/rjs/index.html new
+17
@@ -0,0 +1,17 @@
1 +<html>
2 + <body>
3 + <style>
4 + .example-appear {
5 + opacity: 0.01;
6 + }
7 +
8 + .example-appear.example-appear-active {
9 + opacity: 1;
10 + transition: opacity .5s ease-in;
11 + }
12 + </style>
13 + <div id="container"></div>
14 + <script src="https://unpkg.com/requirejs@2.3.2/require.js"></script>
15 + <script src="output.js"></script>
16 + </body>
17 +</html>
\ No newline at end of file
fixtures/packaging/rjs/input.js new
+15
@@ -0,0 +1,15 @@
1 +require(['react', 'react-dom'], function(React, ReactDOM) {
2 + var CSSTransitionGroup = React.addons.CSSTransitionGroup;
3 + ReactDOM.render(
4 + React.createElement(CSSTransitionGroup, {
5 + transitionName: 'example',
6 + transitionAppear: true,
7 + transitionAppearTimeout: 500,
8 + transitionEnterTimeout: 0,
9 + transitionLeaveTimeout: 0,
10 + }, React.createElement('h1', null,
11 + 'Hello World!'
12 + )),
13 + document.getElementById('container')
14 + );
15 +});
fixtures/packaging/rjs/package.json new
+10
@@ -0,0 +1,10 @@
1 +{
2 + "name": "rjs-test",
3 + "private": true,
4 + "dependencies": {
5 + "requirejs": "^2.3.2"
6 + },
7 + "scripts": {
8 + "build": "rm -f output.js && r.js -o config.js"
9 + }
10 +}
fixtures/packaging/systemjs-builder/.gitignore new
+1
@@ -0,0 +1 @@
1 +output.js
\ No newline at end of file
fixtures/packaging/systemjs-builder/build.js new
+12
@@ -0,0 +1,12 @@
1 +var Builder = require('systemjs-builder');
2 +
3 +var builder = new Builder('/', './config.js');
4 +builder
5 + .buildStatic('./input.js', './output.js')
6 + .then(function() {
7 + console.log('Build complete');
8 + })
9 + .catch(function(err) {
10 + console.log('Build error');
11 + console.log(err);
12 + });
fixtures/packaging/systemjs-builder/config.js new
+6
@@ -0,0 +1,6 @@
1 +System.config({
2 + paths: {
3 + react: '../../../build/react-with-addons.js',
4 + 'react-dom': '../../../build/react-dom.js',
5 + },
6 +});
fixtures/packaging/systemjs-builder/index.html new
+16
@@ -0,0 +1,16 @@
1 +<html>
2 + <body>
3 + <style>
4 + .example-appear {
5 + opacity: 0.01;
6 + }
7 +
8 + .example-appear.example-appear-active {
9 + opacity: 1;
10 + transition: opacity .5s ease-in;
11 + }
12 + </style>
13 + <div id="container"></div>
14 + <script src="output.js"></script>
15 + </body>
16 +</html>
\ No newline at end of file
fixtures/packaging/systemjs-builder/input.js new
+16
@@ -0,0 +1,16 @@
1 +import React from 'react';
2 +import ReactDOM from 'react-dom';
3 +
4 +var CSSTransitionGroup = React.addons.CSSTransitionGroup;
5 +ReactDOM.render(
6 + React.createElement(CSSTransitionGroup, {
7 + transitionName: 'example',
8 + transitionAppear: true,
9 + transitionAppearTimeout: 500,
10 + transitionEnterTimeout: 0,
11 + transitionLeaveTimeout: 0,
12 + }, React.createElement('h1', null,
13 + 'Hello World!'
14 + )),
15 + document.getElementById('container')
16 +);
fixtures/packaging/systemjs-builder/package.json new
+10
@@ -0,0 +1,10 @@
1 +{
2 + "name": "systemjs-builder-test",
3 + "private": true,
4 + "dependencies": {
5 + "systemjs-builder": "^0.15.34"
6 + },
7 + "scripts": {
8 + "build": "rm -f output.js && node build.js"
9 + }
10 +}
fixtures/packaging/systemjs.html new
+46
@@ -0,0 +1,46 @@
1 +<html>
2 + <body>
3 + <script src="https://unpkg.com/systemjs@0.19.41/dist/system.js"></script>
4 + <style>
5 + .example-appear {
6 + opacity: 0.01;
7 + }
8 +
9 + .example-appear.example-appear-active {
10 + opacity: 1;
11 + transition: opacity .5s ease-in;
12 + }
13 + </style>
14 + <div id="container"></div>
15 + <script>
16 + System.config({
17 + paths: {
18 + react: '../../build/react-with-addons.js',
19 + 'react-dom': '../../build/react-dom.js'
20 + }
21 + });
22 +
23 + Promise.all([
24 + System.import("react"),
25 + System.import("react-dom")
26 + ]).then(function (deps) {
27 + var React = deps[0];
28 + var ReactDOM = deps[1];
29 +
30 + var CSSTransitionGroup = React.addons.CSSTransitionGroup;
31 + ReactDOM.render(
32 + React.createElement(CSSTransitionGroup, {
33 + transitionName: 'example',
34 + transitionAppear: true,
35 + transitionAppearTimeout: 500,
36 + transitionEnterTimeout: 0,
37 + transitionLeaveTimeout: 0,
38 + }, React.createElement('h1', null,
39 + 'Hello World!'
40 + )),
41 + document.getElementById('container')
42 + );
43 + });
44 + </script>
45 + </body>
46 +</html>
\ No newline at end of file
fixtures/packaging/webpack-alias/.gitignore new
+1
@@ -0,0 +1 @@
1 +output.js
\ No newline at end of file
fixtures/packaging/webpack-alias/config.js new
+13
@@ -0,0 +1,13 @@
1 +module.exports = {
2 + entry: './input',
3 + output: {
4 + filename: 'output.js',
5 + },
6 + resolve: {
7 + root: '../../../build/packages',
8 + alias: {
9 + 'react': 'react/dist/react-with-addons',
10 + 'react-dom': 'react-dom/dist/react-dom',
11 + },
12 + },
13 +};
fixtures/packaging/webpack-alias/index.html new
+16
@@ -0,0 +1,16 @@
1 +<html>
2 + <body>
3 + <style>
4 + .example-appear {
5 + opacity: 0.01;
6 + }
7 +
8 + .example-appear.example-appear-active {
9 + opacity: 1;
10 + transition: opacity .5s ease-in;
11 + }
12 + </style>
13 + <div id="container"></div>
14 + <script src="output.js"></script>
15 + </body>
16 +</html>
\ No newline at end of file
fixtures/packaging/webpack-alias/input.js new
+16
@@ -0,0 +1,16 @@
1 +var React = require('react');
2 +var ReactDOM = require('react-dom');
3 +
4 +var CSSTransitionGroup = React.addons.CSSTransitionGroup;
5 +ReactDOM.render(
6 + React.createElement(CSSTransitionGroup, {
7 + transitionName: 'example',
8 + transitionAppear: true,
9 + transitionAppearTimeout: 500,
10 + transitionEnterTimeout: 0,
11 + transitionLeaveTimeout: 0,
12 + }, React.createElement('h1', null,
13 + 'Hello World!'
14 + )),
15 + document.getElementById('container')
16 +);
fixtures/packaging/webpack-alias/package.json new
+10
@@ -0,0 +1,10 @@
1 +{
2 + "name": "webpack-test",
3 + "private": true,
4 + "dependencies": {
5 + "webpack": "^1.14.0"
6 + },
7 + "scripts": {
8 + "build": "rm -f output.js && webpack --config config.js"
9 + }
10 +}
fixtures/packaging/webpack/.gitignore new
+1
@@ -0,0 +1 @@
1 +output.js
\ No newline at end of file
fixtures/packaging/webpack/config.js new
+9
@@ -0,0 +1,9 @@
1 +module.exports = {
2 + entry: './input',
3 + output: {
4 + filename: 'output.js',
5 + },
6 + resolve: {
7 + root: '../../../build/packages/',
8 + },
9 +};
fixtures/packaging/webpack/index.html new
+16
@@ -0,0 +1,16 @@
1 +<html>
2 + <body>
3 + <style>
4 + .example-appear {
5 + opacity: 0.01;
6 + }
7 +
8 + .example-appear.example-appear-active {
9 + opacity: 1;
10 + transition: opacity .5s ease-in;
11 + }
12 + </style>
13 + <div id="container"></div>
14 + <script src="output.js"></script>
15 + </body>
16 +</html>
\ No newline at end of file
fixtures/packaging/webpack/input.js new
+16
@@ -0,0 +1,16 @@
1 +var React = require('react');
2 +var CSSTransitionGroup = require('react-addons-css-transition-group');
3 +var ReactDOM = require('react-dom');
4 +
5 +ReactDOM.render(
6 + React.createElement(CSSTransitionGroup, {
7 + transitionName: 'example',
8 + transitionAppear: true,
9 + transitionAppearTimeout: 500,
10 + transitionEnterTimeout: 0,
11 + transitionLeaveTimeout: 0,
12 + }, React.createElement('h1', null,
13 + 'Hello World!'
14 + )),
15 + document.getElementById('container')
16 +);
fixtures/packaging/webpack/package.json new
+10
@@ -0,0 +1,10 @@
1 +{
2 + "name": "webpack-test",
3 + "private": true,
4 + "dependencies": {
5 + "webpack": "^1.14.0"
6 + },
7 + "scripts": {
8 + "build": "rm -f output.js && webpack --config config.js"
9 + }
10 +}