53 lines
2.9 KiB
Markdown
53 lines
2.9 KiB
Markdown
# Integration Test Instructions
|
|
|
|
## Purpose
|
|
This feature consists of a single unit (`react-frontend-app`, a static marketing site with no backend service and no other units to integrate with). There is no cross-service integration to test. Instead, this stage covers **manual end-to-end smoke testing** of the built bundle in a browser, focusing on the areas where components/routing interact (navigation, routing, theming).
|
|
|
|
## Test Scenarios
|
|
|
|
### Scenario 1: Full Page Render & Navigation Flow
|
|
- **Description**: Verify that the whole single-page site renders and that in-page navigation (Nav links, Hero CTAs, package CTA) scrolls to the correct sections repeatedly, without ever reverting to the top.
|
|
- **Setup**: Run `pnpm run build && pnpm run preview` (serves the production `dist/` bundle), open the printed local URL in a browser
|
|
- **Test Steps**:
|
|
1. Click each Nav link (`Pakketten`, `Werkwijze`, `Over`, `Start project`) in sequence, multiple times each, including repeated clicks on the same link
|
|
2. Click the Hero CTAs (`Bekijk pakketten`, `Plan een gesprek`)
|
|
3. Click a package card's CTA (`Kies ...` / `Vraag offerte aan`)
|
|
4. Click the logo (`SLP.Software`) to return to `#top`
|
|
- **Expected Results**: Every click smoothly scrolls to the correct section every time; the page never snaps back to the top on a repeated/second click (this was the regression fixed via `handleAnchorClick`/`scrollToHash`); the URL hash is not required to change for scrolling to work
|
|
- **Cleanup**: Stop the `pnpm run preview` process
|
|
|
|
### Scenario 2: Theme Toggle Integration
|
|
- **Description**: Verify the theme toggle correctly switches and persists across the whole page (all sections read from the same theme context)
|
|
- **Setup**: Same as Scenario 1
|
|
- **Test Steps**: Toggle the theme control in the Nav; observe all sections (Hero, Packages, Process, About, Contact)
|
|
- **Expected Results**: All sections switch theme consistently; no section is left in the previous theme
|
|
- **Cleanup**: None
|
|
|
|
## Setup Integration Test Environment
|
|
|
|
### 1. Build and Serve the Production Bundle
|
|
```bash
|
|
pnpm run build
|
|
pnpm run preview
|
|
```
|
|
|
|
### 2. Configure Service Endpoints
|
|
Not applicable — no external services or APIs are called by this unit.
|
|
|
|
## Run Integration Tests
|
|
|
|
### 1. Execute Manual Smoke Test Suite
|
|
Follow Scenario 1 and Scenario 2 above in a browser against the `pnpm run preview` URL.
|
|
|
|
### 2. Verify Behaviors
|
|
- **Test Scenarios**: Navigation/scroll repeatability (Scenario 1), theme consistency (Scenario 2)
|
|
- **Expected Results**: See per-scenario expectations above
|
|
- **Logs Location**: Browser DevTools console (should show no errors/warnings during navigation)
|
|
|
|
### 3. Cleanup
|
|
Stop the preview server (`Ctrl+C` or terminate the process).
|
|
|
|
## Status
|
|
- **Automated integration/contract tests**: N/A — single static unit, no service boundaries to test
|
|
- **Manual smoke test**: Recommended before each deployment; the navigation-scroll regression (Scenario 1) was manually verified as fixed during this session
|