@salesforce/pwa-kit-react-sdk 3.8.0-preview.0-basepath → 3.8.0-preview.0

package/ssr/universal/components/route-component/index.test.js

@@ -0,0 +1,378 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+var _react2 = require("@testing-library/react");
+var _index = require("./index");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); }
+function _asyncToGenerator(n) { return function () { var t = this, e = arguments; return new Promise(function (r, o) { var a = n.apply(t, e); function _next(n) { asyncGeneratorStep(a, r, o, _next, _throw, "next", n); } function _throw(n) { asyncGeneratorStep(a, r, o, _next, _throw, "throw", n); } _next(void 0); }); }; } /*
+ * 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
+ */
+// TODO: The way mocks are set up in this file is kinda weird...
+/* eslint-disable @typescript-eslint/no-var-requires */
+
+const delay = t => new Promise(resolve => setTimeout(resolve, t));
+
+/**
+ * Return a mock that returns true, false, false, false, which is what
+ * we want when testing shouldGetProps – always returning true would cause
+ * an infinite loop.
+ */
+const trueOnceThenFalse = () => jest.fn().mockReturnValue(false).mockReturnValueOnce(true);
+const falseOnceThenTrue = () => jest.fn().mockReturnValue(true).mockReturnValueOnce(false);
+jest.mock('../_app-config', () => {
+  const React = require('react');
+  const PropTypes = require('prop-types');
+  const MockAppConfig = () => /*#__PURE__*/React.createElement("h1", null, "MockAppConfig");
+  MockAppConfig.freeze = jest.fn(() => ({
+    frozen: 'frozen'
+  }));
+  MockAppConfig.restore = jest.fn(() => undefined);
+  MockAppConfig.extraGetPropsArgs = jest.fn(() => ({
+    anotherArg: 'anotherArg'
+  }));
+  MockAppConfig.propTypes = {
+    children: PropTypes.node
+  };
+  return {
+    __esModule: true,
+    default: MockAppConfig
+  };
+});
+jest.mock('../../routes', () => {
+  const React = require('react');
+  const PropTypes = require('prop-types');
+  const Component = ({
+    children
+  }) => /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h1", null, "This is the root"), children);
+  Component.propTypes = {
+    children: PropTypes.node
+  };
+  return [{
+    path: '',
+    component: Component,
+    exact: true
+  }];
+});
+
+// NOTE: `react-router-dom` is being mocked because I was not able to get around the
+// issue where you can't use a `withRoute` HoC outside of a Router component for this
+// specific test. TODO: Revisit this, so that we don't have to mock `react-router-dom`
+jest.mock('react-router-dom', () => {
+  const React = require('react');
+  const hoistNonReactStatic = require('hoist-non-react-statics');
+  const withRouter = Wrapped => {
+    const wrappedComponentName = Wrapped.displayName || Wrapped.name;
+    const WithRouter = props => /*#__PURE__*/React.createElement(Wrapped, props);
+    hoistNonReactStatic(WithRouter, Wrapped);
+    WithRouter.displayName = `withRouter(${wrappedComponentName})`;
+    return WithRouter;
+  };
+  return {
+    __esModule: true,
+    default: {},
+    withRouter
+  };
+});
+const getMockComponent = () => {
+  const MockComponent = () => /*#__PURE__*/_react.default.createElement("p", null, "MockComponent");
+  MockComponent.displayName = 'MockComponent';
+  MockComponent.shouldGetProps = trueOnceThenFalse();
+  MockComponent.getProps = jest.fn(() => {
+    return Promise.resolve();
+  });
+  MockComponent.getTemplateName = jest.fn(() => 'MockComponent');
+  return MockComponent;
+};
+beforeEach(() => {
+  delete global.__HYDRATING__;
+});
+describe('The routeComponent component', () => {
+  test('Is a higher-order component', () => {
+    const Mock = getMockComponent();
+    const Component = (0, _index.routeComponent)(Mock);
+    (0, _react2.render)( /*#__PURE__*/_react.default.createElement(Component, {
+      isHydrating: false
+    }));
+    expect(_react2.screen.getByText(/mockComponent/i)).toBeInTheDocument();
+  });
+  test('Should call getProps on components at the right times during updates/rendering', () => {
+    const Mock = getMockComponent();
+    const Component = (0, _index.routeComponent)(Mock);
+    Component.displayName = 'routeComponent';
+    expect(Mock.shouldGetProps.mock.calls).toHaveLength(0);
+    expect(Mock.getProps.mock.calls).toHaveLength(0);
+    let wrapper;
+    return Promise.resolve().then(() => {
+      // Mock Hydrating Start
+      global.__HYDRATING__ = true;
+    }).then(() => {
+      // Simulate the initial client-side mount (hydrating=true)
+      return new Promise(resolve => {
+        wrapper = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(Component, {
+          history: {
+            location: {
+              pathname: '/home/'
+            }
+          },
+          onUpdateComplete: resolve
+        }));
+      });
+    }).then(() => {
+      expect(Mock.shouldGetProps.mock.calls).toHaveLength(0);
+      expect(Mock.getProps.mock.calls).toHaveLength(0);
+    }).then(() => {
+      // Mock Hydrating Complete
+      global.__HYDRATING__ = false;
+    }).then(() => {
+      // Simulate visiting a different URL, which should trigger shouldMount() and getProps()
+      return new Promise(resolve => {
+        wrapper.rerender( /*#__PURE__*/_react.default.createElement(Component, {
+          history: {
+            location: {
+              pathname: '/plp/'
+            }
+          },
+          onUpdateComplete: resolve
+        }));
+      });
+    }).then(() => {
+      expect(Mock.shouldGetProps.mock.calls).toHaveLength(1);
+      expect(Mock.getProps.mock.calls).toHaveLength(1);
+    });
+  });
+  test('Provides defaults for getProps(), shouldGetProps() and getTemplateName()', () => {
+    const ComponentWithoutStatics = () => /*#__PURE__*/_react.default.createElement("p", null, "ComponentWithoutStatics");
+    const Component = (0, _index.routeComponent)(ComponentWithoutStatics);
+    const l1 = {
+      pathname: '/location-one/'
+    };
+    const l2 = {
+      pathname: '/location-two/'
+    };
+    const checks = [Component.shouldGetProps({
+      previousLocation: l1,
+      location: l1
+    }).then(v => expect(v).toBe(false)), Component.shouldGetProps({
+      previousLocation: l1,
+      location: l2
+    }).then(v => expect(v).toBe(true)), Component.getTemplateName().then(v => expect(v).toBe('ComponentWithoutStatics')), Component.getProps().then(result => expect(result).toBeUndefined())];
+    expect.assertions(checks.length);
+    return Promise.all(checks);
+  });
+  test('Allows the wrapped component to override getProps(), shouldGetProps and getTemplateName()', () => {
+    class Mock extends _react.default.Component {
+      static shouldGetProps({
+        location
+      }) {
+        return location.pathname === '/should-get-props/';
+      }
+      static getProps() {
+        return Promise.resolve('overridden-get-props');
+      }
+      static getTemplateName() {
+        return 'overriden-template-name';
+      }
+      render() {
+        return /*#__PURE__*/_react.default.createElement("div", null, "Mock");
+      }
+    }
+    const Component = (0, _index.routeComponent)(Mock);
+    const l1 = {
+      pathname: '/location-one/'
+    };
+    const l2 = {
+      pathname: '/location-two/'
+    };
+    const l3 = {
+      pathname: '/should-get-props/'
+    };
+    const checks = [Component.shouldGetProps({
+      previousLocation: l1,
+      location: l1
+    }).then(v => expect(v).toBe(false)), Component.shouldGetProps({
+      previousLocation: l1,
+      location: l2
+    }).then(v => expect(v).toBe(false)), Component.shouldGetProps({
+      previousLocation: l1,
+      location: l3
+    }).then(v => expect(v).toBe(true)), Component.getTemplateName().then(v => expect(v).toBe('overriden-template-name')), Component.getProps().then(v => expect(v).toBe('overridden-get-props'))];
+    expect.assertions(checks.length);
+    return Promise.all(checks);
+  });
+  test(`Catches and calls onGetPropsError() when getProps throws`, () => {
+    const error = 'throwErrorText';
+    const Mock = () => /*#__PURE__*/_react.default.createElement("div", null, "Mock");
+    Mock.shouldGetProps = trueOnceThenFalse();
+    Mock.getProps = () => {
+      throw error;
+    };
+    const Component = (0, _index.routeComponent)(Mock, {}, true);
+    return new Promise(resolve => (0, _react2.render)( /*#__PURE__*/_react.default.createElement(Component, {
+      isHydrating: false,
+      onGetPropsError: resolve
+    }))).then(caught => expect(caught).toBe(error));
+  });
+  test(`Catches and calls onGetPropsError() when getProps rejects`, () => {
+    const errorText = 'rejectErrorText';
+    const Mock = () => /*#__PURE__*/_react.default.createElement("div", null, "Mock");
+    Mock.shouldGetProps = trueOnceThenFalse();
+    Mock.getProps = () => delay(10).then(() => Promise.reject(errorText));
+    const Component = (0, _index.routeComponent)(Mock);
+    return new Promise(resolve => (0, _react2.render)( /*#__PURE__*/_react.default.createElement(Component, {
+      isHydrating: false,
+      onGetPropsError: resolve
+    }))).then(caught => expect(caught).toBe(errorText));
+  });
+  test(`Passes props returned from getProps to the wrapped component`, /*#__PURE__*/_asyncToGenerator(function* () {
+    const initialProps = {
+      foo: 'bar'
+    };
+    const Mock = props => /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", {
+      "data-testid": "props"
+    }, JSON.stringify(props)));
+    Mock.displayName = 'MockComponent';
+    Mock.getProps = () => delay(150).then(() => initialProps);
+    Mock.shouldGetProps = trueOnceThenFalse();
+    const Component = (0, _index.routeComponent)(Mock, {}, true);
+    yield new Promise(resolve => {
+      (0, _react2.render)( /*#__PURE__*/_react.default.createElement(Component, {
+        onUpdateComplete: () => {
+          resolve();
+        }
+      }));
+    });
+    yield (0, _react2.waitFor)(() => {
+      expect(_react2.screen.getByTestId('props').innerHTML).toEqual(JSON.stringify({
+        foo: 'bar',
+        isLoading: false
+      }));
+    });
+  }));
+});
+describe('getRoutes', () => {
+  test('wraps components with the routeComponent HOC', () => {
+    const mappedRoutes = (0, _index.getRoutes)();
+    expect(mappedRoutes).toHaveLength(3);
+    const [first, second, third] = mappedRoutes;
+    const expectedRefetchName = 'WithErrorHandling(withRouter(routeComponent(Refresh)))';
+    expect(first.component.displayName).toBe(expectedRefetchName);
+    const expectedName = 'WithErrorHandling(withRouter(routeComponent(Component)))';
+    expect(second.component.displayName).toBe(expectedName);
+    const expected404Name = 'WithErrorHandling(withRouter(routeComponent(Throw404)))';
+    expect(third.component.displayName).toBe(expected404Name);
+  });
+});
+
+/**
+ * A race condition is created when a user clicks two links for the same
+ * component. If the getProps call for the second link resolves before the
+ * first, we want to make sure the results of the first are ignored. In this
+ * test we rerender returned from first rendering twice to trigger getProps calls and make sure only the
+ * second one updates the component.
+ */
+describe('Handles race conditions for getProps', () => {
+  test(`unresolved calls to 'getProps' are squashed by new new calls`, /*#__PURE__*/_asyncToGenerator(function* () {
+    const renderFunc = jest.fn();
+
+    // We can't inspect the render directly, so include this mock function
+    // in the render and inspect that
+    // eslint-disable-next-line react/prop-types
+    const MockComponent = ({
+      callId
+    }) => /*#__PURE__*/_react.default.createElement("p", null, renderFunc(callId));
+    // Skip getProps on mount by returning false the first time
+    MockComponent.shouldGetProps = falseOnceThenTrue();
+    MockComponent.getProps = jest.fn().mockImplementationOnce(() => Promise.resolve({
+      callId: 1
+    })).mockImplementationOnce(() => Promise.resolve({
+      callId: 2
+    }));
+    const Component = (0, _index.routeComponent)(MockComponent, {}, true);
+    let resolver = [];
+    let wrapper;
+    const onUpdateComplete = () => {
+      const r = resolver.pop();
+      if (r) {
+        r(wrapper);
+      }
+    };
+    yield new Promise(resolve => {
+      resolver.push(resolve);
+      wrapper = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(Component, {
+        onUpdateComplete: onUpdateComplete
+      }));
+    });
+
+    // Update the wrappers props 2 times in succession, this will cause `getProps` to be called
+    // twice, but only the later should call `setStateAsync` causing a re-render.
+    const p1 = new Promise(resolve => {
+      resolver.push(resolve);
+      wrapper.rerender( /*#__PURE__*/_react.default.createElement(Component, {
+        onUpdateComplete: onUpdateComplete
+      }));
+    });
+    const p2 = new Promise(resolve => {
+      resolver.push(resolve);
+      wrapper.rerender( /*#__PURE__*/_react.default.createElement(Component, {
+        onUpdateComplete: onUpdateComplete
+      }));
+    });
+    yield Promise.all([p1, p2]);
+    expect(MockComponent.getProps.mock.calls).toHaveLength(2);
+    expect(renderFunc).not.toHaveBeenCalledWith(1);
+    expect(renderFunc).toHaveBeenCalledWith(2);
+  }));
+});
+describe('Uses preloaded props on initial clientside page load', () => {
+  test('Uses preloadedProps when hydrating', /*#__PURE__*/_asyncToGenerator(function* () {
+    global.__HYDRATING__ = true;
+    const preloadedProps = {
+      foo: 'bar'
+    };
+    const expectedPreloadedChildProps = {
+      foo: 'bar',
+      isLoading: false
+    };
+    const Mock = props => /*#__PURE__*/_react.default.createElement("div", {
+      "data-testid": "props"
+    }, JSON.stringify(props));
+    Mock.displayName = 'MockComponent';
+    const Component = (0, _index.routeComponent)(Mock, true, {});
+    yield new Promise(resolve => {
+      const wrapper = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(Component, {
+        preloadedProps: preloadedProps,
+        onUpdateComplete: () => resolve(wrapper)
+      }));
+    });
+    yield (0, _react2.waitFor)(() => {
+      expect(_react2.screen.getByTestId('props').innerHTML).toEqual(JSON.stringify(expectedPreloadedChildProps));
+    });
+  }));
+  test('Does not use preloadedProps when not hydrating', /*#__PURE__*/_asyncToGenerator(function* () {
+    global.__HYDRATING__ = false;
+    const preloadedProps = {
+      foo: 'bar'
+    };
+    const expectedNotPreloadedChildProps = {
+      isLoading: false
+    };
+    const Mock = props => /*#__PURE__*/_react.default.createElement("div", {
+      "data-testid": "props"
+    }, JSON.stringify(props));
+    Mock.displayName = 'MockComponent';
+    const Component = (0, _index.routeComponent)(Mock, true, {});
+    yield new Promise(resolve => {
+      const wrapper = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(Component, {
+        preloadedProps: preloadedProps,
+        onUpdateComplete: () => resolve(wrapper)
+      }));
+    });
+    yield (0, _react2.waitFor)(() => {
+      expect(_react2.screen.getByTestId('props').innerHTML).toEqual(JSON.stringify(expectedNotPreloadedChildProps));
+    });
+  }));
+});

package/ssr/universal/components/switch/index.js

@@ -0,0 +1,62 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _reactRouterDom = require("react-router-dom");
+var _appErrorBoundary = _interopRequireDefault(require("../app-error-boundary"));
+var _reactUid = require("react-uid");
+const _excluded = ["component"];
+/*
+ * 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 _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], t.indexOf(o) >= 0 || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.indexOf(n) >= 0) continue; t[n] = r[n]; } return t; }
+/**
+ * The Switch component packages up the bits of rendering that are shared between
+ * server and client-side. It's *mostly* a react-router Switch component, hence the
+ * name.
+ *
+ * This is for internal use only.
+ *
+ * @private
+ */
+const Switch = props => {
+  const {
+    error,
+    appState,
+    routes,
+    App
+  } = props;
+  return /*#__PURE__*/_react.default.createElement(_reactUid.UIDReset, null, /*#__PURE__*/_react.default.createElement(_appErrorBoundary.default, {
+    error: error
+  }, !error && /*#__PURE__*/_react.default.createElement(App, {
+    preloadedProps: appState.appProps
+  }, /*#__PURE__*/_react.default.createElement(_reactRouterDom.Switch, null, routes.map((route, i) => {
+    const {
+        component: Component
+      } = route,
+      routeProps = _objectWithoutProperties(route, _excluded);
+    return /*#__PURE__*/_react.default.createElement(_reactRouterDom.Route, _extends({
+      key: i
+    }, routeProps), /*#__PURE__*/_react.default.createElement(_reactUid.UIDFork, null, /*#__PURE__*/_react.default.createElement(Component, {
+      preloadedProps: appState.pageProps
+    })));
+  })))));
+};
+Switch.propTypes = {
+  error: _propTypes.default.object,
+  appState: _propTypes.default.object,
+  routes: _propTypes.default.array,
+  App: _propTypes.default.func,
+  preloadedProps: _propTypes.default.object
+};
+var _default = exports.default = Switch;

package/ssr/universal/components/throw-404/index.js

@@ -0,0 +1,36 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var errors = _interopRequireWildcard(require("../../errors"));
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+/*
+ * 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
+ */
+
+/**
+ * This is designed to be put into a react-router config as a fallback
+ * with path="*", simply to trigger the normal error handling code we have.
+ * As a result, this component should never be rendered – it should
+ * trigger the error page instead.
+ *
+ * @private
+ */
+class Throw404 extends _react.default.Component {
+  static getProps() {
+    throw new errors.HTTPNotFound('Not found');
+  }
+  render() {
+    // This should be unreachable
+    return /*#__PURE__*/_react.default.createElement("div", null);
+  }
+}
+var _default = exports.default = Throw404;

package/ssr/universal/components/throw-404/index.test.js

@@ -0,0 +1,26 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+var _react2 = require("@testing-library/react");
+var _index = _interopRequireDefault(require("./index"));
+var errors = _interopRequireWildcard(require("../../errors"));
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+/*
+ * 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
+ */
+
+describe('Throw404', () => {
+  test('Renders correctly', () => {
+    (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_index.default, null));
+    const content = document.querySelector('body').firstElementChild.innerHTML;
+    expect(content).toBe('<div></div>');
+  });
+  test('Throws on getProps', () => {
+    expect(() => _index.default.getProps()).toThrow(errors.HTTPNotFound);
+  });
+});

package/ssr/universal/components/with-correlation-id/index.js

@@ -0,0 +1,36 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.withCorrelationId = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _hooks = require("../../hooks");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _objectDestructuringEmpty(t) { if (null == t) throw new TypeError("Cannot destructure " + t); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } /*
+ * Copyright (c) 2022, 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
+ */
+/**
+ * An HOC that injects the correlation id to a component
+ * @param Component
+ *
+ */
+const withCorrelationId = Component => {
+  const wrappedComponentName = Component.displayName || Component.name;
+  const WrappedComponent = _ref => {
+    let passThroughProps = _extends({}, (_objectDestructuringEmpty(_ref), _ref));
+    const {
+      correlationId
+    } = (0, _hooks.useCorrelationId)();
+    return /*#__PURE__*/_react.default.createElement(Component, _extends({}, passThroughProps, {
+      correlationId: correlationId
+    }));
+  };
+  WrappedComponent.displayName = `withCorrelationId(${wrappedComponentName})`;
+  return WrappedComponent;
+};
+exports.withCorrelationId = withCorrelationId;

package/ssr/universal/components/with-legacy-get-props/index.js

@@ -0,0 +1,100 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.withLegacyGetProps = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _hoistNonReactStatics = _interopRequireDefault(require("hoist-non-react-statics"));
+var _fetchStrategy = require("../fetch-strategy");
+var _performance = require("../../../../utils/performance");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); }
+function _asyncToGenerator(n) { return function () { var t = this, e = arguments; return new Promise(function (r, o) { var a = n.apply(t, e); function _next(n) { asyncGeneratorStep(a, r, o, _next, _throw, "next", n); } function _throw(n) { asyncGeneratorStep(a, r, o, _next, _throw, "throw", n); } _next(void 0); }); }; } /*
+ * Copyright (c) 2022, Salesforce, 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 withLegacyGetProps = Wrapped => {
+  /* istanbul ignore next */
+  const wrappedComponentName = Wrapped.displayName || Wrapped.name;
+
+  /**
+   * @private
+   */
+  class WithLegacyGetProps extends _fetchStrategy.FetchStrategy {
+    render() {
+      return /*#__PURE__*/_react.default.createElement(Wrapped, this.props);
+    }
+
+    /**
+     * @private
+     */
+    static doInitAppState({
+      App,
+      match,
+      route,
+      req,
+      res,
+      location
+    }) {
+      return _asyncToGenerator(function* () {
+        const {
+          params
+        } = match;
+        const components = [App, route.component];
+        const promises = components.map((c, i) => {
+          // getTemplateName is a promise and it's intentially not awaited here
+          // to avoid blocking the execution of the getProps function to maximize performance
+          // getTemplateName should be very fast, under 0.2ms
+          c.getTemplateName().then(templateName => {
+            res.__performanceTimer.mark(`${_performance.PERFORMANCE_MARKS.getProps}::${templateName}`, 'start');
+          });
+          return c.getProps ? c.getProps({
+            req,
+            res,
+            params,
+            location
+          }).then(result => {
+            c.getTemplateName().then(templateName => {
+              res.__performanceTimer.mark(`${_performance.PERFORMANCE_MARKS.getProps}::${templateName}`, 'end');
+            });
+            return result;
+          }) : Promise.resolve({});
+        });
+        const [appProps, pageProps] = yield Promise.all(promises);
+        return {
+          appProps,
+          pageProps
+        };
+      })();
+    }
+
+    /**
+     * @private
+     */
+    static getInitializers() {
+      var _Wrapped$getInitializ;
+      return [WithLegacyGetProps.doInitAppState, ...(((_Wrapped$getInitializ = Wrapped.getInitializers) === null || _Wrapped$getInitializ === void 0 ? void 0 : _Wrapped$getInitializ.call(Wrapped)) ?? [])];
+    }
+
+    /**
+     * @private
+     */
+    static getHOCsInUse() {
+      var _Wrapped$getHOCsInUse;
+      return [withLegacyGetProps, ...(((_Wrapped$getHOCsInUse = Wrapped.getHOCsInUse) === null || _Wrapped$getHOCsInUse === void 0 ? void 0 : _Wrapped$getHOCsInUse.call(Wrapped)) ?? [])];
+    }
+  }
+  WithLegacyGetProps.displayName = `withLegacyGetProps(${wrappedComponentName})`;
+  const exclude = {
+    doInitAppState: true,
+    getInitializers: true,
+    initAppState: true,
+    getHOCsInUse: true
+  };
+  (0, _hoistNonReactStatics.default)(WithLegacyGetProps, Wrapped, exclude);
+  return WithLegacyGetProps;
+};
+exports.withLegacyGetProps = withLegacyGetProps;

package/ssr/universal/components/with-legacy-get-props/index.test.js

@@ -0,0 +1,35 @@
+"use strict";
+
+var _index = require("./index");
+var _react = require("@testing-library/react");
+var _react2 = _interopRequireDefault(require("react"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+/*
+ * Copyright (c) 2022, Salesforce, 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
+ */
+
+describe('withLegacyGetProps', function () {
+  test('Renders correctly', () => {
+    const Wrapped = () => /*#__PURE__*/_react2.default.createElement("p", null, "Hello world");
+    const Component = (0, _index.withLegacyGetProps)(Wrapped);
+    (0, _react.render)( /*#__PURE__*/_react2.default.createElement(Component, {
+      locals: {}
+    }));
+    expect(_react.screen.getByText(/Hello world/i)).toBeInTheDocument();
+  });
+  test(`Has working getInitializers method`, () => {
+    expect((0, _index.withLegacyGetProps)({}).getInitializers()).toHaveLength(1);
+    expect((0, _index.withLegacyGetProps)({
+      getInitializers: () => ['xyz']
+    }).getInitializers()).toHaveLength(2);
+  });
+  test(`Has working getHOCsInUse method`, () => {
+    expect((0, _index.withLegacyGetProps)({}).getHOCsInUse()).toHaveLength(1);
+    expect((0, _index.withLegacyGetProps)({
+      getHOCsInUse: () => ['xyz']
+    }).getHOCsInUse()).toHaveLength(2);
+  });
+});