Move the MRT reference app to the SDKs, so that we can verify eg. Node support #966

olibrook · 2023-02-07T21:10:32Z

Review Instructions

From the MRT side:

Read and compare with the existing test app on https://git.soma.salesforce.com/cc-mobify/ssr-infrastructure
Check out this repository and initialize with npm ci.
Check the app starts correctly with cd packages/template-mrt-reference-app, npm start
From the repository root run GENERATOR_PRESET=mrt-reference-app node packages/pwa-kit-create-app/scripts/create-mobify-app-dev.js --outputDir ~/ref-app
Do cd ~/ref-app, run npm start and check that the generated test app also starts correctly.

The last step – generating the test app – is what we're planning to use in our MRT Jenkins jobs in future!

From the PWA-kit side:

cd packages/template-retail-react-app/ && npm start
Wait for the server to start. Check the site works.
Check http://localhost:3000/favicon.ico works
Check http://localhost:3000/robots.txt

The pwa-kit test instructions are to cover changes I needed to make to serveStaticFile. @kevinxh this the the approach you and I discussed where we're revisiting what we did here to remove that accidental dependency on pwa-kit-react-sdk.

Description

This app is what the MRT team uses to verify deploys in the Manager repository. It has lived here for the longest time, which is convenient for MRT, but has the downside that our test app is (1) hardly known beyond the MRT team and (2) very out of date.

We'd like to be able to collaborate better with platform users and we need to be able to write better tests of the interface between apps -> platform.

Essentially, when we run a CI job on Managed Runtime, we want to be able to do this:


# Generate a project, as an end-user would do!
npx pwa-kit-create-app --preset mrt-reference-app 

# Deploy that reference app, as an end-user would do!
npm run push

# Verify that platform features work, for newly-generated projects, as an end-user would do
npm run tail-logs

#... etc, etc

Changes

Port the existing MRT reference app to the pwa-kit repo.

wjhsf · 2023-02-08T15:05:06Z

Is there any bureaucracy that must be bureaucraced in order to open source this code?

drewzboto · 2023-02-24T19:33:44Z

Is there any bureaucracy that must be bureaucraced in order to open source this code?

No, this would be similar to any other test-related additions. OK to open source by including in the repo with the usual copyrights/licenses as included in the PR

lizcross · 2023-02-24T21:28:52Z

packages/template-mrt-reference-app/app/ssr.test.js

+ */
+const request = require('supertest')
+
+describe('server', () => {


@olibrook in future PRs should people add tests to this file as they add new functionality to the mrt reference app?

Yes, if they feel that's necessary!

lizcross · 2023-02-24T21:37:04Z

@olibrook The code all looks good to me. What do you think about deploying the app to MRT and running the e2e tests against it to ensure all the tests work as expected?

./scripts/run-e2e-tests.sh --url $URL_OF_APP --deploy-id $DEPLOY_ID

lizcross · 2023-02-24T21:56:20Z

When I run the app locally the home page loads but there is an error in the console

I get the same error I think when I run the generated app locally.

On first load the loading screen with the bear is served and I get this error =>

olibrook · 2023-02-24T21:57:09Z

@lizcross Thanks for taking a look! I have done the ./scripts/run-e2e-tests.sh step you recommended locally already. I'm working on getting that actually demoable on the ssr-infrastructure repository, too.

If you're curious to try, you can check out this line in ssr-infrastructure and try the same thing on your machine - https://git.soma.salesforce.com/cc-mobify/ssr-infrastructure/pull/905/files#diff-e6ffa5dc854b843b3ee3c3c28f8eae2f436c2df2b1ca299cca1fa5982e390cf8R162

(Note that the test on the other repo uses a hard-coded artifact at the moment, until we publish this SDK update to NPM. The hard-coded artifact was built with the generator that you just tested, here on this PR)

lizcross · 2023-02-24T22:04:05Z

Is it possible to remove the loading screen from the app? It doesn't seem necessary. Or is that loading screen part of pwa-kit-runtime?

olibrook · 2023-02-24T22:05:06Z

The loading screen is part of the SDKs, we cannot – and I would argue do not want to – get rid of it. It isn't used on Lambda, so it can't affect tests.

olibrook · 2023-02-24T22:06:58Z

Cannot read property 'compilation' of undefined

Great catch – thank you. I think this error is new, having merged with develop today. Investigating.... 👀

Update it's not new! 😂

lizcross · 2023-02-24T23:26:14Z

I deployed the generated app and I was able to successfully run the e2e tests (using scripts from sfci-main branch of ssr-infra)

https://runtime.commercecloud.com/mobify/lizdev/reference-app

lizcross · 2023-02-24T23:28:41Z

@olibrook how would we generate the app with different node versions?

…eact

olibrook · 2023-03-03T00:53:14Z

packages/pwa-kit-dev/src/configs/webpack/config.js

+                        // This must only appear on one config – this one is the only mandatory one.
+                        new CopyPlugin({
+                            patterns: [{from: 'app/static/', to: 'static/'}]
+                        }),


Turns out, it's this config that is really always mandatory. My bad!

olibrook · 2023-03-03T00:54:20Z

packages/pwa-kit-dev/src/ssr/server/build-dev-server.test.js

@@ -738,59 +738,24 @@ describe('DevServer service worker', () => {

        test(`${name} (and handle 404s correctly)`, () => {
            const app = createApp()
+            app.get('/worker.js(.map)?', NoWebpackDevServerFactory.serveServiceWorker)


This test had a bug where it didn't actually run serveServiceWorker on a 404, so it missed a branch in the coverage.

olibrook · 2023-03-03T00:54:37Z

packages/pwa-kit-dev/src/ssr/server/build-dev-server.test.js

    test('should serve static files', async () => {
-        const options = opts()
+        const options = opts({projectDir: testFixtures})


I made this configurable, so we don't have to do this middleware mocking.

olibrook · 2023-03-03T01:28:03Z

@olibrook how would we generate the app with different node versions?

@lizcross Great question. I've handled this on the ssr-infrastructure side, here.

I think it's a great idea to parametrize this in the generator, but I'd ask that we do this as a follow-up – the generator has a bunch of complexities that are new to me, given that on the SDKs side there are now multiple ways to configure the lambda version, and the method used varies from one template to the next.

(Basically, it can go into package.json or into a newer config file and we haven't standardized across all templates.)

kevinxh

I've tested the changes to the SDK packages and it looks good to me!

(I didn't review/test the mrt reference app, it probably need someone from MRT team to verify.)

* develop: Allow query hook parameters to be `null`. (#1046) Implement `updateCustomerPassword` as no-op. (#1031) Update Retail React App Page Designer integration README (#1041) BUG: Changed type of the phone number field to bring up numberic keyboard on mobile devices - W-9871940 (#1016) Move the MRT reference app to the SDKs, so that we can verify eg. Node support (#966) Update `develop` with `release-v2.7.0` (#1033) Remove unused dependencies. (#1020) Make some style decisions on padding (#1023) Update CHANGELOG.md (#1021) Support product-sets in retail-react-app (#1019) Simplify hooks logic (#959) Fix NPM dependencies (#1012) # Conflicts: # lerna.json # package-lock.json # package.json # packages/commerce-sdk-react/CHANGELOG.md # packages/commerce-sdk-react/package-lock.json # packages/commerce-sdk-react/package.json # packages/internal-lib-build/package-lock.json # packages/internal-lib-build/package.json # packages/pwa-kit-create-app/package-lock.json # packages/pwa-kit-create-app/package.json # packages/pwa-kit-dev/CHANGELOG.md # packages/pwa-kit-dev/package-lock.json # packages/pwa-kit-dev/package.json # packages/pwa-kit-dev/src/configs/webpack/config.js # packages/pwa-kit-dev/src/ssr/server/build-dev-server.js # packages/pwa-kit-react-sdk/CHANGELOG.md # packages/pwa-kit-react-sdk/package-lock.json # packages/pwa-kit-react-sdk/package.json # packages/pwa-kit-runtime/CHANGELOG.md # packages/pwa-kit-runtime/package-lock.json # packages/pwa-kit-runtime/package.json # packages/template-express-minimal/package-lock.json # packages/template-express-minimal/package.json # packages/template-retail-react-app/app/hooks/use-add-to-cart-modal.js # packages/template-retail-react-app/app/partials/product-view/index.jsx # packages/template-retail-react-app/package-lock.json # packages/template-retail-react-app/package.json # packages/template-typescript-minimal/package-lock.json # packages/template-typescript-minimal/package.json # packages/test-commerce-sdk-react/package-lock.json # packages/test-commerce-sdk-react/package.json

* Update `develop` with `release-v2.7.0` (#1033) * Starting release process for 2.7.0 * Update Create MRT credentials file (#1025) * Release 2.7: fix order of hooks (#1027) * Return early only after all of the hooks are called * Bumper version --------- Co-authored-by: Ben Chypak <[email protected]> * Quick fix for einstein data (#1028) * Quick fix for einstein data * Bump Version * Re-lock package-lock files with npm 8 * Update package-lock.json * Update einstein.js * Regenerate lock files (#1030) * Regenerate lock files * Bump version to 2.7.0-alpha.3 * Bump to 2.7.0 (#1032) * Begin development on 2.8.0 --------- Co-authored-by: Adam Raya <[email protected]> Co-authored-by: Vincent Marta <[email protected]> * Move the MRT reference app to the SDKs, so that we can verify eg. Node support (#966) * BUG: Changed type of the phone number field to bring up numberic keyboard on mobile devices - W-9871940 (#1016) Co-authored-by: Ben Chypak <[email protected]> * Update Retail React App Page Designer integration README (#1041) Co-authored-by: Richard Sexton <[email protected]> * Implement `updateCustomerPassword` as no-op. (#1031) * Allow query hook parameters to be `null`. (#1046) * Remove unused util. * Allow query hook parameters to be `null`. * Fix addresses not having preferred address first. (#1051) * Fix addresses not having preferred address first. * Include all addresses, not just preferred address twice. * Correctly include preferred address. * Make `mergeBasket` Conditional More Robust (#1048) * Update merge logic * Update CHANGELOG.md * Lint * PR feedback * Rename isNewlyRegisters to isNew for simplicity * Lint * [commerce-sdk-react] Decode pre-fetched token and save auth data in storage (#1052) * add test * decode jwt data * lint * Update packages/commerce-sdk-react/src/auth/index.ts Co-authored-by: Will Harney <[email protected]> * rename parseSlasJWT * Update packages/commerce-sdk-react/src/auth/index.test.ts Co-authored-by: Will Harney <[email protected]> * convert all .thens to await * make fake token in tests more clear * lint --------- Co-authored-by: Will Harney <[email protected]> * Prevent modal to open when it fails to add an item to cart (#1053) * prevent modal to open when it fails to add an item to cart * Update comment --------- Co-authored-by: Alex Vuong <[email protected]> * Fix `getConfig` referencing config from incorrect location (#1049) * Initial Commit * Update CHANGELOG.md * Revert some testing code * Get test coverage back up * Test build directory folder before proceeding. * fix(template-retail-react-app): product-list refinements (#957) * fix(template-retail-react-app): product-list refinements + Ensure that the `selectedFilters` provided to the `Refinements` value components is always an array. And update said value components (checkbox, color, radio & size) to handle always receiving an array. + Apply some loose equality checks, catering for cases where a refinement URL param is parsed as a number but the refinement `.value` is a stringified number. + Fix bug where non-multiple filters could not be unchecked by selecting themselves (e.g. clicking an already checked checkbox). + Fix bug where a refinement URL param is parsed as a number, but was handled as a string (with `.split()`). + Fix bug where radio refinements would still appear as checked after clearing the value via `SelectedRefinements`. + Deprecate unused proptypes in `SizeRefinements` * feat(retail-react-app): update `CheckboxRefinements` + Adjust the `onChange` logic so that multiple checkbox refinements can be selected --------- Co-authored-by: Ben Chypak <[email protected]> * update docs for shopper-experience scope (#1059) * add docs for experience scope * Add `merge_group` event to trigger GA builds --------- Co-authored-by: Will Harney <[email protected]> Co-authored-by: Adam Raya Navarro <[email protected]> * Update lockfiles to reflect current version. (#1071) * [commerce-sdk-react] Implement remaining Shopper Baskets cache logic (#1070) * Refactor Shopper Basket cache following new pattern * Fix types * Update packages/commerce-sdk-react/src/hooks/ShopperBaskets/cache.ts Co-authored-by: Will Harney <[email protected]> * PR Feedback * Clean up unused utils and types after refactor * Add missing response basketId to queryKey * Implement cache for the remaining mutations * Tests WIP * PR Feedback & Use query key path in `deleteBasket` cache * Add tests for mutations returning void response * PR Feedback * Remove unused `and` hooks util * Revert "Remove unused `and` hooks util" This reverts commit c0a364a. --------- Co-authored-by: Will Harney <[email protected]> * [commerce-sdk-react] Fix Shopper Baskets Test case (#1082) * Fix Shopper Basket empty response test cases * lint * feat(pwa-kit-dev): minor performance improvements and added comments (#974) * feat(pwa-kit-dev): minor performance improvements and added comments * docs(pwa-kit-dev): clean up comments * refactor(pwa-kit-dev): update condition from PR feedback --------- Co-authored-by: Will Harney <[email protected]> * Update dependencies. (#1079) * Remove internal packages to bypass lerna nonsense. Include output.json to make restoring deps easier. * Disable build scripts to make changing deps easier. * Update root deps. * Fix typescript issue. * Create restore script to restore internal deps/scripts. * Update commerce-sdk-react deps. * Update test-commerce-sdk-react deps. * Update template-typescript-minimal deps * Improve restore script. * Fix trailing comma. * Update template-retail-react-app deps * npm prune everything * Update pwa-kit-runtime deps * Update pwa-kit-react-sdk deps * Update pwa-kit-create-app deps * Update pwa-kit-dev deps (except eslint) * Update pwa-kit-dev eslint deps * Update internal-lib-build deps (except eslint) * Update pwa-kit eslint deps * Restore internal deps. * Restore build scripts. * Remove temporary helper files. * Bump ua-parser-js to avoid vulnerable version. * Anchor cross-env common dep to version used by internal-lib-build. * Re-enable eslint. * Implement Cache Logic for Shopper APIs (Contexts/Customers/Login/Orders) (#1073) * Initial commit * Update packages/commerce-sdk-react/src/hooks/useAuthHelper.ts Co-authored-by: Will Harney <[email protected]> * Update packages/commerce-sdk-react/src/hooks/ShopperOrders/cache.ts Co-authored-by: Will Harney <[email protected]> * Update packages/commerce-sdk-react/src/hooks/ShopperOrders/cache.ts Co-authored-by: Will Harney <[email protected]> * Added root to all query keys, use remove over clear * Remove previous impemented "clear" from utils * Initial tests for shoppercontexts * Update ShopperLogin tests * Fix order tests * Update packages/commerce-sdk-react/src/hooks/ShopperContexts/cache.ts Co-authored-by: Will Harney <[email protected]> * Update cache.ts * Lint! * Update Json.tsx * Lint! * Testing race condition in tests * Re-add tests in other order. * Update CHANGELOG.md * Add todo to complete context cache work * Update packages/commerce-sdk-react/src/hooks/ShopperBaskets/mutation.test.ts Co-authored-by: Will Harney <[email protected]> * Update packages/commerce-sdk-react/src/components/ShopperExperience/Page/index.tsx Co-authored-by: Will Harney <[email protected]> * Update useAuthHelper.ts * Update packages/commerce-sdk-react/src/hooks/ShopperCustomers/cache.ts Co-authored-by: Adam Raya <[email protected]> --------- Co-authored-by: Will Harney <[email protected]> Co-authored-by: Adam Raya <[email protected]> * remove site alias and locale from location.state.directedFrom path (#1065) * remove site alias and locale from location.state.directedFrom path * moving call to removeSiteLocaleFromPath into use-navigation hook * fixing failing test, added tests for removeSiteLocaleFromPath * per code review, skipping failed test instead of using mocking * Fix Page Designer ImageWithText Link component (#1092) * Fix PD ImageWithText Link component by using Chakra UI Link * Use isAbsoluteURL to use react-router Link or Chakra Link component * PR Feedback * Clean up * Update packages/template-retail-react-app/app/page-designer/assets/image-with-text/index.jsx Co-authored-by: Ben Chypak <[email protected]> * Remove temporal page-viewer page to facilitate review --------- Co-authored-by: Ben Chypak <[email protected]> * split ssr build on local (#1155) * add suffix to ssr build files (#1157) * Added session bridge call to login for phased launch (#1159) * Added session bridge call to login for phased launch * Fix code smell for session-bridge in hybrid * Fix multi-value query params being lost (#1150) * Fix multi-value query params being lost * Update CHANGELOG.md * Snyk dependency updates (#1169) * Dependency updates * Update runtime package lock * Bump cosmiconfig version to latest * [Hybrid] PWA Kit should have a mechanism for replacing the access token when a SFRA login state is changed (#1171) * Implement mechanism to store refresh token copy and compare with sfra * Update tests and mocks for util function to check SFRA login state * Fix linting issues * FIx param types for util functionn * Rename old isTokenValid to isTokenExpired * Remove expiry for refresh_token in localstorage * Update packages/template-retail-react-app/app/commerce-api/utils.js Co-authored-by: Kevin He <[email protected]> * fix test * Fix linting on use-auth-modal.test.js * Update hasSFRAStateChanged logic to compare keys and values * Fix linting --------- Co-authored-by: Kevin He <[email protected]> * Add a redirect to login page after user signs out from checkout page (#1172) * Add a redirect to login page after user signs out from checkout page * Update CHANGELOG.md * Remove history since navigate handles similarly * Bump version number to 2.7.1-alpha.0 * Update changelogs * #1174 Replace invalid value for wrap property (#1179) * Update changelogs * Version bump to 2.7.1-preview.0 * Revert "Version bump to 2.7.1-preview.0" This reverts commit 985a7e0. * Update CHANGELOG.md * Rebuild lock files and fix ShopperLogin mutation test * Revert "Rebuild lock files and fix ShopperLogin mutation test" This reverts commit d9cfe50. * Add additional properties to ShopperLogin test types (#1185) * [V2] Re-generate lock files and fix hook lib tests (#1186) * re-generate lock files and fix test * Update packages/commerce-sdk-react/src/hooks/ShopperBaskets/index.test.ts * Rebuild lockfiles using node 14 npm 8 * Revert "Rebuild lockfiles using node 14 npm 8" This reverts commit 3d5c0cb. * Use pwa-kit-dev for lint and format * Revert "Use pwa-kit-dev for lint and format" This reverts commit f46d83e. * Add typescript to internal-lib-build and rebuild lock files --------- Co-authored-by: vcua-mobify <[email protected]> Co-authored-by: vcua-mobify <[email protected]> * [V2] Internal lib build typescript dev dependency (#1194) * Move typescript to dev and peer dependency * Update package lock file * Lockfile updates --------- Co-authored-by: Ben Chypak <[email protected]> Co-authored-by: Adam Raya <[email protected]> Co-authored-by: Vincent Marta <[email protected]> Co-authored-by: Oliver Brook <[email protected]> Co-authored-by: echessman <[email protected]> Co-authored-by: John Boxall <[email protected]> Co-authored-by: Richard Sexton <[email protected]> Co-authored-by: Will Harney <[email protected]> Co-authored-by: Kevin He <[email protected]> Co-authored-by: Alex Vuong <[email protected]> Co-authored-by: Brad Adams <[email protected]> Co-authored-by: Charles Lavery <[email protected]> Co-authored-by: Adam Raya Navarro <[email protected]> Co-authored-by: ecRobertEngel <[email protected]> Co-authored-by: Sandra Golden <[email protected]> Co-authored-by: Jainam Sheth <[email protected]> Co-authored-by: mdenchev-aiopsgroup <[email protected]>

Port over the MRT reference app and ensure it uses the right SDKs

2b3b68d

olibrook requested a review from a team as a code owner February 7, 2023 21:10

olibrook marked this pull request as draft February 8, 2023 00:02

olibrook added 2 commits February 7, 2023 16:08

Merge branch 'develop' into include-platform-test-app

d428c81

Run check-dependencies

80ed3cf

olibrook added 4 commits February 8, 2023 09:28

WIP

e5fcd1a

Prettier

de2c823

Copy over README's from the ssr-infrastructure repository

31bd3cd

Merge branch 'develop' into include-platform-test-app

775a972

olibrook marked this pull request as ready for review February 24, 2023 19:49

lizcross reviewed Feb 24, 2023

View reviewed changes

olibrook added 4 commits March 2, 2023 15:11

Refactor serveStaticFile to remove accidental dependency on pwa-kit-r…

c08d78b

…eact

Tests cover non-default projectDir, boost branch coverage

46d9b34

Format

caf5812

Merge branch 'develop' into include-platform-test-app

39e15af

olibrook commented Mar 3, 2023

View reviewed changes

olibrook requested a review from kevinxh March 3, 2023 01:28

olibrook added 2 commits March 2, 2023 17:29

Trigger build

f483768

Default to 16.x in template-mrt-reference-app

fbe201b

kevinxh approved these changes Mar 3, 2023

View reviewed changes

olibrook added 3 commits March 6, 2023 11:02

Fix 'engine' in mrt-reference-app

c85e83e

Merge branch 'develop' into include-platform-test-app

d3d2283

Fix dependencies after merge with develop

4875641

olibrook merged commit a402f66 into develop Mar 6, 2023

vcua-mobify mentioned this pull request May 9, 2023

PWA Kit 2.7.1-alpha.0 release #1181

Merged

vcua-mobify mentioned this pull request May 11, 2023

[V2] PWA Kit Release 2.7.1 #1197

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Move the MRT reference app to the SDKs, so that we can verify eg. Node support #966

Move the MRT reference app to the SDKs, so that we can verify eg. Node support #966

olibrook commented Feb 7, 2023 •

edited

Loading

wjhsf commented Feb 8, 2023

drewzboto commented Feb 24, 2023

lizcross Feb 24, 2023

olibrook Feb 24, 2023

lizcross commented Feb 24, 2023 •

edited

Loading

lizcross commented Feb 24, 2023 •

edited

Loading

olibrook commented Feb 24, 2023

lizcross commented Feb 24, 2023

olibrook commented Feb 24, 2023 •

edited

Loading

olibrook commented Feb 24, 2023 •

edited

Loading

lizcross commented Feb 24, 2023 •

edited

Loading

lizcross commented Feb 24, 2023

olibrook Mar 3, 2023

olibrook Mar 3, 2023

olibrook Mar 3, 2023

olibrook commented Mar 3, 2023

kevinxh left a comment

Move the MRT reference app to the SDKs, so that we can verify eg. Node support #966

Move the MRT reference app to the SDKs, so that we can verify eg. Node support #966

Conversation

olibrook commented Feb 7, 2023 • edited Loading

Review Instructions

Description

Changes

wjhsf commented Feb 8, 2023

drewzboto commented Feb 24, 2023

lizcross Feb 24, 2023

Choose a reason for hiding this comment

olibrook Feb 24, 2023

Choose a reason for hiding this comment

lizcross commented Feb 24, 2023 • edited Loading

lizcross commented Feb 24, 2023 • edited Loading

olibrook commented Feb 24, 2023

lizcross commented Feb 24, 2023

olibrook commented Feb 24, 2023 • edited Loading

olibrook commented Feb 24, 2023 • edited Loading

lizcross commented Feb 24, 2023 • edited Loading

lizcross commented Feb 24, 2023

olibrook Mar 3, 2023

Choose a reason for hiding this comment

olibrook Mar 3, 2023

Choose a reason for hiding this comment

olibrook Mar 3, 2023

Choose a reason for hiding this comment

olibrook commented Mar 3, 2023

kevinxh left a comment

Choose a reason for hiding this comment

olibrook commented Feb 7, 2023 •

edited

Loading

lizcross commented Feb 24, 2023 •

edited

Loading

lizcross commented Feb 24, 2023 •

edited

Loading

olibrook commented Feb 24, 2023 •

edited

Loading

olibrook commented Feb 24, 2023 •

edited

Loading

lizcross commented Feb 24, 2023 •

edited

Loading