diff --git a/packages/react-scripts/config/webpack.config.dev.js b/packages/react-scripts/config/webpack.config.dev.js index 48e8a7f5c8a..83bbf5f996e 100644 --- a/packages/react-scripts/config/webpack.config.dev.js +++ b/packages/react-scripts/config/webpack.config.dev.js @@ -96,16 +96,16 @@ module.exports = { 'react-native': 'react-native-web' } }, - // @remove-on-eject-begin - // Resolve loaders (webpack plugins for CSS, images, transpilation) from the - // directory of `react-scripts` itself rather than the project directory. resolveLoader: { + // @remove-on-eject-begin + // Resolve loaders (webpack plugins for CSS, images, transpilation) from the + // directory of `react-scripts` itself rather than the project directory. root: paths.ownNodeModules, + moduleTemplates: ['*-loader'], + // @remove-on-eject-end // Fallback to any hoisted modules when dealing with linked libraries - fallback: paths.appNodeModules, - moduleTemplates: ['*-loader'] + fallback: paths.appNodeModules }, - // @remove-on-eject-end module: { // First, run the linter. // It's important to do this before Babel processes the JS. diff --git a/packages/react-scripts/config/webpack.config.prod.js b/packages/react-scripts/config/webpack.config.prod.js index 158ac80ea4f..b840f93a8e5 100644 --- a/packages/react-scripts/config/webpack.config.prod.js +++ b/packages/react-scripts/config/webpack.config.prod.js @@ -100,16 +100,16 @@ module.exports = { 'react-native': 'react-native-web' } }, - // @remove-on-eject-begin - // Resolve loaders (webpack plugins for CSS, images, transpilation) from the - // directory of `react-scripts` itself rather than the project directory. resolveLoader: { + // @remove-on-eject-begin + // Resolve loaders (webpack plugins for CSS, images, transpilation) from the + // directory of `react-scripts` itself rather than the project directory. root: paths.ownNodeModules, + moduleTemplates: ['*-loader'], + // @remove-on-eject-end // Fallback to any hoisted modules when dealing with linked libraries - fallback: paths.appNodeModules, - moduleTemplates: ['*-loader'] + fallback: paths.appNodeModules }, - // @remove-on-eject-end module: { // First, run the linter. // It's important to do this before Babel processes the JS. diff --git a/packages/react-scripts/fixtures/kitchensink/.template.dependencies.json b/packages/react-scripts/fixtures/kitchensink/.template.dependencies.json index 50511b3d16a..8a54954cf0f 100644 --- a/packages/react-scripts/fixtures/kitchensink/.template.dependencies.json +++ b/packages/react-scripts/fixtures/kitchensink/.template.dependencies.json @@ -4,6 +4,7 @@ "babel-polyfill": "6.20.0", "chai": "3.5.0", "jsdom": "9.8.3", - "mocha": "3.2.0" + "mocha": "3.2.0", + "test-integrity": "1.0.0" } } diff --git a/packages/react-scripts/fixtures/kitchensink/integration/webpack.test.js b/packages/react-scripts/fixtures/kitchensink/integration/webpack.test.js index 3eaa662b3d1..8cf4312c210 100644 --- a/packages/react-scripts/fixtures/kitchensink/integration/webpack.test.js +++ b/packages/react-scripts/fixtures/kitchensink/integration/webpack.test.js @@ -38,6 +38,12 @@ describe('Integration', () => { expect(doc.getElementById('feature-json-inclusion').textContent).to.equal('This is an abstract.') }) + it('linked modules', async () => { + const doc = await initDOM('linked-modules') + + expect(doc.getElementById('feature-linked-modules').textContent).to.equal('2.0.0') + }) + it('svg inclusion', async () => { const doc = await initDOM('svg-inclusion') diff --git a/packages/react-scripts/fixtures/kitchensink/src/App.js b/packages/react-scripts/fixtures/kitchensink/src/App.js index 8965b520dc6..dd1b1388c5a 100644 --- a/packages/react-scripts/fixtures/kitchensink/src/App.js +++ b/packages/react-scripts/fixtures/kitchensink/src/App.js @@ -94,6 +94,9 @@ class App extends Component { case 'json-inclusion': require.ensure([], () => this.setFeature(require('./features/webpack/JsonInclusion').default)); break; + case 'linked-modules': + require.ensure([], () => this.setFeature(require('./features/webpack/LinkedModules').default)); + break; case 'node-path': require.ensure([], () => this.setFeature(require('./features/env/NodePath').default)); break; diff --git a/packages/react-scripts/fixtures/kitchensink/src/features/webpack/LinkedModules.js b/packages/react-scripts/fixtures/kitchensink/src/features/webpack/LinkedModules.js new file mode 100644 index 00000000000..de8a5e4ab5b --- /dev/null +++ b/packages/react-scripts/fixtures/kitchensink/src/features/webpack/LinkedModules.js @@ -0,0 +1,20 @@ +/** + * Copyright (c) 2015-present, Facebook, Inc. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. An additional grant + * of patent rights can be found in the PATENTS file in the same directory. + */ + +import React from 'react'; +import './assets/style.css'; +import { test, version } from 'test-integrity'; + +export default () => { + const v = version(); + if (!test() || v !== '2.0.0') { + throw new Error('Functionality test did not pass.'); + } + return

{v}

; +}; diff --git a/packages/react-scripts/fixtures/kitchensink/src/features/webpack/LinkedModules.test.js b/packages/react-scripts/fixtures/kitchensink/src/features/webpack/LinkedModules.test.js new file mode 100644 index 00000000000..aa1e911ae45 --- /dev/null +++ b/packages/react-scripts/fixtures/kitchensink/src/features/webpack/LinkedModules.test.js @@ -0,0 +1,25 @@ +/** + * Copyright (c) 2015-present, Facebook, Inc. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. An additional grant + * of patent rights can be found in the PATENTS file in the same directory. + */ + +import React from 'react'; +import ReactDOM from 'react-dom'; +import { test, version } from 'test-integrity'; +import LinkedModules from './LinkedModules'; + +describe('linked modules', () => { + it('has integrity', () => { + expect(test()); + expect(version() === '2.0.0'); + }); + + it('renders without crashing', () => { + const div = document.createElement('div'); + ReactDOM.render(, div); + }); +}); diff --git a/tasks/e2e-kitchensink.sh b/tasks/e2e-kitchensink.sh index d6db4ae9f17..0d9c8372bcb 100755 --- a/tasks/e2e-kitchensink.sh +++ b/tasks/e2e-kitchensink.sh @@ -14,17 +14,18 @@ # Start in tasks/ even if run from root directory cd "$(dirname "$0")" -# CLI and app temporary locations +# CLI, app, and test module temporary locations # http://unix.stackexchange.com/a/84980 temp_cli_path=`mktemp -d 2>/dev/null || mktemp -d -t 'temp_cli_path'` temp_app_path=`mktemp -d 2>/dev/null || mktemp -d -t 'temp_app_path'` +temp_module_path=`mktemp -d 2>/dev/null || mktemp -d -t 'temp_module_path'` function cleanup { echo 'Cleaning up.' ps -ef | grep 'react-scripts' | grep -v grep | awk '{print $2}' | xargs kill -s 9 cd "$root_path" # TODO: fix "Device or resource busy" and remove ``|| $CI` - rm -rf "$temp_cli_path" $temp_app_path || $CI + rm -rf "$temp_cli_path" "$temp_app_path" "$temp_module_path" || $CI } # Error messages are redirected to stderr @@ -111,17 +112,24 @@ npm install "$cli_path" cd $temp_app_path create_react_app --scripts-version="$scripts_path" --internal-testing-template="$root_path"/packages/react-scripts/fixtures/kitchensink test-kitchensink +# Install the test module +cd "$temp_module_path" +npm install test-integrity@^2.0.1 + # ****************************************************************************** # Now that we used create-react-app to create an app depending on react-scripts, # let's make sure all npm scripts are in the working state. # ****************************************************************************** # Enter the app directory -cd test-kitchensink +cd "$temp_app_path/test-kitchensink" # Link to our preset npm link "$root_path"/packages/babel-preset-react-app +# Link to test module +npm link "$temp_module_path/node_modules/test-integrity" + # Test the build REACT_APP_SHELL_ENV_MESSAGE=fromtheshell \ NODE_PATH=src \ @@ -185,6 +193,8 @@ npm link "$root_path"/packages/react-scripts # ...and we need to remove template's .babelrc rm .babelrc +# Link to test module +npm link "$temp_module_path/node_modules/test-integrity" # Test the build REACT_APP_SHELL_ENV_MESSAGE=fromtheshell \