Syncing from Upstream

.devcontainer/Dockerfile

@@ -0,0 +1,24 @@
+FROM mcr.microsoft.com/devcontainers/base:jammy
+
+USER vscode
+
+ARG NODE_VERSION
+
+RUN curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.3/install.sh | bash && \
+    export NVM_DIR="$HOME/.nvm" && \
+    [ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" && \
+    nvm install $NODE_VERSION && \
+    nvm use $NODE_VERSION && \
+    npm install -g npm@latest
+
+ENV NODE_PATH $NVM_DIR/versions/node/$NODE_VERSION/lib/node_modules
+ENV PATH      $NVM_DIR/versions/node/$NODE_VERSION/bin:$PATH
+
+RUN export NVM_DIR="$HOME/.nvm" && \. "$NVM_DIR/nvm.sh" && \
+    npm install -g @adobe/aio-cli
+
+RUN export NVM_DIR="$HOME/.nvm" && \. "$NVM_DIR/nvm.sh" && \
+    aio telemetry yes && \
+    aio plugins:install @adobe/aio-cli-plugin-api-mesh 
+
+

.devcontainer/devcontainer.json

@@ -0,0 +1,31 @@
+{
+	"name": "Evergreen Storefront",
+
+	"dockerComposeFile": "docker-compose.yml",
+	"service": "app",
+
+	"workspaceFolder": "/workspaces/${localWorkspaceFolderBasename}",
+
+	"postCreateCommand": "npm install",
+	"postAttachCommand": "npm start",
+
+	"forwardPorts": [3000],
+	"customizations": {
+		"vscode": {
+			"extensions": [
+				"ryanluker.vscode-coverage-gutters"
+			]
+		}
+	},
+	"features": {
+		"ghcr.io/christophermacgown/devcontainer-features/direnv:1": {}
+	},
+
+	"portsAttributes": {
+		"3000": {
+		  "label": "Adobe Commerce Storefront (HTTP)"
+		}
+
+
+
+}

.devcontainer/docker-compose.yml

@@ -0,0 +1,16 @@
+version: '3.8'
+
+services:
+  app:
+    build:
+      context: .
+      dockerfile: Dockerfile
+      args:
+        - NODE_VERSION=--lts
+    entrypoint: sleep infinity
+    volumes:
+      - ../..:/workspaces:cached
+  cors-anywhere:
+    image: tlan16/cors-anywhere
+    ports:
+      - "8080:8080"

.editorconfig

@@ -0,0 +1,5 @@
+[*.js]
+indent_size = 2
+
+[*.css]
+indent_size = 4

.eslintignore

@@ -1 +1,12 @@
-helix-importer-ui
+helix-importer-ui
+scripts/htm.js
+scripts/acdl
+tools/picker
+tools/segments
+tools/pdp-metadata
+scripts/__dropins__
+scripts/commerce-events-collector.js
+scripts/commerce-events-sdk.js
+scripts/widgets
+plugins/
+cypress/

.eslintrc.js

@@ -11,11 +11,16 @@ module.exports = {
     requireConfigFile: false,
   },
   rules: {
-    // allow reassigning param
-    'no-param-reassign': [2, { props: false }],
-    'linebreak-style': ['error', 'unix'],
-    'import/extensions': ['error', {
-      js: 'always',
-    }],
+    'import/extensions': ['error', { js: 'always' }], // require js file extensions in imports
+    'linebreak-style': ['error', 'unix'], // enforce unix linebreaks
+    'no-param-reassign': [2, { props: false }], // allow modifying properties of param
+    'no-use-before-define': [2, { functions: false }],
+    'no-console': [
+      'error',
+      {
+        allow: ['warn', 'error', 'info', 'debug'],
+      },
+    ],
+    'no-unused-vars': ['error', { argsIgnorePattern: '^_', varsIgnorePattern: '^_' }],
   },
 };

.github/pull_request_template.md

@@ -3,5 +3,5 @@ Please always provide the [GitHub issue(s)](../issues) your PR is for, as well a
 Fix #<gh-issue-id>
 
 Test URLs:
-- Before: https://main--{repo}--{owner}.hlx.live/
-- After: https://<branch>--{repo}--{owner}.hlx.live/
+- Before: https://main--{repo}--{owner}.aem.live/
+- After: https://<branch>--{repo}--{owner}.aem.live/

.github/workflows/cleanup-on-create.yaml

@@ -6,30 +6,26 @@ on:
   create:
     branches:
       - main
+  workflow_dispatch:
 jobs:
   cleanup:
     runs-on: ubuntu-latest
     permissions:
       contents: write
       actions: write
     # only run if commit message is "Initial commit" on main branch
-    if: ${{ github.ref == 'refs/heads/main' && github.event.head_commit.message == 'Initial commit' }}
+    if: ${{ github.event_name == 'workflow_dispatch' || ( github.ref == 'refs/heads/main' && !(contains(github.event, 'head_commit') || github.event.head_commit.message == 'Initial commit' )) }}
     steps:
       - name: Checkout
         uses: actions/checkout@v4
-      - name: Use Node.js 18
+      - name: Use Node.js 20
         uses: actions/setup-node@v4
         with:
-          node-version: 18
-      - name: Uninstall dependencies
-        run: |
-          npm uninstall --save-dev semantic-release @semantic-release/git @semantic-release/changelog @semantic-release/exec
+          node-version: 20
       - name: Remove Helper Files
         run: | 
           rm -rf \
             .github/workflows/cleanup-on-create.yaml \
-            .github/workflows/semantic-release.yaml \
-            .releaserc.cjs \
             CHANGELOG.md
 
       - name: Initialize README
@@ -47,7 +43,7 @@ jobs:
       - name: Commit changes
         run: |
           git config --local user.email "[email protected]"
-          git config --local user.name "Helix Bot"
+          git config --local user.name "AEM Bot"
           git add .
           git commit -m "chore: cleanup repository template"
           git push

.github/workflows/main.yaml

@@ -0,0 +1,14 @@
+name: Build
+on: [push]
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/checkout@v4
+    - name: Use Node.js 20
+      uses: actions/setup-node@v4
+      with:
+        node-version: 20
+    - run: npm ci
+    - run: npm run lint

.github/workflows/run-e2e-tests.yaml

@@ -0,0 +1,29 @@
+name: Cypress E2E Tests
+on: push
+jobs:
+  cypress-run:
+    # If you want this job to run on your fork, remove the below "if" line.
+    # You will need to "fix" the tests as they are specific to Adobe Commmerce's
+    # demo backend.
+    if: github.repository == 'hlxsites/aem-boilerplate-commerce'
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - name: Install root dependencies
+        run: npm ci
+      - name: Start server in the background
+        run: npm start &
+
+      - name: Install Cypress and run tests
+        uses: cypress-io/github-action@v6
+        with:
+          working-directory: cypress
+          browser: chrome
+          wait-on: 'http://localhost:3000'
+          config: baseUrl=http://localhost:3000
+      - uses: actions/upload-artifact@v4
+        if: failure()
+        with:
+          name: cypress-screenshots
+          path: cypress/screenshots
+          if-no-files-found: ignore

.gitignore

@@ -1,9 +1,12 @@
 .hlx/*
 coverage/*
 logs/*
-node_modules/*
+node_modules
+.parcel-cache
 
 helix-importer-ui
 .DS_Store
 *.bak
 .idea
+# Ignore .map files in scripts/__dropins__/ directory and all its subdirectories
+scripts/__dropins__/**/*.map

.hlxignore

@@ -1,7 +1,13 @@
 .*
 *.md
+*.d.ts
 karma.config.js
 LICENSE
 package.json
 package-lock.json
 test/*
+postinstall.js
+build.mjs
+tools/picker/src/*
+cypress/
+tools/pdp-metadata/*

.npmrc

@@ -0,0 +1,2 @@
+; force @adobe namespaced packages to be installed from npmjs.org
+@adobe:registry=https://registry.npmjs.org

.stylelintrc.json

@@ -1,3 +1,3 @@
 {
   "extends": ["stylelint-config-standard"]
-}
+}

404.html

@@ -3,16 +3,23 @@
 
 <head>
   <title>Page not found</title>
+  <script type="importmap">
+    {
+        "imports": {
+            "@dropins/tools/": "/scripts/__dropins__/tools/",
+            "@dropins/storefront-cart/": "/scripts/__dropins__/storefront-cart/",
+            "@dropins/storefront-auth/": "/scripts/__dropins__/storefront-auth/"
+        }
+    }
+  </script>
   <script type="text/javascript">
     window.isErrorPage = true;
     window.errorCode = '404';
   </script>
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <meta property="og:title" content="Page not found">
-  <script src="/scripts/scripts.js" type="module" crossorigin="use-credentials"></script>
+  <script src="/scripts/scripts.js" type="module"></script>
   <script type="module">
-    import { sampleRUM } from '/scripts/aem.js';
-
     window.addEventListener('load', () => {
       if (document.referrer) {
         const { origin, pathname } = new URL(document.referrer);
@@ -26,23 +33,30 @@
           btnContainer.append(backBtn);
         }
       }
-      sampleRUM('404', { source: document.referrer, target: window.location.href });
     });
   </script>
+  <script type="module">
+    import { sampleRUM } from '/scripts/aem.js';
+    sampleRUM('404', { source: document.referrer });
+  </script>
   <link rel="stylesheet" href="/styles/styles.css">
   <style>
     main.error {
-      min-height: calc(100vh - var(--nav-height));
-      display: flex;
       align-items: center;
+      display: flex;
+      margin: 0 auto;
+      max-width: 1264px;
+      min-height: calc(100vh - var(--nav-height));
+      padding: 0 32px;
+      width: 100%;
     }
 
     main.error .error-number {
       width: 100%;
     }
 
     main.error .error-number text {
-      font-family: var(--fixed-font-family);
+      font-family: monospace;
     }
   </style>
   <link rel="stylesheet" href="/styles/lazy-styles.css">