bermudalamb
332c1e7cd0
SonarQube reported 0% coverage for 78 unit, 134 integration and 83 end-to-end tests, so the coverage-on-new-code gate — the most useful thing SonarQube offers a project this size — has been failing permanently while looking configured. It now reports 69.6%, verified by a real scan. Backend coverage comes from both suites, written to separate directories because jest writes coverage/lcov.info by default and the second run would silently overwrite the first. Both are needed rather than just the fast one: the unit suite alone reports 11%, because everything in src/routes is exercised by the integration suite. That suite is manual-only after hanging for 3h12m post-run, so it runs here with --forceExit and the job carries a hard timeout; jest confirmed during testing that it would otherwise have hung. The frontend had no unit tests at all, so its coverage comes from Playwright driving an istanbul-instrumented dev server, collected per test by an auto-fixture and merged with nyc. The 17 specs now import from a local fixtures module that re-exports @playwright/test, which is what lets the fixture attach without touching each test body. Instrumentation is gated behind COVERAGE=true and loaded by dynamic import, since vite-plugin-istanbul is ESM-only while vite.config.ts evaluates as CommonJS. Both directions were checked rather than assumed: a normal build contains no instrumentation, and the dev server instruments nested modules as well as top-level ones — the first attempt used an include glob of src/* which would have silently missed everything under src/admin and src/cart. coverage:report fails when nothing was collected instead of writing an empty report, and that guard was fired deliberately to confirm it works. This project has been bitten twice by tools succeeding while measuring nothing — SonarQube skipping the whole frontend and still exiting EXECUTION SUCCESS in #67, and an ESLint matcher silently matching no files during #60 — and coverage has exactly that shape: an uninstrumented dev server lets every test pass while gathering nothing, and the 0% that follows reads as lost coverage rather than broken collection. Worth knowing when reading the numbers: end-to-end coverage flatters. Istanbul marks a line covered when the browser ran it, so a component rendered during a test counts as covered with nothing asserting anything about it. Recorded in the design doc and the project context rather than left to be discovered. Also declares sonar.tests so test files are analysed under the test rule set rather than as production code. Closes #61
78 lines
3.6 KiB
TypeScript
78 lines
3.6 KiB
TypeScript
import { test, expect } from './fixtures';
|
|
|
|
const suffix = () => `i${Date.now().toString(36)}${Math.random().toString(36).slice(2, 7)}`;
|
|
|
|
// Opening the form kicks off a categories fetch. Interacting with the category
|
|
// field before it lands means the tree re-renders under the cursor, so wait for
|
|
// the data rather than racing it.
|
|
async function openItemForm(page: import('@playwright/test').Page) {
|
|
// Opening the form fetches both categories and tags, and each one re-renders
|
|
// the modal as it lands. Waiting for only one still leaves the second to
|
|
// reflow the popup mid-interaction.
|
|
const loaded = Promise.all([
|
|
page.waitForResponse((res) => res.url().includes('/api/admin/categories') && res.request().method() === 'GET'),
|
|
page.waitForResponse((res) => res.url().includes('/api/admin/tags') && res.request().method() === 'GET')
|
|
]);
|
|
await page.getByRole('button', { name: 'Add Item' }).click();
|
|
await loaded;
|
|
}
|
|
|
|
test.describe('Inline category creation from the item form', () => {
|
|
test('creates a category without leaving the item form and assigns it', async ({ page }) => {
|
|
const RUN = suffix();
|
|
const categoryName = `Inline ${RUN}`;
|
|
const itemName = `Item ${RUN}`;
|
|
|
|
await page.goto('/admin');
|
|
await openItemForm(page);
|
|
await page.getByLabel('Name').fill(itemName);
|
|
await page.getByLabel('Price (USD)').fill('99');
|
|
|
|
await page.getByRole('dialog').getByLabel('Category', { exact: true }).click();
|
|
const nameInput = page.getByPlaceholder('New category name');
|
|
await expect(nameInput).toBeVisible();
|
|
await expect(page.getByRole('button', { name: 'Create category' })).toBeVisible();
|
|
await nameInput.fill(categoryName);
|
|
// Submitted with Enter rather than a click: the popup sits over a
|
|
// virtualized tree that keeps re-measuring, so a click target inside it is
|
|
// never geometrically stable. Enter runs the same handler as the button.
|
|
await nameInput.press('Enter');
|
|
|
|
// The new category should be selected straight away — having to hunt for it
|
|
// in the tree afterwards defeats the point of creating it inline.
|
|
await expect(page.getByRole('dialog').getByText(categoryName)).toBeVisible();
|
|
|
|
await page.getByRole('button', { name: 'OK' }).click();
|
|
await expect(page.getByText('Item added')).toBeVisible();
|
|
|
|
const items = await (await page.request.get('/api/admin/items')).json();
|
|
const saved = items.find((item: { name: string }) => item.name === itemName);
|
|
expect(saved).toBeTruthy();
|
|
expect(saved.category_name).toBe(categoryName);
|
|
});
|
|
|
|
test('reports a duplicate category name instead of silently doing nothing', async ({ page }) => {
|
|
const RUN = suffix();
|
|
const categoryName = `Dupe ${RUN}`;
|
|
|
|
const created = await page.request.post('/api/admin/categories', {
|
|
data: { name: categoryName, parent_id: null }
|
|
});
|
|
expect(created.status()).toBe(201);
|
|
|
|
await page.goto('/admin');
|
|
await openItemForm(page);
|
|
await page.getByRole('dialog').getByLabel('Category', { exact: true }).click();
|
|
const nameInput = page.getByPlaceholder('New category name');
|
|
await expect(nameInput).toBeVisible();
|
|
await expect(page.getByRole('button', { name: 'Create category' })).toBeVisible();
|
|
await nameInput.fill(categoryName);
|
|
// Submitted with Enter rather than a click: the popup sits over a
|
|
// virtualized tree that keeps re-measuring, so a click target inside it is
|
|
// never geometrically stable. Enter runs the same handler as the button.
|
|
await nameInput.press('Enter');
|
|
|
|
await expect(page.getByText(/already exists/i)).toBeVisible();
|
|
});
|
|
});
|