Merge pull request #5 from adobe-rnd/merge

Get in Sync with June-25 release of aem-boilerplate-commerce

Author: msagolj

.eslintignore

@@ -6,7 +6,6 @@ tools/pdp-metadata
 scripts/__dropins__
 scripts/commerce-events-collector.js
 scripts/commerce-events-sdk.js
-scripts/widgets
 plugins/
 cypress/
 dompurify.min.js

.eslintrc.js

@@ -16,6 +16,9 @@ module.exports = {
   },
   rules: {
     'import/extensions': ['error', { js: 'always' }], // require js file extensions in imports
+    'import/prefer-default-export': 'off', // allow named exports for single exports
+    'import/no-cycle': 'off', // allow circular dependencies for browser code
+    'import/no-relative-packages': 'off', // allow relative imports for browser code
     '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 }],
@@ -26,5 +29,14 @@ module.exports = {
       },
     ],
     'no-unused-vars': ['error', { argsIgnorePattern: '^_', varsIgnorePattern: '^_' }],
+    'no-underscore-dangle': 'off', // allow all underscore properties
   },
+  overrides: [
+    {
+      files: ['build.mjs'],
+      rules: {
+        'import/no-extraneous-dependencies': 'off',
+      },
+    },
+  ],
 };

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

@@ -21,6 +21,8 @@ jobs:
           working-directory: cypress
           wait-on: 'http://localhost:3000'
           command: npm run cypress:saas:run
+        env:
+          AEM_ASSETS_PRIVATE_USER: ${{ secrets.AEM_ASSETS_PRIVATE_USER }}
       - uses: actions/upload-artifact@v4
         if: failure()
         with:

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

@@ -21,6 +21,8 @@ jobs:
           working-directory: cypress
           wait-on: 'http://localhost:3000'
           command: npm run cypress:run
+        env:
+          AEM_ASSETS_PRIVATE_USER: ${{ secrets.AEM_ASSETS_PRIVATE_USER }}
       - uses: actions/upload-artifact@v4
         if: failure()
         with:

.stylelintrc.json

@@ -1,3 +1,7 @@
 {
-  "extends": ["stylelint-config-standard"]
+  "extends": ["stylelint-config-standard"],
+  "rules": {
+    "media-feature-range-notation": "prefix",
+    "selector-class-pattern": null
+  }
 }

404.html

@@ -35,7 +35,7 @@
         if (!match) return;
 
         const { root, placeholders } = match;
-        
+
         if (root) {
           const rootMeta = document.createElement('meta');
           rootMeta.name = 'root';

README.md

@@ -2,7 +2,16 @@
 This project boilerplate is for AEM Authoring with Edge Delivery Services (aka Crosswalk) projects that integrate with Adobe Commerce.
 
 ## Documentation
-https://experienceleague.adobe.com/developer/commerce/storefront/
+
+Before using the boilerplate, we recommend you to go through the documentation on https://experienceleague.adobe.com/developer/commerce/storefront/ and more specifically:
+
+1. [Storefront Developer Tutorial](https://experienceleague.adobe.com/developer/commerce/storefront/get-started/)
+1. [AEM Docs](https://www.aem.live/docs/)
+1. [AEM Developer Tutorial](https://www.aem.live/developer/tutorial)
+1. [The Anatomy of an AEM Project](https://www.aem.live/developer/anatomy-of-a-project)
+1. [Web Performance](https://www.aem.live/developer/keeping-it-100)
+1. [Markup, Sections, Blocks, and Auto Blocking](https://www.aem.live/developer/markup-sections-blocks)
+
 
 ## Environments
 - Preview: https://main--{repo}--{owner}.aem.page/

blocks/columns/columns.css

@@ -19,7 +19,7 @@
   display: block;
 }
 
-@media (width >= 900px) {
+@media (min-width: 900px) {
   .columns > div {
     align-items: center;
     flex-direction: unset;

blocks/commerce-account-header/commerce-account-header.js

@@ -1,6 +1,4 @@
-/* eslint-disable import/no-unresolved */
-/* eslint-disable import/no-extraneous-dependencies */
-import { Header, provider as uiProvider } from '@dropins/tools/components.js';
+import { Header, provider as UI } from '@dropins/tools/components.js';
 import { readBlockConfig } from '../../scripts/aem.js';
 
 export default function decorate(block) {
@@ -10,5 +8,5 @@ export default function decorate(block) {
 
   block.innerHTML = '';
 
-  return uiProvider.render(Header, { title })(block);
+  return UI.render(Header, { title })(block);
 }

blocks/commerce-account-sidebar/commerce-account-sidebar.css

@@ -1,4 +1,4 @@
-@media (width >= 900px) {
+@media (min-width: 900px) {
     body.columns main > .section.commerce-account-sidebar-container {
         max-width: var(--column-width);
     }