feat: testing quick order, istanbul install (#752)

* feat: testing quick order, istanbul install * fix: reducing to one omounted test * fix: render testing * fix: lint * style: separating mock info
bigcommerce · Jan 22, 2024 · f891bcc · f891bcc
1 parent 5f03541
commit f891bcc
Show file tree

Hide file tree

Showing 7 changed files with 310 additions and 31 deletions.
diff --git a/apps/storefront/.eslintignore b/apps/storefront/.eslintignore
@@ -0,0 +1 @@
+vitest.config.ts
diff --git a/apps/storefront/package.json b/apps/storefront/package.json
@@ -63,6 +63,7 @@
     "@types/uuid": "^8.3.4",
     "@vitejs/plugin-legacy": "^2.0.0",
     "@vitejs/plugin-react": "^2.0.0",
+    "@vitest/coverage-istanbul": "^0.34.4",
     "babel-plugin-import": "^1.13.8",
     "c8": "^7.11.3",
     "eslint": "^7.32.0 || ^8.2.0",

diff --git a/apps/storefront/src/utils/b3Picker.ts b/apps/storefront/src/utils/b3Picker.ts
@@ -1,6 +1,6 @@
 import { format, subDays } from 'date-fns'
 
-const distanceDay = (distanceDay = 0, dateFormat = 'yyyy-MM-dd'): string =>
-  format(subDays(new Date(), distanceDay), dateFormat)
+const distanceDay = (_distanceDay = 0, dateFormat = 'yyyy-MM-dd'): string =>
+  format(subDays(new Date(), _distanceDay), dateFormat)
 
 export default distanceDay
diff --git a/apps/storefront/tests/components/quickOrder/QuickOrder.test.tsx b/apps/storefront/tests/components/quickOrder/QuickOrder.test.tsx
@@ -0,0 +1,44 @@
+import { beforeEach, describe, it, vi } from 'vitest'
+
+import { ThemeFrame } from '@/components'
+import Quickorder from '@/pages/quickorder/Quickorder'
+import { GlobalProvider } from '@/shared/global'
+import global from '@/store/slices/global'
+import theme from '@/store/slices/theme'
+
+import { renderWithProviders } from '../../test-utils'
+
+import { mockActiveCurrency, mockCurrencies } from './mock'
+
+vi.mock('react-intl', () => ({
+  useIntl: vi.fn(() => ({ formatMessage: vi.fn() })),
+}))
+
+vi.mock('react-router-dom', () => ({
+  useNavigate: vi.fn(),
+}))
+
+vi.mock('date-fns', () => ({
+  format: vi.fn(),
+  subDays: vi.fn(),
+}))
+
+describe('Quickorder component', () => {
+  beforeEach(() => {
+    window.sessionStorage.setItem('sf-activeCurrency', mockActiveCurrency)
+    window.sessionStorage.setItem('sf-currencies', mockCurrencies)
+  })
+
+  it('renders correctly', () => {
+    renderWithProviders(
+      <GlobalProvider>
+        <ThemeFrame title="test-frame">
+          <Quickorder />
+        </ThemeFrame>
+      </GlobalProvider>,
+      {
+        reducers: { global, theme },
+      }
+    )
+  })
+})
diff --git a/apps/storefront/tests/components/quickOrder/mock/index.ts b/apps/storefront/tests/components/quickOrder/mock/index.ts
@@ -0,0 +1,57 @@
+export const mockActiveCurrency = '{ "node": {"entityId": 2, "isActive": true}}'
+
+export const mockCurrencies = `{ "currencies": [{
+      "auto_update": false,
+      "country_iso2": "CA",
+      "currency_code": "CAD",
+      "currency_exchange_rate": "1.25",
+      "decimal_places": 2,
+      "decimal_token": ".",
+      "default_for_country_codes": ["CA"],
+      "enabled": true,
+      "id": "2",
+      "is_default": true,
+      "is_transactional": true,
+      "last_updated": "2023-01-01",
+      "name": "Canadian Dollar",
+      "thousands_token": ",",
+      "token": "$",
+      "token_location": "left"
+    },
+    {
+      "auto_update": true,
+      "country_iso2": "GB",
+      "currency_code": "GBP",
+      "currency_exchange_rate": "0.75",
+      "decimal_places": 2,
+      "decimal_token": ".",
+      "default_for_country_codes": ["GB"],
+      "enabled": true,
+      "id": "3",
+      "is_default": false,
+      "is_transactional": true,
+      "last_updated": "2023-01-01",
+      "name": "British Pound Sterling",
+      "thousands_token": ",",
+      "token": "£",
+      "token_location": "left"
+    },
+    {
+      "auto_update": true,
+      "country_iso2": "JP",
+      "currency_code": "JPY",
+      "currency_exchange_rate": "110",
+      "decimal_places": 0,
+      "decimal_token": "",
+      "default_for_country_codes": ["JP"],
+      "enabled": true,
+      "id": "4",
+      "is_default": false,
+      "is_transactional": true,
+      "last_updated": "2023-01-01",
+      "name": "Japanese Yen",
+      "thousands_token": ",",
+      "token": "¥",
+      "token_location": "left"
+    }
+]}`
diff --git a/apps/storefront/vite.config.ts b/apps/storefront/vite.config.ts
@@ -55,6 +55,9 @@ export default defineConfig(({ mode }) => {
     },
     test: {
       environment: 'jsdom',
+      coverage: {
+        reporter: ['text', 'html', 'clover', 'json'],
+      },
     },
     resolve: {
       alias: {