e2006b2ff7
This commit integrates Mock Service Worker into the browser. This will allow us to use MSW to mock network requests at the API level from a browser using the same MSW fixtures that we are currently using for our testing. This means we will be able to have the same environment for debugging, development, and testing if desired. To develop using MSW, the developer will now use `npm run stage-beta:msw`. The dev server will start as normal, but now any request made that has a corresponding fixture will be intercepted and the fixture used to generate the response. This adds an MSW=TRUE environment variable to the run script. When this environment variable is present, the dev webpack config will copy mockServiceWorker.js into the build directory (/dist) using CopyPlugin and will add some necessary headers to the dev server's responses using DefinePlugin.
34 lines
1 KiB
JavaScript
34 lines
1 KiB
JavaScript
import React from 'react';
|
|
|
|
import { Provider } from 'react-redux';
|
|
|
|
import App from './App';
|
|
import { store } from './store';
|
|
|
|
if (process.env.NODE_ENV === 'development' && process.env.MSW === true) {
|
|
// process.env.MSW is set in the webpack config using DefinePlugin
|
|
const { worker } = require('./test/mocks/browser');
|
|
worker.start({
|
|
serviceWorker: {
|
|
url: '/beta/apps/image-builder/mockServiceWorker.js',
|
|
options: {
|
|
/*
|
|
Service workers can only intercept requests made from within their scope.
|
|
mockServiceWorker.js is served from /beta/apps/image-builder/, which becomes
|
|
the worker's default scope. Set scope to '/' so that all requests are in scope
|
|
and can be intercepted. Note that the Service-Worker-Allowed header must
|
|
be set to '/' for this to work, and is done in the webpack config.
|
|
*/
|
|
scope: '../../../',
|
|
},
|
|
},
|
|
});
|
|
}
|
|
|
|
const ImageBuilder = () => (
|
|
<Provider store={store}>
|
|
<App />
|
|
</Provider>
|
|
);
|
|
|
|
export default ImageBuilder;
|