fix(client): add default fallback for client

client-src/default/socket.js

@@ -4,7 +4,21 @@
 /* eslint-disable
   camelcase
 */
-const Client = __webpack_dev_server_client__;
+
+let Client;
+try {
+  // if __webpack_dev_server_client__ is undefined, we should fall back
+  // to SockJSClient
+  Client = __webpack_dev_server_client__;
+} catch (e) {
+  // this SockJSClient is here as a default fallback, in case inline mode
+  // is off or the client is not injected. This will be switched to
+  // WebsocketClient when it becomes the default
+
+  // eslint-disable-next-line global-require
+  const SockJSClient = require('../clients/SockJSClient');
+  Client = SockJSClient;
+}
 
 let retries = 0;
 let client = null;

lib/utils/addEntries.js

@@ -20,7 +20,7 @@ function addEntries(config, options, server) {
     const sockPath = options.sockPath ? `&sockPath=${options.sockPath}` : '';
     const sockPort = options.sockPort ? `&sockPort=${options.sockPort}` : '';
     const clientEntry = `${require.resolve(
-      '../../client/'
+      '../../client/default/'
     )}?${domain}${sockHost}${sockPath}${sockPort}`;
     let hotEntry;
 

package.json

@@ -25,7 +25,7 @@
     "test": "npm run test:coverage",
     "pretest": "npm run lint",
     "prepare": "rimraf ./ssl/*.pem && npm run build:client",
-    "build:client:default": "babel client-src/default --out-dir client --ignore \"./client-src/default/*.config.js\"",
+    "build:client:default": "babel client-src/default --out-dir client/default --ignore \"./client-src/default/*.config.js\"",
     "build:client:clients": "babel client-src/clients --out-dir client/clients",
     "build:client:index": "webpack ./client-src/default/index.js -o client/index.bundle.js --color --config client-src/default/webpack.config.js",
     "build:client:live": "webpack ./client-src/live/index.js -o client/live.bundle.js --color --config client-src/live/webpack.config.js",

test/e2e/ClientOptions.test.js

@@ -158,7 +158,7 @@ describe('Client complex inline script path with sockPort', () => {
 });
 
 // previously, using sockPort without sockPath had the ability
-// to alter the sockPath (based on a bug in client-src/index.js)
+// to alter the sockPath (based on a bug in client-src/default/index.js)
 // so we need to make sure sockPath is not altered in this case
 describe('Client complex inline script path with sockPort, no sockPath', () => {
   beforeAll((done) => {

test/server/__snapshots__/Server.test.js.snap

@@ -4,6 +4,7 @@ exports[`Server addEntries add hot option 1`] = `
 Array [
   Array [
     "client",
+    "default",
     "index.js?http:",
     "localhost:8090",
   ],
@@ -34,6 +35,7 @@ exports[`Server addEntries add hotOnly option 1`] = `
 Array [
   Array [
     "client",
+    "default",
     "index.js?http:",
     "localhost:8090",
   ],

test/server/inline-option.test.js

@@ -27,7 +27,9 @@ describe('inline option', () => {
     afterAll(testServer.close);
 
     it('should include inline client script in the bundle', (done) => {
-      const url = new RegExp(`client/index.js\\?http://0.0.0.0:${port}`);
+      const url = new RegExp(
+        `client/default/index.js\\?http://0.0.0.0:${port}`
+      );
 
       req.get('/main.js').expect(200, url, done);
     });
@@ -54,7 +56,9 @@ describe('inline option', () => {
     afterAll(testServer.close);
 
     it('should include inline client script in the bundle', (done) => {
-      const url = new RegExp(`client/index.js\\?http://0.0.0.0:${port}`);
+      const url = new RegExp(
+        `client/default/index.js\\?http://0.0.0.0:${port}`
+      );
 
       req.get('/main.js').expect(200, url, done);
     });
@@ -81,7 +85,9 @@ describe('inline option', () => {
         .get('/main.js')
         .expect(200)
         .then(({ text }) => {
-          expect(text.includes(`client/index.js?http://0.0.0.0:${port}`));
+          expect(
+            text.includes(`client/default/index.js?http://0.0.0.0:${port}`)
+          );
           done();
         });
     });

test/server/utils/addEntries.test.js

@@ -17,7 +17,8 @@ describe('addEntries util', () => {
 
     expect(webpackOptions.entry.length).toEqual(2);
     expect(
-      normalize(webpackOptions.entry[0]).indexOf('client/index.js?') !== -1
+      normalize(webpackOptions.entry[0]).indexOf('client/default/index.js?') !==
+        -1
     ).toBeTruthy();
     expect(normalize(webpackOptions.entry[1])).toEqual('./foo.js');
   });
@@ -33,7 +34,8 @@ describe('addEntries util', () => {
 
     expect(webpackOptions.entry.length).toEqual(3);
     expect(
-      normalize(webpackOptions.entry[0]).indexOf('client/index.js?') !== -1
+      normalize(webpackOptions.entry[0]).indexOf('client/default/index.js?') !==
+        -1
     ).toBeTruthy();
     expect(webpackOptions.entry[1]).toEqual('./foo.js');
     expect(webpackOptions.entry[2]).toEqual('./bar.js');
@@ -54,7 +56,9 @@ describe('addEntries util', () => {
     expect(webpackOptions.entry.foo.length).toEqual(2);
 
     expect(
-      normalize(webpackOptions.entry.foo[0]).indexOf('client/index.js?') !== -1
+      normalize(webpackOptions.entry.foo[0]).indexOf(
+        'client/default/index.js?'
+      ) !== -1
     ).toBeTruthy();
     expect(webpackOptions.entry.foo[1]).toEqual('./foo.js');
     expect(webpackOptions.entry.bar[1]).toEqual('./bar.js');
@@ -292,7 +296,9 @@ describe('addEntries util', () => {
 
       if (expectInline) {
         expect(
-          normalize(webpackOptions.entry[0]).indexOf('client/index.js?') !== -1
+          normalize(webpackOptions.entry[0]).indexOf(
+            'client/default/index.js?'
+          ) !== -1
         ).toBeTruthy();
       }
 
@@ -324,7 +330,9 @@ describe('addEntries util', () => {
 
       if (expectInline) {
         expect(
-          normalize(webpackOptions.entry[0]).indexOf('client/index.js?') !== -1
+          normalize(webpackOptions.entry[0]).indexOf(
+            'client/default/index.js?'
+          ) !== -1
         ).toBeTruthy();
       }
 
@@ -380,7 +388,9 @@ describe('addEntries util', () => {
     expect(webWebpackOptions.entry.length).toEqual(2);
 
     expect(
-      normalize(webWebpackOptions.entry[0]).indexOf('client/index.js?') !== -1
+      normalize(webWebpackOptions.entry[0]).indexOf(
+        'client/default/index.js?'
+      ) !== -1
     ).toBeTruthy();
 
     expect(normalize(webWebpackOptions.entry[1])).toEqual('./foo.js');