Merge d9650e9 into ab9a05f

vuestorefront · Feb 18, 2021 · 39b1201 · 39b1201
2 parents ab9a05f + d9650e9
commit 39b1201
Show file tree

Hide file tree

Showing 96 changed files with 14,927 additions and 3,165 deletions.
diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
@@ -24,7 +24,9 @@ jobs:
       - name: Get cached dependencies
         uses: actions/cache@v2
         with:
-          path: '**/node_modules'
+          path: |
+            ~/.cache/Cypress
+            **/node_modules
           key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
 
       - name: Install dependencies
@@ -46,7 +48,9 @@ jobs:
       - name: Get cached dependencies
         uses: actions/cache@v2
         with:
-          path: '**/node_modules'
+          path: |
+            ~/.cache/Cypress
+            **/node_modules
           key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
 
       - name: Run linter
@@ -68,7 +72,9 @@ jobs:
       - name: Get cached dependencies
         uses: actions/cache@v2
         with:
-          path: '**/node_modules'
+          path: |
+            ~/.cache/Cypress
+            **/node_modules
           key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
 
       - name: Build core
@@ -94,18 +100,16 @@ jobs:
           path-to-lcov: packages/core/cli/coverage/lcov.info
           flag-name: core-cli
 
-  validate_integrations:
-    name: Validate ${{ matrix.integration }}
+  unit_test_integrations:
+    name: Run unit tests on ${{ matrix.integration }}
     needs: validate_core
     runs-on: ubuntu-latest
     strategy:
       fail-fast: false
       matrix:
         integration:
-          # - about-you
           - boilerplate
           - commercetools
-          # - shopify
 
     steps:
       - name: Checkout code
@@ -119,7 +123,9 @@ jobs:
       - name: Get cached dependencies
         uses: actions/cache@v2
         with:
-          path: '**/node_modules'
+          path: |
+            ~/.cache/Cypress
+            **/node_modules
           key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
 
       - name: Build core
@@ -172,13 +178,57 @@ jobs:
           parallel: true
           flag-name: ${{ matrix.integration }}-composables
 
-  finish:
-    name: Finish
-    needs: validate_integrations
+  finish_coveralls:
+    name: Finish coveralls
+    needs: unit_test_integrations
     runs-on: ubuntu-latest
     steps:
       - name: Coveralls Finished
         uses: coverallsapp/github-action@master
         with:
           github-token: ${{ secrets.github_token }}
           parallel-finished: true
+
+  e2e_test_integrations:
+    name: Run E2E tests on ${{ matrix.integration }}
+    env:
+      NUXT_ENV_E2E: true
+    needs: validate_core
+    runs-on: ubuntu-latest
+    strategy:
+      fail-fast: false
+      matrix:
+        integration:
+          # - bp
+          - ct
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+
+      - name: Setup node
+        uses: actions/setup-node@v1
+        with:
+          node-version: '12'
+
+      - name: Get cached dependencies
+        uses: actions/cache@v2
+        with:
+          path: |
+            ~/.cache/Cypress
+            **/node_modules
+          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
+
+      - name: Build integration
+        run: yarn build:${{ matrix.integration }}
+
+      - name: Cypress run
+        uses: cypress-io/github-action@v2.8.2
+        with:
+          start: yarn start:${{ matrix.integration }}
+          wait-on: 'http://localhost:3000/'
+          command: yarn run test:e2e:headless
+          config-file: packages/core/nuxt-theme-module/theme/tests/e2e/cypress.json
+          browser: chrome
+          headless: true
+          install: false
diff --git a/package.json b/package.json
@@ -6,49 +6,30 @@
   },
   "scripts": {
     "build:docs": "cd packages/core/docs && yarn build",
-    "dev:docs": "cd packages/core/docs && yarn dev",
     "build:core": "cd packages/core/core && yarn build",
     "build:middleware": "cd packages/core/middleware && yarn build",
-    "build:ayc:api-client": "cd packages/about-you/api-client && yarn build",
-    "build:ayc:composables": "cd packages/about-you/composables && yarn build",
-    "build:ayc:theme": "cd packages/about-you/theme && yarn build",
-    "build:ayc": "yarn build:core && yarn build:ayc:api-client && yarn build:ayc:composables && yarn build:ayc:theme",
-    "build:spr:api-client": "cd packages/spryker/api-client && yarn build",
-    "build:spr:composables": "cd packages/spryker/composables && yarn build",
-    "build:spr:tools": "yarn build:core && yarn build:spr:api-client && yarn build:spr:composables",
-    "build:spr:theme": "cd packages/spryker/theme && yarn build",
-    "build:spr": "yarn build:spr:tools && yarn build:spr:theme",
-    "dev:spr": "cd packages/spryker/theme && yarn dev",
-    "dev:spr:api-client": "cd packages/spryker/api-client && yarn dev",
-    "dev:spr:composables": "cd packages/spryker/composables && yarn dev",
     "build:bp:api-client": "cd packages/boilerplate/api-client && yarn build",
     "build:bp:composables": "cd packages/boilerplate/composables && yarn build",
     "build:bp:tools": "yarn build:core && yarn build:bp:api-client && yarn build:bp:composables",
     "build:bp:theme": "cd packages/boilerplate/theme && yarn build",
     "build:bp": "yarn build:bp:tools && yarn build:bp:theme",
-    "dev:bp": "cd packages/boilerplate/theme && yarn dev",
     "build:ct:api-client": "cd packages/commercetools/api-client && yarn build",
     "build:ct:composables": "cd packages/commercetools/composables && yarn build",
     "build:ct:tools": "yarn build:core && yarn build:middleware && yarn build:ct:api-client && yarn build:ct:composables",
     "build:ct:theme": "cd packages/commercetools/theme && yarn build",
     "build:ct": "yarn build:core && yarn build:ct:tools && yarn build:ct:theme",
-    "build:sp:tools": "yarn build:core && yarn build:sp:api-client && yarn build:sp:composables",
-    "build:sp": "yarn build:core && yarn build:sp:tools && yarn build:sp:theme",
-    "test:ayc:api-client": "cd packages/about-you/api-client && yarn test",
-    "test:ayc:composables": "cd packages/about-you/composables && yarn test",
     "test:ct:api-client": "cd packages/commercetools/api-client && yarn test",
     "test:ct:composables": "cd packages/commercetools/composables && yarn test",
     "test:core": "jest -c ./packages/core/jest.config.js",
     "test:ct": "yarn test:ct:api-client && yarn test:ct:composables",
-    "test:e2e": "./node_modules/.bin/cypress open",
+    "test:e2e": "cd packages/core/nuxt-theme-module && cypress open --config-file theme/tests/e2e/cypress.json",
+    "test:e2e:headless": "cd packages/core/nuxt-theme-module && cypress run --headless --config-file theme/tests/e2e/cypress.json",
     "test:cli": "cd packages/core/cli && yarn test",
-    "start:ayc": "cd packages/about-you/theme && yarn start",
     "start:ct": "cd packages/commercetools/theme && yarn start",
-    "dev:ayc:api-client": "cd packages/about-you/api-client && yarn dev",
-    "dev:ayc:composables": "cd packages/about-you/composables && yarn dev",
+    "dev:docs": "cd packages/core/docs && yarn dev",
     "dev:ct:api-client": "cd packages/commercetools/api-client && yarn dev",
     "dev:ct:composables": "cd packages/commercetools/composables && yarn dev",
-    "dev:ayc": "cd packages/about-you/theme && yarn dev",
+    "dev:bp": "cd packages/boilerplate/theme && yarn dev",
     "dev:ct": "cd packages/commercetools/theme && yarn dev",
     "link-packages": "lerna link --force-local",
     "lint": "eslint . --ext .js,.ts,.vue",

diff --git a/packages/about-you/theme/components/AppHeader.vue b/packages/about-you/theme/components/AppHeader.vue
@@ -1,6 +1,6 @@
 <template>
   <SfHeader
-    data-cy="app-header"
+    v-e2e="'app-header'"
     active-sidebar="activeSidebar"
     @click:cart="toggleCartSidebar"
     @click:wishlist="toggleWishlistSidebar"
@@ -12,23 +12,23 @@
   >
     <!-- TODO: add mobile view buttons after SFUI team PR -->
     <template #logo>
-      <nuxt-link data-cy="app-header-url_logo" :to="localePath('/')" class="sf-header__logo">
+      <nuxt-link v-e2e="'app-header-url_logo'" :to="localePath('/')" class="sf-header__logo">
         <SfImage src="/icons/logo.svg" alt="Vue Storefront Next" class="sf-header__logo-image"/>
       </nuxt-link>
     </template>
     <template #navigation>
       <SfHeaderNavigationItem>
-        <nuxt-link data-cy="app-header-url_women" :to="localePath('/c/women')">
+        <nuxt-link v-e2e="'app-header-url_women'" :to="localePath('/c/women')">
           WOMEN
         </nuxt-link>
       </SfHeaderNavigationItem>
       <SfHeaderNavigationItem>
-        <nuxt-link data-cy="app-header-url_men" :to="localePath('/c/men')">
+        <nuxt-link v-e2e="'app-header-url_men'" :to="localePath('/c/men')">
           MEN
         </nuxt-link>
       </SfHeaderNavigationItem>
       <SfHeaderNavigationItem>
-        <nuxt-link data-cy="app-header-url_kids" :to="localePath('/c/kids')">
+        <nuxt-link v-e2e="'app-header-url_kids'" :to="localePath('/c/kids')">
           KIDS
         </nuxt-link>
       </SfHeaderNavigationItem>

diff --git a/packages/about-you/theme/components/Filters.vue b/packages/about-you/theme/components/Filters.vue
@@ -17,7 +17,7 @@
             <SfColor
               v-for="option in filters[filterName].options"
               :key="`${filterName}-${option.name}`"
-              :data-cy="`category-filter_color_${option.name}`"
+              :v-e2e="'`category-filter_color_${option.name}`'"
               :color="option.name"
               :selected="option.selected"
               class="filters__color"
@@ -47,7 +47,7 @@
             <SfFilter
               v-for="option in filters[filterName].options"
               :key="`${filterName}-${option.name}`"
-              :data-cy="`category-filter_${filterName}_${option.name}`"
+              :v-e2e="'`category-filter_${filterName}_${option.name}`'"
               :label="filters[filterName].type == 'boolean' ? option.name == true ? 'yes' : 'no' : option.name"
               :selected="option.selected"
               class="filters__item"

diff --git a/packages/about-you/theme/components/SearchResults.vue b/packages/about-you/theme/components/SearchResults.vue
@@ -32,7 +32,7 @@
       <SfScrollable style="--scrollable-max-height: 630px;" show-text="" hide-text="">
         <div style="display: flex; flex-wrap: wrap;">
           <SfProductCard
-            data-cy="search-product-card"
+            v-e2e="'search-product-card'"
             v-for="(product, i) in products"
             :key="productGetters.getSlug(product)"
             :style="{ '--index': i }"

diff --git a/packages/boilerplate/api-client/src/types.ts b/packages/boilerplate/api-client/src/types.ts
@@ -1,5 +1,63 @@
-export type Cart = Record<string, unknown>;
-export type Wishlist = Record<string, unknown>;
+import { AgnosticCoupon } from '@vue-storefront/core';
+
+export { UseCategory, UseProduct } from '@vue-storefront/core';
+
+export type ProductsResponse = {
+  data: Product[];
+  total: number;
+};
+
+export type OrdersResponse = {
+  data: any[];
+  total: number;
+};
+
+export type OrderSearchParams = Record<string, any>;
+
+export type Category = {
+  id: number;
+  name: string;
+  slug: string;
+  items: Category[];
+}
+
+export type CategoryFilter = Record<string, any>;
+
+export type User = {
+  firstName?: string;
+  lastName?: string;
+  email?: string;
+};
+
+export type UserAddress = Record<string, any>;
+
+export type Cart = {
+  coupons: AgnosticCoupon[];
+  items: CartItem[];
+};
+
+export type CartItem = Product & {
+  _count: number;
+};
+
+export type Coupon = AgnosticCoupon;
+
+export type Order = Record<string, any>;
+
+export type OrderItem = Record<string, any>;
+
+export type Product = {
+  name: string;
+};
+
+export type Review = Record<string, any>;
+
+export type ShippingMethod = Record<string, any>;
+
+export type WishlistProduct = Record<string, any>;
+
+export type Wishlist = Record<string, any>;
+
 export type ProductVariant = {
   _id: number;
   _description: string;
@@ -11,13 +69,4 @@ export type ProductVariant = {
     original: number;
     current: number;
   };
-};
-export type Category = {
-  id: number;
-  name: string;
-  slug: string;
-  items: Category[];
-};
-export type CategoryFilter = Record<string, unknown>;
-export type ShippingMethod = Record<string, unknown>;
-export type LineItem = Record<string, unknown>;
+}
diff --git a/packages/boilerplate/composables/src/getters/cartGetters.ts b/packages/boilerplate/composables/src/getters/cartGetters.ts
@@ -1,27 +1,8 @@
 import { CartGetters, AgnosticPrice, AgnosticTotals, AgnosticCoupon, AgnosticDiscount } from '@vue-storefront/core';
-import { Cart, LineItem } from '@vue-storefront/boilerplate-api/src/types';
+import { Cart, CartItem } from '@vue-storefront/boilerplate-api';
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-export const getCartItems = (cart: Cart): LineItem[] => [
-  {
-    _id: 1,
-    _description: 'Some description',
-    _categoriesRef: [
-      '1',
-      '2'
-    ],
-    name: 'Black jacket',
-    sku: 'black-jacket',
-    images: [
-      'https://s3-eu-west-1.amazonaws.com/commercetools-maximilian/products/081223_1_large.jpg'
-    ],
-    price: {
-      original: 12.34,
-      current: 10.00
-    },
-    qty: 1
-  }
-];
+export const getCartItems = (cart: Cart): CartItem[] => cart.items;
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
 export const getCartItemName = (product: any): string => product?.name || 'Product\'s name';
@@ -38,10 +19,10 @@ export const getCartItemPrice = (product: any): AgnosticPrice => {
 };
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-export const getCartItemQty = (product: LineItem): number => 1;
+export const getCartItemQty = (product: CartItem): number => 1;
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-export const getCartItemAttributes = (product: LineItem, filterByAttributeName?: Array<string>) => ({ color: 'red' });
+export const getCartItemAttributes = (product: CartItem, filterByAttributeName?: Array<string>) => ({ color: 'red' });
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
 export const getCartItemSku = (product: any): string => product?.sku || 'some-sku';
@@ -58,17 +39,17 @@ export const getCartTotals = (cart: Cart): AgnosticTotals => {
 export const getCartShippingPrice = (cart: Cart): number => 0;
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-export const getCartTotalItems = (cart: Cart): number => 1;
+export const getCartTotalItems = (cart: Cart): number => cart.items.length;
 
 export const getFormattedPrice = (price: number) => String(price);
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-export const getCoupons = (cart: Cart): AgnosticCoupon[] => [];
+export const getCoupons = (cart: Cart): AgnosticCoupon[] => cart.coupons;
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
 export const getDiscounts = (cart: Cart): AgnosticDiscount[] => [];
 
-const cartGetters: CartGetters<Cart, LineItem> = {
+const cartGetters: CartGetters<Cart, CartItem> = {
   getTotals: getCartTotals,
   getShippingPrice: getCartShippingPrice,
   getItems: getCartItems,

diff --git a/packages/boilerplate/composables/src/getters/categoryGetters.ts b/packages/boilerplate/composables/src/getters/categoryGetters.ts
@@ -1,5 +1,5 @@
 import { CategoryGetters, AgnosticCategoryTree } from '@vue-storefront/core';
-import { Category } from '@vue-storefront/boilerplate-api/src/types';
+import { Category } from '@vue-storefront/boilerplate-api';
 
 const itemToTree = (category: Category): AgnosticCategoryTree => {
   return {