@salesforce/pwa-kit-dev 3.1.0-preview.2 → 3.1.0-preview.4

package/bin/pwa-kit-dev.js

@@ -13,7 +13,6 @@ const WebSocket = require('ws')
 const program = require('commander')
 const validator = require('validator')
 const {execSync: _execSync} = require('child_process')
-const projectPkg = require(process.cwd() + '/package.json')
 const {getConfig} = require('@salesforce/pwa-kit-runtime/utils/ssr-config')
 
 // Scripts in ./bin have never gone through babel, so we
@@ -179,20 +178,18 @@ const main = async () => {
         })
 
     const appSSRpath = p.join(process.cwd(), 'app', 'ssr.js')
-    const appSSRjs = fse.pathExistsSync(appSSRpath)
+    const appSSRexists = fse.pathExistsSync(appSSRpath)
+    const {overridesDir} = scriptUtils.getProjectPkg()?.ccExtensibility ?? {}
     const overrideSSRpath = p.join(
         process.cwd(),
-        typeof projectPkg?.ccExtensibility?.overridesDir === 'string' &&
-            !projectPkg?.ccExtensibility?.overridesDir?.startsWith(p.sep)
-            ? p.sep + projectPkg?.ccExtensibility?.overridesDir
-            : projectPkg?.ccExtensibility?.overridesDir
-            ? projectPkg?.ccExtensibility?.overridesDir
-            : '',
+        typeof overridesDir === 'string' && !overridesDir?.startsWith(p.sep)
+            ? p.sep + overridesDir
+            : overridesDir || '',
         'app',
         'ssr.js'
     )
-    const overrideSSRjs = fse.pathExistsSync(overrideSSRpath)
-    const resolvedSSRPath = appSSRjs ? appSSRpath : overrideSSRjs ? overrideSSRpath : null
+    const overrideSSRexists = fse.pathExistsSync(overrideSSRpath)
+    const resolvedSSRPath = appSSRexists ? appSSRpath : overrideSSRexists ? overrideSSRpath : null
 
     program
         .command('start')

package/configs/webpack/overrides-plugin.test.js

@@ -323,7 +323,6 @@ describe('OverridePlugin.toOverrideRelative', () => {
 });
 describe('OverridePlugin.findFileFromMap', () => {
   let os;
-  let opts = options;
   let cases;
   if (_path.default.sep === '\\') {
     // WINDOWS test cases

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salesforce/pwa-kit-dev",
-  "version": "3.1.0-preview.2",
+  "version": "3.1.0-preview.4",
   "description": "Build tools for pwa-kit",
   "homepage": "https://github.com/SalesforceCommerceCloud/pwa-kit/tree/develop/packages/pwa-kit-dev#readme",
   "bugs": {
@@ -58,7 +58,7 @@
     "@loadable/server": "^5.15.3",
     "@loadable/webpack-plugin": "^5.15.2",
     "@pmmmwh/react-refresh-webpack-plugin": "^0.5.10",
-    "@salesforce/pwa-kit-runtime": "3.1.0-preview.2",
+    "@salesforce/pwa-kit-runtime": "3.1.0-preview.4",
     "@typescript-eslint/eslint-plugin": "^5.57.0",
     "@typescript-eslint/parser": "^5.57.0",
     "archiver": "1.3.0",
@@ -119,7 +119,7 @@
     "@types/node-fetch": "^2.6.3",
     "@types/validator": "^13.7.14",
     "eslint-plugin-no-relative-import-paths": "^1.5.2",
-    "internal-lib-build": "3.1.0-preview.2",
+    "internal-lib-build": "3.1.0-preview.4",
     "nock": "^13.3.0",
     "nodemon": "^2.0.22",
     "superagent": "^6.1.0",
@@ -148,5 +148,5 @@
   "publishConfig": {
     "directory": "dist"
   },
-  "gitHead": "3492171017c426688e11ae4c0d725d272e71ed0d"
+  "gitHead": "8ef8310dabf77dfdc50b76fbe2464f771c6a69c0"
 }

package/ssr/server/build-dev-server.js

@@ -43,6 +43,12 @@ const DevServerMixin = {
   _logStartupMessage(options) {
     console.log(`Starting the DevServer on ${_chalk.default.cyan(this._getDevServerURL(options))}`);
   },
+  /**
+   * @private
+   */
+  _getAllowCookies(options) {
+    return 'MRT_ALLOW_COOKIES' in process.env ? process.env.MRT_ALLOW_COOKIES === 'true' : options.localAllowCookies;
+  },
   /**
    * @private
    */
@@ -124,8 +130,10 @@ const DevServerMixin = {
     app.__devMiddleware = (0, _webpackDevMiddleware.default)(app.__compiler, {
       serverSideRender: true
     });
+    app.__isInitialBuild = true;
     app.__webpackReady = () => Boolean(app.__devMiddleware.context.state);
     app.__devMiddleware.waitUntilValid(() => {
+      app.__isInitialBuild = false;
       // Be just a little more generous before letting eg. Lighthouse hit it!
       setTimeout(() => {
         console.log(_chalk.default.cyan('First build complete'));
@@ -238,19 +246,25 @@ const DevServerMixin = {
   },
   render(req, res, next) {
     const app = req.app;
-    if (app.__webpackReady()) {
-      app.__hotServerMiddleware(req, res, next);
-    } else {
+    if (app !== null && app !== void 0 && app.__isInitialBuild) {
       this._redirectToLoadingScreen(req, res, next);
+    } else {
+      // Ensure that we do not try to render anything until the webpack bundle is valid.
+      // There was a bug previously where developers would refresh the page while webpack was building,
+      // causing them to get redirected to the loading page and sometimes getting stuck,
+      // requiring them to restart their dev server
+      app.__devMiddleware.waitUntilValid(() => {
+        app.__hotServerMiddleware(req, res, next);
+      });
     }
   },
   /**
    * @private
    */
-
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
   _redirectToLoadingScreen(req, res, next) {
-    res.redirect('/__mrt/loading-screen/index.html?loading=1');
+    const path = encodeURIComponent(req.originalUrl);
+    res.redirect(`/__mrt/loading-screen/index.html?loading=1&path=${path}`);
   },
   /**
    * @private

package/ssr/server/build-dev-server.test.js

@@ -129,9 +129,20 @@ describe('DevServer loading page', () => {
     const options = opts();
     const app = NoWebpackDevServerFactory._createApp(options);
     app.use('/', _buildDevServer.DevServerFactory._redirectToLoadingScreen);
+    const expectedPath = '/__mrt/loading-screen/index.html?loading=1&path=%2F';
     return (0, _supertest.default)(app).get('/').expect(302) // Expecting the 302 temporary redirect (not 301)
     .then(response => {
-      expect(response.headers.location).toBe('/__mrt/loading-screen/index.html?loading=1');
+      expect(response.headers.location).toBe(expectedPath);
+    });
+  }));
+  test('should contain path query parameter with encoded original url', /*#__PURE__*/_asyncToGenerator(function* () {
+    const options = opts();
+    const app = NoWebpackDevServerFactory._createApp(options);
+    app.use('/', _buildDevServer.DevServerFactory._redirectToLoadingScreen);
+    const originalUrl = '/global/en-GB/product/25519318M?color=JJ8UTXX&size=9MD&pid=701642923497M';
+    const expectedPath = `/__mrt/loading-screen/index.html?loading=1&path=${encodeURIComponent(originalUrl)}`;
+    return (0, _supertest.default)(app).get(originalUrl).then(response => {
+      expect(response.headers.location).toBe(expectedPath);
     });
   }));
 });
@@ -524,7 +535,10 @@ describe('DevServer rendering', () => {
     const req = {
       app: {
         __webpackReady: jest.fn().mockReturnValue(true),
-        __hotServerMiddleware: jest.fn()
+        __hotServerMiddleware: jest.fn(),
+        __devMiddleware: {
+          waitUntilValid: callback => callback()
+        }
       }
     };
     const res = {};
@@ -532,13 +546,13 @@ describe('DevServer rendering', () => {
     NoWebpackDevServerFactory.render(req, res, next);
     expect(req.app.__hotServerMiddleware).toHaveBeenCalledWith(req, res, next);
   });
-  test('redirects to loading screen when not ready', () => {
+  test('redirects to loading screen during the inital build', () => {
     const TestFactory = _objectSpread(_objectSpread({}, NoWebpackDevServerFactory), {}, {
       _redirectToLoadingScreen: jest.fn()
     });
     const req = {
       app: {
-        __webpackReady: jest.fn().mockReturnValue(false)
+        __isInitialBuild: true
       }
     };
     const res = {};

package/ssr/server/loading-screen/index.html

@@ -86,8 +86,9 @@
                 }
 
                 waitForReady().then(() => {
-                    // Redirect to homepage
-                    window.location = url.origin
+                    // Redirect to homepage if path is not defined
+                    const path = url.searchParams.get('path') ?? ''
+                    window.location = new URL(path, url.origin)
                 })
             }
 

package/utils/script-utils.js

@@ -186,6 +186,7 @@ const createBundle = /*#__PURE__*/function () {
     const tmpDir = yield (0, _promises.mkdtemp)(_path.default.join(_os.default.tmpdir(), 'pwa-kit-dev-'));
     const destination = _path.default.join(tmpDir, 'build.tar');
     const filesInArchive = [];
+    let bundle_metadata = {};
     if (ssr_only.length === 0 || ssr_shared.length === 0) {
       throw new Error('no ssrOnly or ssrShared files are defined');
     }
@@ -212,6 +213,14 @@ const createBundle = /*#__PURE__*/function () {
       archive.on('error', reject);
       output.on('finish', resolve);
       archive.finalize();
+    })).then( /*#__PURE__*/_asyncToGenerator(function* () {
+      const {
+        dependencies = {},
+        devDependencies = {}
+      } = yield getProjectPkg();
+      bundle_metadata = {
+        dependencies: _objectSpread(_objectSpread({}, dependencies), devDependencies)
+      };
     })).then(() => (0, _promises.readFile)(destination)).then(data => {
       const encoding = 'base64';
       return {
@@ -220,7 +229,8 @@ const createBundle = /*#__PURE__*/function () {
         data: data.toString(encoding),
         ssr_parameters,
         ssr_only: filesInArchive.filter(glob(ssr_only)),
-        ssr_shared: filesInArchive.filter(glob(ssr_shared))
+        ssr_shared: filesInArchive.filter(glob(ssr_shared)),
+        bundle_metadata
       };
     })
     // This is a false positive. The promise returned by `.finally()` won't resolve until
@@ -267,7 +277,7 @@ const getCredentialsFile = (cloudOrigin, credentialsFile) => {
 };
 exports.getCredentialsFile = getCredentialsFile;
 const readCredentials = /*#__PURE__*/function () {
-  var _ref4 = _asyncToGenerator(function* (filepath) {
+  var _ref5 = _asyncToGenerator(function* (filepath) {
     try {
       const data = yield (0, _fsExtra.readJson)(filepath);
       return {
@@ -279,7 +289,7 @@ const readCredentials = /*#__PURE__*/function () {
     }
   });
   return function readCredentials(_x2) {
-    return _ref4.apply(this, arguments);
+    return _ref5.apply(this, arguments);
   };
 }();
 exports.readCredentials = readCredentials;

package/utils/script-utils.test.js

@@ -7,19 +7,24 @@ var scriptUtils = _interopRequireWildcard(require("./script-utils"));
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
+function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
-function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
-function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; } /*
-                                                                                                                                                                                                                                                                                                                                                                                                       * Copyright (c) 2021, salesforce.com, inc.
-                                                                                                                                                                                                                                                                                                                                                                                                       * All rights reserved.
-                                                                                                                                                                                                                                                                                                                                                                                                       * SPDX-License-Identifier: BSD-3-Clause
-                                                                                                                                                                                                                                                                                                                                                                                                       * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
-                                                                                                                                                                                                                                                                                                                                                                                                       */
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); } /*
+                                                                                                                                                                                                                                                                                                                                                                                           * Copyright (c) 2021, salesforce.com, inc.
+                                                                                                                                                                                                                                                                                                                                                                                           * All rights reserved.
+                                                                                                                                                                                                                                                                                                                                                                                           * SPDX-License-Identifier: BSD-3-Clause
+                                                                                                                                                                                                                                                                                                                                                                                           * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
+                                                                                                                                                                                                                                                                                                                                                                                           */
 const pkg = (0, _fsExtra.readJsonSync)(_path.default.join(__dirname, '../package.json'));
+jest.mock('fs-extra', () => {
+  return _objectSpread(_objectSpread({}, jest.requireActual('fs-extra')), {}, {
+    readJson: jest.fn()
+  });
+});
 describe('scriptUtils', () => {
   const originalEnv = process.env;
   let tmpDir;
@@ -32,6 +37,7 @@ describe('scriptUtils', () => {
     tmpDir && (yield (0, _fsExtra.rm)(tmpDir, {
       recursive: true
     }));
+    jest.resetAllMocks();
   }));
   test('glob() with no patterns matches nothing', () => {
     const matcher = scriptUtils.glob();
@@ -77,6 +83,7 @@ describe('scriptUtils', () => {
       expect(client.getAuthHeader()).toEqual(expectedAuthHeader);
     }));
     test('getHeaders', /*#__PURE__*/_asyncToGenerator(function* () {
+      _fsExtra.readJson.mockReturnValue(pkg);
       const client = new scriptUtils.CloudAPIClient({
         credentials: {
           username,
@@ -88,10 +95,33 @@ describe('scriptUtils', () => {
       }, expectedAuthHeader));
     }));
   });
-  test('getPkgJSON', /*#__PURE__*/_asyncToGenerator(function* () {
-    const pkg = yield scriptUtils.getPkgJSON();
-    expect(pkg.name).toBe('@salesforce/pwa-kit-dev');
-  }));
+  describe('getPkgJSON', () => {
+    test('should work', /*#__PURE__*/_asyncToGenerator(function* () {
+      _fsExtra.readJson.mockReturnValue(pkg);
+      const pkgJson = yield scriptUtils.getPkgJSON();
+      expect(pkgJson.name).toBe('@salesforce/pwa-kit-dev');
+    }));
+    test('should return default package.json data when no valid file is found', /*#__PURE__*/_asyncToGenerator(function* () {
+      _fsExtra.readJson.mockRejectedValue(Error);
+      const result = yield scriptUtils.getPkgJSON();
+      expect(result).toEqual({
+        name: '@salesforce/pwa-kit-dev',
+        version: 'unknown'
+      });
+    }));
+  });
+  describe('getProjectPkg', () => {
+    test('should work', /*#__PURE__*/_asyncToGenerator(function* () {
+      _fsExtra.readJson.mockReturnValue(pkg);
+      const pkgJson = yield scriptUtils.getProjectPkg();
+      expect(pkgJson.name).toBe('@salesforce/pwa-kit-dev');
+    }));
+    test('should throw', /*#__PURE__*/_asyncToGenerator(function* () {
+      _fsExtra.readJson.mockRejectedValue(Error);
+      yield expect(scriptUtils.getProjectPkg()).rejects.toThrow(`Could not read project package at "${_path.default.join(process.cwd(), 'package.json')}"`);
+    }));
+  });
+  jest.unmock('fs-extra');
   describe('defaultMessage', () => {
     test('works', /*#__PURE__*/_asyncToGenerator(function* () {
       const mockGit = {
@@ -128,6 +158,10 @@ describe('scriptUtils', () => {
   }));
   describe('readCredentials', () => {
     test('should work', /*#__PURE__*/_asyncToGenerator(function* () {
+      _fsExtra.readJson.mockReturnValue({
+        username: 'alice',
+        api_key: 'xyz'
+      });
       const creds = {
         username: 'alice',
         api_key: 'xyz'
@@ -169,6 +203,7 @@ describe('scriptUtils', () => {
       })).rejects.toThrow('Build directory at path');
     }));
     test('should archive a bundle', /*#__PURE__*/_asyncToGenerator(function* () {
+      _fsExtra.readJson.mockReturnValue(pkg);
       const message = 'message';
       const bundle = yield scriptUtils.createBundle({
         message,
@@ -205,12 +240,13 @@ describe('scriptUtils', () => {
       expectedURL: 'https://cloud.mobify.com/api/projects/project-slug/builds/',
       status: 401
     }]])('should push a built bundle and handle status codes (%p)', /*#__PURE__*/function () {
-      var _ref18 = _asyncToGenerator(function* ({
+      var _ref21 = _asyncToGenerator(function* ({
         projectSlug,
         targetSlug,
         expectedURL,
         status
       }) {
+        _fsExtra.readJson.mockReturnValue(pkg);
         const message = 'message';
         const bundle = yield scriptUtils.createBundle({
           message,
@@ -247,11 +283,11 @@ describe('scriptUtils', () => {
           fetch: fetchMock
         });
         const fn = /*#__PURE__*/function () {
-          var _ref20 = _asyncToGenerator(function* () {
+          var _ref23 = _asyncToGenerator(function* () {
             return yield client.push(bundle, projectSlug, targetSlug);
           });
           return function fn() {
-            return _ref20.apply(this, arguments);
+            return _ref23.apply(this, arguments);
           };
         }();
 
@@ -275,8 +311,83 @@ describe('scriptUtils', () => {
         }));
       });
       return function (_x) {
-        return _ref18.apply(this, arguments);
+        return _ref21.apply(this, arguments);
       };
     }());
   });
+  describe('createLoggingToken', () => {
+    const username = 'user123';
+    const api_key = '123';
+    test('createLoggingToken passes', /*#__PURE__*/_asyncToGenerator(function* () {
+      _fsExtra.readJson.mockReturnValue(pkg);
+      const projectSlug = 'project-slug';
+      const targetSlug = 'target-slug';
+      const text = () => Promise.resolve(JSON.stringify({
+        token: 'token-value'
+      }));
+      const json = () => Promise.resolve({
+        token: 'token-value'
+      });
+      const fetchMock = jest.fn( /*#__PURE__*/_asyncToGenerator(function* () {
+        return {
+          status: 200,
+          text,
+          json
+        };
+      }));
+      const client = new scriptUtils.CloudAPIClient({
+        credentials: {
+          username,
+          api_key
+        },
+        fetch: fetchMock
+      });
+      const fn = /*#__PURE__*/function () {
+        var _ref26 = _asyncToGenerator(function* () {
+          return yield client.createLoggingToken(projectSlug, targetSlug);
+        });
+        return function fn() {
+          return _ref26.apply(this, arguments);
+        };
+      }();
+      expect(yield fn()).toBe('token-value');
+      expect(fetchMock).toHaveBeenCalledTimes(1);
+      expect(fetchMock).toHaveBeenCalledWith('https://cloud.mobify.com/api/projects/project-slug/target/target-slug/jwt/', expect.objectContaining({
+        method: 'POST',
+        headers: {
+          Authorization: expect.stringMatching(/^Bearer /),
+          'User-Agent': `${pkg.name}@${pkg.version}`
+        }
+      }));
+    }));
+  });
+  describe('parseLog', () => {
+    it('correctly parses an application log', () => {
+      const log = '2023-07-15T10:00:00Z\t550e8400-e29b-41d4-a716-446655440000\tINFO\tThis is a test log message';
+      const result = scriptUtils.parseLog(log);
+      expect(result).toEqual({
+        level: 'INFO',
+        message: 'This is a test log message',
+        shortRequestId: '550e8400'
+      });
+    });
+    it('correctly parses a platform log', () => {
+      const log = 'WARN\tThis is a test log message';
+      const result = scriptUtils.parseLog(log);
+      expect(result).toEqual({
+        level: 'WARN',
+        message: '\tThis is a test log message',
+        shortRequestId: undefined
+      });
+    });
+    it('finds the shortRequestId in the message if not present in the request id', () => {
+      const log = 'INFO\tThis is a test log message 550e8400';
+      const result = scriptUtils.parseLog(log);
+      expect(result).toEqual({
+        level: 'INFO',
+        message: '\tThis is a test log message 550e8400',
+        shortRequestId: '550e8400'
+      });
+    });
+  });
 });