Skip to main content

Vitest Testing

What we are testing

Snappycart is a reusable cart library. Vitest gives us the cheapest and fastest confidence for internal cart logic and the public React contract before browser-level tests run.

This page covers two Vitest layers:

  • reducer unit tests
  • provider and hook integration tests

It does not replace browser-level component coverage, and it does not replace demo-level end-to-end coverage.

For the full inventory and recommended test counts across all layers, read the Cart testing plan.

Scope of Vitest Testing

Vitest is the right place for:

  • reducer-only cart logic
  • quantity normalisation rules
  • derived values such as total item count and subtotal
  • CartProvider state updates
  • useCart contract behaviour
  • guard behaviour when hooks are used outside the provider

Vitest is not the main place for:

  • browser rendering behaviour
  • focus management
  • overlay clicks
  • keyboard interaction in the DOM
  • visual component transitions

Those belong in Cypress/Playwright Component Testing or browser-level end-to-end testing.

Where Vitest tests live

Vitest tests should live close to the source they validate.

Use files such as:

packages/snappycart/src/cart/context/cartReducer.test.ts
packages/snappycart/src/cart/context/CartProvider.test.tsx

Test ID contract

We use VT-* as the stable test ID contract for Vitest coverage.

Examples:

  • VT-01
  • VT-02
  • VT-16

This keeps Vitest coverage separate from Cypress Component Testing IDs such as CT-01.

Unit test harness guidance

Reducer tests should stay focused on pure business logic.

Recommended fixture style:

const apple = {
id: 'apple',
name: 'Apple',
price: 1.5,
image: '/apple.png',
};

Use stable, explicit fixtures and assert one main behaviour per test.

Vitest unit coverage matrix

Use this table to decide what belongs in reducer unit tests.

IDAreaLevelFrameworkWhat is coveredWhat to assert in Vitest
VT-01Cart reducerUnitVitestadd new itemNew line is inserted with the expected quantity and values
VT-02Cart reducerUnitVitestadd existing item and merge quantityDuplicate add increases quantity instead of creating a second line
VT-03Cart reducerUnitVitestadd item with invalid quantity and normalise itInvalid quantity is converted to a safe stored value
VT-04Cart reducerUnitVitestadd item with decimal quantity and floor itDecimal quantity is normalised before storage
VT-05Cart reducerUnitVitestremove itemMatching line is removed from the reducer state
VT-06Cart reducerUnitVitestincrement itemQuantity increases by one
VT-07Cart reducerUnitVitestdecrement item above oneQuantity decreases without removing the line
VT-08Cart reducerUnitVitestdecrement item from one and remove the lineItem disappears when quantity reaches the removal boundary
VT-09Cart reducerUnitVitestset positive quantityQuantity updates directly to the requested value
VT-10Cart reducerUnitVitestset decimal quantity and floor itDecimal quantity is normalised before storage
VT-11Cart reducerUnitVitestset quantity to zero and remove the lineZero quantity removes the line from state
VT-12Cart reducerUnitVitestset negative quantity and remove the lineInvalid negative quantity does not remain in state
VT-13Cart reducerUnitVitestclear cartState resets to an empty cart
VT-14Cart reducerUnitVitestcalculate total itemsDerived total item count is correct
VT-15Cart reducerUnitVitestcalculate subtotalDerived subtotal is correct

Vitest integration coverage matrix

Use this table to decide what belongs in provider and hook integration tests.

IDAreaLevelFrameworkWhat is coveredWhat to assert in Vitest
VT-16Cart provider and hook contractIntegrationVitestthrows outside provideruseCart fails when used without CartProvider
VT-17Cart provider and hook contractIntegrationVitestexposes empty initial stateEmpty cart contract is available on first render
VT-18Cart provider and hook contractIntegrationVitestadd item updates items, totalItems, and subtotalPublic cart state updates correctly through hook usage
VT-19Cart provider and hook contractIntegrationVitestremove item updates derived valuesRemoving a line updates totals correctly
VT-20Cart provider and hook contractIntegrationVitestincrement and decrement update derived valuesQuantity changes keep derived state in sync
VT-21Cart provider and hook contractIntegrationVitestclear resets statePublic cart state returns to empty after clear
VT-22Cart provider and hook contractIntegrationVitestadd item with explicit quantityExtra scenario: Additional integration coverage kept outside the canonical VT-* baseline

The canonical Vitest baseline currently maps to VT-01 through VT-21.

The current suite contain additional Vitest scenarios beyond that baseline when they provide useful extra confidence. Those rows should be marked as extra coverage with a new canonical VT-* ID.

How to use these matrices

When adding or reviewing a Vitest test:

  • identify whether the behaviour belongs to reducer logic or the provider and hook contract
  • map the test to one VT-* entry
  • keep one meaningful behaviour per test
  • prefer public behaviour over implementation details

Every new Vitest contribution should map to at least one row in the matrices above.

Coverage guidance for contributors

Prioritise these rows first:

  • add new item
  • merge quantity for existing item
  • decrement to removal
  • clear cart
  • total item calculation
  • subtotal calculation
  • hook guard outside provider
  • empty initial provider state
  • add item through provider
  • remove item through provider

Avoid spreading the same behaviour across reducer tests and provider tests unless the duplication is intentional and valuable.