[testing] Generate frontend component and browser journey testing defaults

[kang-heewon]

Priority

P1 — can proceed after the public TestKernel shape in #1482 is stable.

Problem

Generated frontend applications currently have build, preview, typecheck, and a Vite config smoke, but no test command, component-test environment, API mocking convention, or browser journey. This leaves every application to invent its own frontend testing architecture and means generated full-stack apps do not prove that Problems and generated RPC clients are handled correctly in the browser.

Desired outcome

Generate an opinionated but replaceable frontend testing baseline:

• Vitest Browser Mode for React component tests;
• Testing Library-compatible interaction helpers;
• MSW at frontend API boundaries;
• Playwright for full-stack user journeys;
• failure artifacts correlated with backend test evidence where possible.

Generated structure

apps/console-web/
  src/**/*.component.spec.tsx
  src/test/browser.ts
  src/test/server.ts
  vitest.config.ts

tests/journeys/
  create-user.spec.ts
  problem-rendering.spec.ts
playwright.config.ts

Acceptance criteria

• Generated React apps expose test:component, test:journey, and an aggregate test/test:ci path.
• Component tests run in a real Chromium browser through Vitest Browser Mode, not jsdom by default.
• MSW blocks unhandled API requests and reports the contract/URL that escaped the fixture.
• At least one generated component test proves RFC 7807 Problem code/status/recovery rendering.
• At least one Playwright journey runs against the generated Croco API and exercises a successful typed RPC/REST flow.
• At least one failure journey proves that an API Problem is visible to the user rather than silently swallowed.
• Playwright retains trace, screenshot, browser console errors, and failed network requests on failure.
• CI uploads browser artifacts and merges shard results when sharding is enabled.
• The generated app smoke matrix validates that every frontend-bearing preset contains and can execute the supported testing configuration.
• Users can remove/replace Playwright or Browser Mode without changing @croco/testing core APIs.

Non-goals

• A Croco-owned browser automation engine.
• Visual regression hosting or a mandatory third-party SaaS.
• Testing every generated page.

Validation

Extend create-croco-app template contract tests and generated-app smoke to install, build, run component tests, and run one browser journey for the primary production/full-stack preset.