chore: fix ~50 eslint errors

.eslintrc.js

@@ -39,6 +39,16 @@ module.exports = {
       }
     ],
     "no-plusplus": "off",
-  }
+  },
+  overrides: [
+    {
+      "files": ["packages/theme/tests/e2e/**/*"],
+      "rules": {
+        "jest/expect-expect": "off",
+        "promise/catch-or-return": "off", // conflicts with Cypress.Chainable
+        "promise/always-return": "off",
+      }
+    }
+  ]
 }
 

packages/composables/src/helpers/htmlDecoder.ts

@@ -1,7 +1,7 @@
 /**
  * @deprecated since version 1.0.0
  */
-export function htmlDecode(input) {
+export function htmlDecode(input: string) {
   const formatName = () => {
     try {
       const domParser = new DOMParser();

packages/theme/components/Header/Navigation/__tests__/HeaderNavigation.spec.js

@@ -1,10 +1,10 @@
 import userEvent from '@testing-library/user-event';
-import HeaderNavigation from '../HeaderNavigation.vue';
 import { render } from '~/test-utils';
 
 import { useUiHelpers } from '~/composables';
 import useUiHelpersMock from '~/test-utils/mocks/useUiHelpersMock';
 import CategoryTreeDataMock from '~/test-utils/mocks/categoryTreeDataMock';
+import HeaderNavigation from '../HeaderNavigation.vue';
 
 jest.mock('~/composables');
 useUiHelpers.mockReturnValue(useUiHelpersMock());

packages/theme/components/Header/Navigation/__tests__/HeaderNavigationItem.spec.js

@@ -1,5 +1,5 @@
-import HeaderNavigationItem from '../HeaderNavigationItem.vue';
 import { render } from '~/test-utils';
+import HeaderNavigationItem from '../HeaderNavigationItem.vue';
 
 describe('HeaderNavigationItem', () => {
   it('display proper label and link', () => {

packages/theme/components/Header/Navigation/__tests__/HeaderNavigationSubcategories.spec.js

@@ -1,9 +1,9 @@
 import userEvent from '@testing-library/user-event';
-import HeaderNavigationSubcategories from '../HeaderNavigationSubcategories.vue';
 import { render } from '~/test-utils';
 import CategoryTreeDataMock from '~/test-utils/mocks/categoryTreeDataMock';
 import { useUiHelpers } from '~/composables';
 import useUiHelpersMock from '~/test-utils/mocks/useUiHelpersMock';
+import HeaderNavigationSubcategories from '../HeaderNavigationSubcategories.vue';
 
 jest.mock('~/composables');
 useUiHelpers.mockReturnValue(useUiHelpersMock());

packages/theme/components/Header/SearchBar/SearchBar.vue

@@ -54,9 +54,9 @@ import {
   defineComponent, ref, watch, useRoute,
 } from '@nuxtjs/composition-api';
 import debounce from 'lodash.debounce';
-import { clickOutside } from '~/utilities/directives/click-outside/click-outside-directive.js';
+import { clickOutside } from '~/utilities/directives/click-outside/click-outside-directive';
 import SvgImage from '~/components/General/SvgImage.vue';
-import { useFacet } from '~/composables';
+import { useFacet } from '~/modules/catalog/category/composables/useFacet';
 
 export default defineComponent({
   name: 'SearchBar',

packages/theme/composables/useContent/commands/loadContentCommand.ts

@@ -1,4 +1,3 @@
-import { Context } from '@nuxt/types';
 import { Logger } from '~/helpers/logger';
 import { VsfContext } from '~/composables/context';
 

packages/theme/ecosystem.config.js

@@ -1,3 +1,5 @@
+// the PM2 ecosystem.config.js needs to use module.exports
+// eslint-disable-next-line unicorn/prefer-module
 module.exports = {
   apps: [
     {

packages/theme/enums/cookieNameEnum.js

@@ -1,4 +1,4 @@
-module.exports = {
+export default {
   currencyCookieName: 'vsf-currency',
   countryCookieName: 'vsf-country',
   localeCookieName: 'vsf-locale',

packages/theme/enums/stockStatusEnum.js

@@ -1,4 +1,4 @@
-module.exports = {
+export default {
   inStock: 'IN_STOCK',
   outOfStock: 'OUT_OF_STOCK',
 };

packages/theme/getters/reviewGetters.ts

@@ -24,7 +24,7 @@ export const getReviewDate = (item: ProductReview): string => item.created_at;
 
 export const getTotalReviews = (review: ProductInterface): number => review?.review_count || 0;
 
-export const getAverageRating = (review: ProductInterface): number => (review?.reviews?.items?.reduce((acc, curr) => Number.parseInt(`${acc}`, 10) + getReviewRating(curr), 0)) / (review?.review_count || 1) || 0;
+export const getAverageRating = (review: ProductInterface): number => ((review?.reviews?.items?.reduce((acc, curr) => Number.parseInt(`${acc}`, 10) + getReviewRating(curr), 0)) ?? 0) / (review?.review_count || 1) || 0;
 
 export const getRatesCount = (_review: ProductReviews): AgnosticRateCount[] => [];
 

packages/theme/helpers/__tests__/asyncLocalStorage.spec.js → packages/theme/helpers/__tests__/asyncLocalStorage.spec.ts

@@ -15,7 +15,7 @@ describe('asyncLocalStorage :: Promised Based Localstorage Management', () => {
 
     expect(localStorage.setItem).toHaveBeenLastCalledWith(VSF_KEY, VSF_VALUE);
     expect(localStorage.__STORE__[VSF_KEY]).toBe(VSF_VALUE);
-    expect(Object.keys(localStorage.__STORE__)).toHaveLength(1);
+    expect(Object.keys(localStorage.__STORE__ as Object)).toHaveLength(1);
   });
 
   test('getItem :: should get value from localStorage by key', async () => {
@@ -44,30 +44,30 @@ describe('asyncLocalStorage :: Promised Based Localstorage Management', () => {
     await setItem(KEY, VALUE);
 
     expect(localStorage.__STORE__[VSF_KEY]).toBe(VSF_VALUE);
-    expect(Object.keys(localStorage.__STORE__)).toHaveLength(1);
+    expect(Object.keys(localStorage.__STORE__ as Object)).toHaveLength(1);
 
     await mergeItem(KEY, MERGE_VALUE);
 
     expect(localStorage.__STORE__[VSF_KEY]).toBe(VSF_MERGE_VALUE);
-    expect(Object.keys(localStorage.__STORE__)).toHaveLength(1);
+    expect(Object.keys(localStorage.__STORE__ as Object)).toHaveLength(1);
   });
 
   test('remove :: should remove a key and value from localStorage', async () => {
     const KEY = 'jest';
     const VSF_KEY = `vsf-${KEY}`;
 
-    expect(Object.keys(localStorage.__STORE__)).toHaveLength(1);
+    expect(Object.keys(localStorage.__STORE__ as Object)).toHaveLength(1);
 
     await removeItem(KEY);
 
     expect(localStorage.removeItem).toHaveBeenCalledWith(VSF_KEY);
-    expect(Object.keys(localStorage.__STORE__)).toHaveLength(0);
+    expect(Object.keys(localStorage.__STORE__ as Object)).toHaveLength(0);
   });
 
   test('clear :: should clear all values and keys from localStorage', async () => {
     await clear();
 
     expect(localStorage.clear).toHaveBeenCalledWith();
-    expect(Object.keys(localStorage.__STORE__)).toHaveLength(0);
+    expect(Object.keys(localStorage.__STORE__ as Object)).toHaveLength(0);
   });
 });

packages/theme/helpers/checkout/__tests__/steps.spec.js

@@ -5,7 +5,7 @@ const CHECKOUT_DATA = {
 };
 
 describe('steps :: steps helper for the checkout', () => {
-  beforeEach(async () => {
+  beforeEach(() => {
     localStorage.clear();
 
     localStorage.setItem('vsf-checkout', JSON.stringify(CHECKOUT_DATA));

packages/theme/helpers/integrationPlugin/context.ts

@@ -2,7 +2,7 @@
 /**
  * It extends given integartion, defined by `tag` in the context.
  */
-export const createExtendIntegrationInCtx = ({ tag, nuxtCtx, inject }) => (integrationProperties) => {
+export const createExtendIntegrationInCtx = ({ tag, nuxtCtx, inject }) => (integrationProperties: Record<string, unknown>) => {
   const integrationKey = `$${tag}`;
 
   if (!nuxtCtx.$vsf || !nuxtCtx.$vsf[integrationKey]) {
@@ -19,7 +19,7 @@ export const createExtendIntegrationInCtx = ({ tag, nuxtCtx, inject }) => (integ
 /**
  * It creates a function that adds an integration to the context under the given name, defined by `tag`.
  */
-export const createAddIntegrationToCtx = ({ tag, nuxtCtx, inject }) => (integrationProperties) => {
+export const createAddIntegrationToCtx = ({ tag, nuxtCtx, inject }) => (integrationProperties: Record<string, unknown>) => {
   const integrationKey = `$${tag}`;
 
   if (nuxtCtx.$vsf && !nuxtCtx.$vsf[integrationKey]) {

packages/theme/helpers/integrationPlugin/index.ts

@@ -2,7 +2,7 @@ import { Context as NuxtContext } from '@nuxt/types';
 import { Inject } from '@nuxt/types/app';
 import axios from 'axios';
 import { createExtendIntegrationInCtx, createAddIntegrationToCtx } from './context';
-import { getIntegrationConfig, createProxiedApi } from './_proxyUtils';
+import { getIntegrationConfig, createProxiedApi, ApiClientMethod } from './_proxyUtils';
 
 interface IntegrationContext {
   integration: {
@@ -30,7 +30,7 @@ const setCookieValues = (cookieValues: Record<string, string>, cookieString = ''
 };
 
 export const integrationPlugin = (pluginFn: NuxtPluginWithIntegration) => (nuxtCtx: NuxtContext, inject: Inject) => {
-  const configure = (tag: string, configuration) => {
+  const configure = (tag: string, configuration: { api: Record<string, ApiClientMethod> }) => {
     const injectInContext = createAddIntegrationToCtx({ tag, nuxtCtx, inject });
     const config = getIntegrationConfig(nuxtCtx, configuration);
     const { middlewareUrl, ssrMiddlewareUrl } = (nuxtCtx as any).$config;
@@ -51,7 +51,7 @@ export const integrationPlugin = (pluginFn: NuxtPluginWithIntegration) => (nuxtC
     injectInContext({ api, client, config });
   };
 
-  const extend = (tag, integrationProperties) => {
+  const extend = (tag, integrationProperties: Record<string, unknown>) => {
     createExtendIntegrationInCtx({ tag, nuxtCtx, inject })(integrationProperties);
   };
 

packages/theme/modules/catalog/category/components/__tests__/CategoryEmptyResults.spec.ts

@@ -1,5 +1,5 @@
-import CategoryEmptyResults from '../CategoryEmptyResults.vue';
 import { render } from '~/test-utils';
+import CategoryEmptyResults from '../CategoryEmptyResults.vue';
 
 describe('CategoryEmptyResults.vue', () => {
   it('Renders with a default value', () => {

packages/theme/modules/catalog/category/composables/useFacet/index.ts

@@ -2,16 +2,16 @@ import { readonly, ref } from '@nuxtjs/composition-api';
 import { Logger } from '~/helpers/logger';
 import type { ComposableFunctionArgs } from '~/composables/types';
 import type { GetProductSearchParams } from '~/modules/catalog/product/types';
-import type {
-  UseFacetInterface, UseFacetErrors, UseFacetSearchResult, FacetSearchParams,
-} from './useFacet';
 import useApi from '~/composables/useApi';
-import GetFacetDataQuery from './getFacetData.gql';
 import { SortingOptions } from '~/modules/catalog/category/composables/useFacet/SortingOptions';
 import { PerPageOptions } from '~/modules/catalog/category/composables/useFacet/PerPageOptions';
 import { createProductAttributeFilterInput } from '~/modules/catalog/category/composables/useFacet/input/createProductAttributeFilterInput';
 import { createProductAttributeSortInput } from '~/modules/catalog/category/composables/useFacet/input/createProductAttributeSortInput';
 import { Products } from '~/modules/GraphQL/types';
+import GetFacetDataQuery from './getFacetData.gql';
+import type {
+  UseFacetInterface, UseFacetErrors, UseFacetSearchResult, FacetSearchParams,
+} from './useFacet';
 
 /**
  * The `useFacet()` composable allows searching for products using facets.

packages/theme/modules/catalog/category/config/__tests__/filtersConfig.spec.ts

@@ -1,8 +1,8 @@
+import config, { FilterTypeEnum } from '~/modules/catalog/category/config/config';
+import RendererTypesEnum from '~/modules/catalog/category/components/filters/renderer/RendererTypesEnum';
 import {
   getFilterConfig, getDisabledFilters,
 } from '../FiltersConfig';
-import config, { FilterTypeEnum } from '~/modules/catalog/category/config/config';
-import RendererTypesEnum from '~/modules/catalog/category/components/filters/renderer/RendererTypesEnum';
 
 jest.mock('~/modules/catalog/category/config/config');
 

packages/theme/modules/catalog/product/composables/useUpsellProducts/index.ts

@@ -1,13 +1,12 @@
 import type { Ref } from '@nuxtjs/composition-api';
 import { ref, readonly, useContext } from '@nuxtjs/composition-api';
+import { Logger } from '~/helpers/logger';
 import type {
   UseUpsellProductsError,
   UseUpsellProductsInterface,
   UseUpsellProductsSearchParams,
 } from './useUpsellProducts';
 
-import { Logger } from '~/helpers/logger';
-
 /**
  * The `useUpsellProducts()` composable allows loading upsell products.
  *

packages/theme/modules/wishlist/getters/wishlistGetters.ts

@@ -94,7 +94,7 @@ const getProducts = (wishlistData: Wishlist[] | Wishlist): {
     quantity: item.quantity,
     added_at: item.added_at,
     id: item.id,
-  }))];
+  })) ?? []];
 
   const mapper = (item) => ({
     product: item.product,

packages/theme/package.json

@@ -41,8 +41,10 @@
     "@vue-storefront/nuxt": "~2.5.6",
     "@vue-storefront/redis-cache": "^1.0.1",
     "axios": "^0.26.1",
+    "body-parser": "1.19.2",
     "cookie-universal-nuxt": "^2.1.5",
     "deepdash": "^5.3.9",
+    "express": "4.17.3",
     "graphql-request": "^4.0.0",
     "is-https": "^4.0.0",
     "isomorphic-dompurify": "^0.18.0",

packages/theme/serverMiddleware/body-parser.js

@@ -1,5 +1,7 @@
-const bodyParser = require('body-parser');
-const app = require('express')();
+import bodyParser from 'body-parser';
+import express from 'express';
+
+const app = express();
 
 app.use(bodyParser.json());
-module.exports = app;
+export default app;

packages/theme/tests/e2e/cypress.json

@@ -2,7 +2,7 @@
   "baseUrl": "http://localhost:3000",
   "fixturesFolder": "tests/e2e/fixtures",
   "integrationFolder": "tests/e2e/integration",
-  "pluginsFile": "tests/e2e/plugins/index.js",
+  "pluginsFile": "tests/e2e/plugins/index.ts",
   "supportFile": "tests/e2e/support/index.js",
   "viewportHeight": 1080,
   "viewportWidth": 1920,

packages/theme/tests/e2e/integration/e2e-user-login.spec.ts

@@ -1,6 +1,7 @@
 import generator from '../utils/data-generator';
 import page from '../pages/factory';
 import requests from '../api/requests';
+import { Customer } from '../types/customer';
 
 before(() => {
   cy.clearLocalStorage();
@@ -16,15 +17,15 @@ context(['regression'], 'User login', () => {
     const data = cy.fixtures.data['Should successfully login'];
     data.customer.email = generator.email;
 
-    requests.createCustomer(data.customer).then(() => {
+    requests.createCustomer(data.customer as Customer).then(() => {
       cy.clearCookies();
     });
 
     page.home.visit();
 
     page.home.header.openLoginModal();
     page.components.loginModal.loginToAccountButton.click();
-    page.components.loginModal.fillForm(data.customer);
+    page.components.loginModal.fillForm(data.customer as Customer);
     page.components.loginModal.loginBtn.click();
     page.components.loginModal.container.should('not.exist');
     page.home.header.account.click();
@@ -37,8 +38,8 @@ context(['regression'], 'User login', () => {
     page.home.visit();
     page.home.header.openLoginModal();
     page.components.loginModal.loginToAccountButton.click();
-    page.components.loginModal.fillForm(data.customer);
+    page.components.loginModal.fillForm(data.customer as Customer);
     page.components.loginModal.loginBtn.click();
-    page.components.loginModal.container.contains(data.errorMessage).should('be.visible');
+    page.components.loginModal.container.contains(data.errorMessage as string).should('be.visible');
   });
 });

packages/theme/tests/e2e/integration/e2e-user-registration.spec.ts

@@ -1,6 +1,7 @@
 import generator from '../utils/data-generator';
 import page from '../pages/factory';
 import requests from '../api/requests';
+import { Customer } from '../types/customer';
 
 before(() => {
   cy.fixture('test-data/e2e-user-registration.json').then((fixture) => {
@@ -16,7 +17,7 @@ context(['regression'], 'User registration', () => {
     data.customer.email = generator.email;
     page.home.visit();
     page.home.header.openLoginModal();
-    page.components.loginModal.fillForm(data.customer);
+    page.components.loginModal.fillForm(data.customer as Customer);
     page.components.loginModal.iWantToCreateAccountCheckbox.click();
     page.components.loginModal.submitButton.click();
     page.components.loginModal.container.should('not.exist');
@@ -28,13 +29,13 @@ context(['regression'], 'User registration', () => {
     const data = cy.fixtures.data['Existing user - should display an error'];
     data.customer.email = generator.email;
 
-    requests.createCustomer(data.customer).then(() => {
+    requests.createCustomer(data.customer as Customer).then(() => {
       cy.clearCookies();
     });
 
     page.home.visit();
     page.home.header.openLoginModal();
-    page.components.loginModal.fillForm(data.customer);
+    page.components.loginModal.fillForm(data.customer as Customer);
     page.components.loginModal.iWantToCreateAccountCheckbox.click();
     page.components.loginModal.submitButton.click();
     page.components.loginModal.container.contains(`${data.errorMessage} '"${data.customer.email}"'`).should('be.visible');

packages/theme/tests/e2e/pages/checkout/Billing.ts

@@ -0,0 +1,15 @@
+import { el } from '../utils/element';
+
+export class Billing {
+  get continueToPaymentButton(): Cypress.Chainable {
+    return el('continue-to-payment');
+  }
+
+  get heading(): Cypress.Chainable {
+    return el('heading-billing');
+  }
+
+  get copyAddressLabel(): Cypress.Chainable {
+    return el('copy-address', 'label');
+  }
+}