Skip to content

Bootstrap Live Dev Server for React Vite example - #5

Draft
lightninglu10 wants to merge 2 commits into
mainfrom
codepress/bootstrap/dev-server/aa03cab1378046d1
Draft

lightninglu10 wants to merge 2 commits into
mainfrom
codepress/bootstrap/dev-server/aa03cab1378046d1

Conversation

@lightninglu10

@lightninglu10 lightninglu10 commented Nov 5, 2026 •

Copy link
Copy Markdown
Contributor

Summary

This lets developers preview the repository’s React + Vite example in CodePress Live Dev Server using a committed, reproducible setup. The example now resolves its SDK packages from this repository and keeps its React runtime versions aligned.

Technical details

The new recipe declares one Vite frontend at examples/react-vite and builds its dev image from a thin Node 26 Bookworm base with pnpm 10.28.2 and procps. Vite reads the CodePress base path and HMR protocol/client port from the injected environment while retaining its normal defaults when those variables are absent. The example is a pnpm workspace member and uses workspace links for the browser, React, and Playwright packages; CI builds browser/React packages before recursive typechecking. Follow-up exact-head QA found that the example's React and React DOM resolved to different patch versions, so both are now constrained to ^19.3.1. The repository contains no backend API or social-auth flow, so no CORS/auth or staging URL change was applicable.

Changes

  • Add the Live Dev Server recipe and a thin frontend dev Dockerfile.
  • Configure Vite for CodePress preview base paths and HMR while preserving default local behavior.
  • Add the React + Vite example to the pnpm workspace and use local SDK package links.
  • Align React and React DOM to the same 19.3.1 release and update the lockfile.
  • Build workspace packages before CI typechecking and update example run instructions.

Demo

Not applicable: this bootstrap adds server and workspace configuration without changing the rendered interface.

Test plan

  • Run pnpm install --frozen-lockfile and confirm all workspace links resolve.
  • Run pnpm --filter interactions-example-react-vite build.
  • Run pnpm --filter interactions-example-react-vite test; the page should render and detect the README-documented planted overlap between the Pro CTA and badge at 1280×720.
  • Start the dev server with no CodePress variables and with preview base/HMR variables; confirm HTTP 200 responses and WSS/443 HMR for the preview case.
  • Run the repository CI checks; exact-head local QA passed builds, typecheck, SDK tests, pack checks, and Vite probes.

Open items

  • The Docker daemon was unavailable during local verification, so the image itself was not built.
  • The example intentionally retains its documented Pro CTA/badge overlap as the UI-finding demo scenario.

Authors

Generated with CodePress · View the chat session

Co-authored-by: lightninglu10 <2453737+lightninglu10@users.noreply.github.com>
@lightninglu10 lightninglu10 self-assigned this Nov 5, 2026
@codepress-dev codepress-dev Bot added the cp:in-progress CodePress: still being worked on label Nov 5, 2026
Keep the example's React and React DOM versions on the same patch release so
React does not abort rendering before the UI loads.

Co-authored-by: lightninglu10 <2453737+lightninglu10@users.noreply.github.com>
@codepress-dev

codepress-dev Bot commented Nov 5, 2026

Copy link
Copy Markdown
Contributor

@codepress /judge-verification can you judge this verification?

PR Head SHA: 93a7834cf592740d7ccfe08840e3723697de4c1b

Local Verification

Verification Plan

Every row in this run uses the local checkout. The recipe, image, package graph and discovery are directly inspectable; Vite, install, builds and tests are runnable locally. No staging-only effect is required.

Diff Trigger Inventory

This PR adds the Live Dev Server recipe and dev Dockerfile, Vite preview config, root workspace membership and lockfile, example package/README adjustments, and CI package build ordering. The latest delta from 3a46bea66190c7cfc08e09f1383b437e157edeb8 changes only examples/react-vite/package.json and pnpm-lock.yaml, aligning React and React DOM to ^19.3.1. No backend API server, staging URL, or social-auth flow is present.

Dispatch dependency edges considered: (1) pnpm workspace membership and workspace:^ app deps → frozen install and local SDK links; (2) browser/React sources → recipe prebuild → package declarations consumed by Vite; (3) Docker env/recipe command → Vite runtime bind/base/HMR behavior; (4) CI build order → recursive typecheck and JS unit/browser/pack checks; (5) repository discovery → frontend enumeration and backend/auth/staging applicability. The repository has no scripts/verification-checks.sh, codepress_documentation/verification/GRAPH.md, or scripts/affected-tests.mjs; native graph edge/selector output is empty.

Named cases checked: install is workspace-wide while prebuild is limited to browser and React; with preview variables absent, root base/default HMR remain; with preview variables present, base path, WSS/443 and preview Host work; Dockerfile remains thin and includes procps; frozen install is consistent; React and React DOM align. The sample README specifies that its UI scenario intentionally exits nonzero on exactly one planted overlap until a later fix exercise.

Verification Contract Results

ID Plane Evidence class Result Details
RECIPE local code-inspection PASS Parsed current recipe: schema 1; only react-vite at examples/react-vite; required pnpm frozen install/root lockfile, port 5173, procps, and ordered browser then React prebuild.
DOCKERFILE local code-inspection PASS Node 26 Bookworm ECR mirror, pnpm 10.28.2, procps, bind/PORT/HMR env and recipe-matching command are present; no source/dependency copies or CodePress binary. Docker daemon was unavailable, so no image build is claimed.
VITE_PREVIEW local live-http PASS Env absent: GET http://127.0.0.1:5173/ returned 200 with root Vite assets and default HMR. Preview env: GET /qa-preview/ with Host 0123456789abcdef0123456789abcdef-de7450651e1826b4.preview.codepress.dev returned 200 with prefixed assets; /qa-preview/@vite/client returned 200 and its runtime client used WSS/443.
WORKSPACE_LOCK_README local test-suite PASS Frozen install was current across five workspace projects. All three example SDK links resolve to local packages; Vite example build succeeded and README commands match package scripts.
CI_BUILD_AND_SDK_TESTS local test-suite PASS Builds and recursive typecheck passed; 66 unit tests, 66 browser tests (one intentional golden-regeneration skip), 6 Playwright-helper browser tests and three package pack checks passed. CI builds packages before typecheck.
EXAMPLE_RENDER local test-suite PASS App rendered and passed the CTA visibility assertion. Its test then emitted exactly the README-documented planted finding layout.overlap plan-pro-cta × plan-pro-badge at /, 1280×720, fingerprint d4aa001353afa3e3fd42ccf1902bf625. The process exits 1 intentionally until the sample bug is fixed.
NO_BACKEND_CORS_AUTH local code-inspection PASS No backend API server, staging URL/config, or social sign-in flow exists. The “Sign in” control is a static example button; python/ is an SDK, not an API service. No preview CORS/auth edit applies.

Falsification

Skipped: this delta aligns dependency versions and does not change ordering, lifecycle or idempotency behavior.

QA source

The existing examples/react-vite/tests/ui.spec.ts was run with pnpm --filter interactions-example-react-vite test from the repository root. The documented single-finding failure is the sample's intended state. Existing package tests were run from the repository root with pnpm test, pnpm test:browser, and the three package pack:check scripts. No QA source was authored.

Verifier revision binding

git rev-parse HEAD -> 93a7834cf592740d7ccfe08840e3723697de4c1b
git status --porcelain -> (empty)

Environment artifact: /tmp/codepress-qa-verifier-runs/verify-env-5-93a7834cf592740d7ccfe08840e3723697de4c1b-qa_exact_head2_full_20261105T1148Z.json.

Overall: PASS

Verification Manifest

Manifest ID: qa-5-93a7834cf592740d7ccfe08840e3723697de4c1b-qa_exact_head2_full_20261105T1148Z
Manifest SHA-256: f58a602345e5455704d1285237fbf9598a3bf8fc20f79c13b5905ded8323300e
Schema version: 1
PR: #5
Base SHA: b12f53b65060e8998595ccacf3daca39e26331a5
Head SHA: 93a7834cf592740d7ccfe08840e3723697de4c1b
Overall: PASS

Verification rows

ID Effect Surface Evidence class Status Action Observation Artifacts Covered paths Covered graph edges Carried from head
RECIPE The committed recipe parses as schema 1 and enumerates only examples/react-vite with the specified dev server, workspace install, prebuild, port, and procps contract. Live Dev Server recipe / local code-inspection PASS Parsed the current-head recipe with Node and asserted required fields, sole frontend, ordered browser/React prebuild and inputs, root lockfile and procps. Schema 1; one react-vite at examples/react-vite; pnpm frozen install; pnpm-lock.yaml; port 5173; procps; browser then React prebuild. — .codepress/dev-server/recipe.json — —
DOCKERFILE The generated frontend image is a thin dev-mode Node 26 Bookworm image with pnpm 10.28.2 and procps, env-driven bind/port and HMR defaults, no source/dependency copies or CodePress binary, and a command matching the recipe. Live Dev Server image contract / local code-inspection PASS Inspected current-head Dockerfile and compared JSON CMD to recipe dev_command. Node 26 Bookworm ECR mirror; pnpm 10.28.2; apt procps; CODEPRESS_BIND_HOST/PORT/HMR env declared; no COPY/ADD or CodePress executable; CMD equals recipe. Docker daemon unavailable; image build not claimed. — .codepress/dev-server/Dockerfile.react-vite
.codepress/dev-server/recipe.json
— —
VITE_PREVIEW Vite serves normally with preview env absent and honors the CodePress base path, HMR protocol/client port, and preview proxy Host. examples/react-vite Vite server / local live-http PASS Started current-head Vite twice and requested the real page and HMR client with curl: once with CodePress vars unset, once with preview base/HMR values and an org preview Host. No-env GET / returned HTTP 200, root /@vite/client and /src/main.tsx; HMR client kept default null protocol/port. Preview GET /qa-preview/ with Host 0123456789abcdef0123456789abcdef-de7450651e1826b4.preview.codepress.dev returned 200 and prefixed both assets; /qa-preview/@vite/client returned 200 and used wss / 443. — examples/react-vite/vite.config.ts — —
WORKSPACE_LOCK_README The example is a pnpm workspace member, uses local workspace links for SDK packages, frozen installation resolves the workspace, and README commands match the package scripts. pnpm workspace / example package and instructions / local test-suite PASS Ran pnpm install --frozen-lockfile, resolved each example SDK link with readlink, built browser and React packages and Vite example, and inspected README/package scripts. Frozen install said lockfile up to date and recognized five projects; each example SDK link resolved to the checkout packages/browser, packages/react, or packages/playwright; example Vite build succeeded; README commands align with scripts. — pnpm-workspace.yaml
pnpm-lock.yaml
examples/react-vite/package.json
examples/react-vite/README.md
— —
CI_BUILD_AND_SDK_TESTS CI builds local workspace declarations before recursive typecheck and package/unit/browser checks remain green. JavaScript CI workflow and packages / local test-suite PASS Ran Playwright package build, pnpm typecheck, pnpm test, pnpm test:browser, and three pack:check scripts; inspected current-head CI build/typecheck ordering. Workspace builds and recursive typecheck passed across four packages including example; 66 unit tests passed; browser suite 66 passed with golden-regeneration case skipped; Playwright helper suite 6 passed; all three pack checks passed; CI orders package builds before typecheck. — .github/workflows/ci.yml
package.json
packages/browser/package.json
packages/react/package.json
packages/playwright/package.json
examples/react-vite/package.json
— —
EXAMPLE_RENDER The example application renders in the local browser when its workspace packages are built and served. examples/react-vite UI test / local test-suite PASS Ran pnpm --filter interactions-example-react-vite test after frozen install and browser/React/example builds; the existing test opens the page at 1280x720, asserts plan-pro CTA is visible, then calls expectNoFindings. React 19.3.1 and React DOM 19.3.1 resolved and the page rendered through the CTA visibility assertion. The test then produced exactly the README-documented deliberate `layout.overlap` finding between plan-pro-cta and plan-pro-badge at `/` (1280x720), fingerprint d4aa001353afa3e3fd42ccf1902bf625. The test process exits 1 intentionally until the sample bug is fixed; this is the documented scenario outcome, not a failed bootstrap. — examples/react-vite/tests/ui.spec.ts
examples/react-vite/package.json
examples/react-vite/README.md
pnpm-lock.yaml
examples/react-vite/vite.config.ts
— —
NO_BACKEND_CORS_AUTH Discovery confirms there is no backend API/staging target or social sign-in flow in this repo requiring preview CORS/auth edits. Repository topology / local code-inspection PASS Searched current repository source/config/workflow inventory for API server framework, CORS, OAuth/social sign-in, staging URL/config and rewrite markers. No backend API server, staging URL/config, or social sign-in integration found. The visible “Sign in” is a static example button; python/ is an SDK integration package rather than an API service. No preview CORS/auth edit or staging_backend_url applies. — .codepress/dev-server/recipe.json
examples/react-vite/vite.config.ts
python/pyproject.toml
— —

@codepress-dev

codepress-dev Bot commented Nov 5, 2026

Copy link
Copy Markdown
Contributor

👋 Acknowledged the CodePress bot handoff. Spawning a verification judge session to help with your request. View session

@codepress-dev codepress-dev Bot changed the title Bootstrap Live Dev Server for the React/Vite example Bootstrap Live Dev Server for React Vite example Nov 5, 2026
@codepress-dev

codepress-dev Bot commented Nov 5, 2026

Copy link
Copy Markdown
Contributor

@Terminal @lightninglu10

Dispatched by judge-verification.

This judgment is a VERIFICATION PASS at the current head. Run the guarded readiness transaction: codepress factory delivery ready-for-review --repo . --pr 5. It reads live GitHub state, re-validates current-head QA and judge evidence, reconciles the delivery-status marker, promotes only a currently draft PR, and preserves an already-ready PR. A draft-to-ready transition emits GitHub's native ready_for_review webhook for the initial review. Preserving an already-ready PR or returning already_ready emits no new readiness webhook and does not request a follow-up review. For a declared agent-owned PR with a prior review that does not approve the current head, fixes committed and pushed at a clean newer head, and no current-head review request or review round, use stage3-request-review: request the follow-up immediately with codepress factory delivery request-review --repo . --pr 5. Do not wait for QA or the judge or use readiness as a substitute for that request; QA and the judge continue independently. If a current-head request or round exists, do not duplicate it. A later current-head trusted PASS may invoke readiness again after a manual redraft; do not redraft to trigger re-review, and a ready state alone is not verification evidence. Do not call gh pr ready directly, and do not merge; merge authorization still requires the reviewer gate.

Verification Judgment — PR #5 (local)

Verdict: ✅ VERIFICATION PASS

PR Head SHA: 93a7834cf592740d7ccfe08840e3723697de4c1b

Summary: The report is bound to the live head, its manifest hash matches, and every row was freshly executed at that head with no carried rows. The evidence covers the recipe, the dev image, the Vite preview base-path and HMR behavior, the workspace and lockfile changes, the CI build ordering, and the example render. The one nonzero exit in the example test is the sample's documented planted overlap, not a regression. Both CI jobs at the live head are green.

Revision binding

  • Report head: 93a7834cf592740d7ccfe08840e3723697de4c1b

  • Live PR head: 93a7834cf592740d7ccfe08840e3723697de4c1b

  • Audited checkout: clean detached checkout at 93a7834cf592740d7ccfe08840e3723697de4c1b

  • Delta assessment: Every row is fresh at the report head, which equals the live head, so each row's evidence-head-to-live delta is empty. The manifest's base_sha b12f53b65060e8998595ccacf3daca39e26331a5 equals the merge-base with origin/main.

  • Rows carried forward: none

  • Carried evidence heads: none

  • Rows reverified at live head: none

  • Rows still requiring verification: none

  • Publication timing: The report was posted at the live head. CI checks (Python, Typecheck/unit/browser) pass.

Diff trigger inventory

Surface Location Coverage
Live Dev Server recipe for the react-vite example .codepress/dev-server/recipe.json 1
Dev-mode Dockerfile that matches the recipe command .codepress/dev-server/Dockerfile.react-vite 2
Vite base path, HMR protocol and port, and preview Host handling from environment variables examples/react-vite/vite.config.ts 3
Example joins the pnpm workspace with workspace SDK links and React 19.3.1; README updated pnpm-workspace.yaml, pnpm-lock.yaml, examples/react-vite/package.json, README.md 4
CI builds workspace packages before typecheck .github/workflows/ci.yml 5
Example page still renders examples/react-vite 6
No backend, CORS or auth surface is affected repo topology 7

Per-item

# Verifier said Judgment Evidence
1 PASS ✅ PASS Recipe re-read at the live head: schema 1, a single react-vite frontend, a frozen pnpm install, port 5173, procps, and the browser-then-React prebuild, with inputs consistent with the package graph.
2 PASS ✅ PASS (FORM CAVEAT) Dockerfile re-read: Node 26 Bookworm, pnpm 10.28.2, procps, bind/PORT/HMR env, no source copies, and a CMD identical to the recipe dev_command. The Docker daemon was unavailable, so no image build was run; this is advisory because the image is a thin, inspectable file.
3 PASS ✅ PASS Real HTTP requests against a running Vite, once with the env unset (root base, default HMR) and once with the preview base, WSS/443 and a preview Host (200, prefixed assets, WSS/443 client). This matches vite.config.ts, which maps the env vars to base and hmr and sets allowedHosts to true.
4 PASS ✅ PASS The manifest digest matches. Frozen install is current, SDK links resolve to local packages, the example builds, and the diff shows workspace:^ deps with React ^19.3.1.
5 PASS ✅ PASS Typecheck, 66 unit tests, 66 browser tests, 6 helper tests and the pack checks passed locally. The live-head CI jobs also pass, and the ci.yml diff builds browser, react and playwright before typecheck.
6 PASS ✅ PASS The page rendered and the CTA assertion passed. The only emitted finding is the planted layout.overlap that the README documents, so the exit 1 is the sample's intended state.
7 PASS ✅ PASS The diff has no API server, CORS, auth or staging config, so no preview edits apply.

Overall status check

  • Verifier said: PASS
  • Result: VERIFICATION PASS

What stood up

  • All rows are fresh evidence at the live head, backed by a manifest whose digest verifies.
  • Live HTTP evidence covers the one runtime-behavior change, which is Vite's preview base-path and HMR handling.
  • Advisory: the dev image was not built, because the Docker daemon was unavailable in the verifier's environment. A first Live Dev Server start will exercise it.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

cp:in-progress CodePress: still being worked on

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant