feat(meticulous): integrate Meticulous session recorder and testing w… by ryota-murakami · Pull Request #28 · laststance/coffee-timer

ryota-murakami · 2026-06-30T12:56:49Z

…orkflow

Add .env.example for Meticulous project ID and API token configuration.
Create GitHub Actions workflow for Meticulous visual regression tests.
Implement Meticulous recorder script in layout component.
Add utility function to retrieve Meticulous project ID from environment variables.
Define constant for Meticulous recorder script URL.

Summary by CodeRabbit

New Features
- Enabled optional Meticulous session recording by injecting the recorder script when a public project ID is configured.
- Added a CI workflow to run Meticulous visual regression tests on pushes to the main branch, all pull requests, and manual runs.
Documentation
- Updated the environment example with Meticulous setup placeholders, including a public project ID entry and guidance for providing the API token via GitHub Actions secrets.

…orkflow - Add .env.example for Meticulous project ID and API token configuration. - Create GitHub Actions workflow for Meticulous visual regression tests. - Implement Meticulous recorder script in layout component. - Add utility function to retrieve Meticulous project ID from environment variables. - Define constant for Meticulous recorder script URL.

vercel · 2026-06-30T12:56:55Z

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
coffee-timer	Ready	Preview, Comment	Jun 30, 2026 1:29pm

coderabbitai · 2026-06-30T12:57:04Z

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: e72f2419-f4ba-46c2-b2f4-a4578cb44a28

📥 Commits

Reviewing files that changed from the base of the PR and between 81d4802 and 2bf92dd.

📒 Files selected for processing (1)

.github/workflows/meticulous.yml

📝 Walkthrough

Walkthrough

Adds Meticulous visual regression testing: the app layout conditionally injects a recorder script, environment placeholders are documented, and a new GitHub Actions workflow builds, serves, and runs Meticulous tests.

Changes

Meticulous Visual Regression Integration

Layer / File(s)	Summary
Recorder constant, utility, and layout injection `lib/constants/meticulous.ts`, `lib/utils/getMeticulousProjectId.ts`, `app/[locale]/layout.tsx`, `.env.example`	Exports `METICULOUS_RECORDER_SCRIPT_URL` and `getMeticulousProjectId`; the layout computes the project id and conditionally renders a synchronous recorder script in `<head>`; `.env.example` documents `NEXT_PUBLIC_METICULOUS_PROJECT_ID` and `METICULOUS_API_TOKEN`.
GitHub Actions Meticulous CI workflow `.github/workflows/meticulous.yml`	Adds a workflow triggered on push to `main`, pull requests, and manual dispatch; installs dependencies, builds the app, starts the server, waits for readiness, and runs the Meticulous cloud-compute action.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Poem

🐇 A snippet now hops in the page up above,
With project id tucked in and recorder to love.
The server runs steady, the checks march along,
And Meticulous hums in a very neat song.

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly matches the main change: adding Meticulous session recording and visual regression testing integration.
Docstring Coverage	✅ Passed	Docstring coverage is 100.00% which is sufficient. The required threshold is 80.00%.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches

🧪 Generate unit tests (beta)

Create PR with unit tests
Commit unit tests in branch feat/meticulous

_{Comment @coderabbitai help to get the list of available commands.}

coderabbitai

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In @.github/workflows/meticulous.yml:
- Line 24: The workflow step using actions/checkout currently leaves the job
token persisted in .git/config, which can be reused by later third-party
actions. Update the checkout configuration in the meticulous workflow to disable
credential persistence for the checkout step, and keep the rest of the job
behavior unchanged. Use the actions/checkout@v4 step as the place to apply the
fix.
- Around line 37-40: The CI build is not passing
NEXT_PUBLIC_METICULOUS_PROJECT_ID, so the recorder gate in
app/[locale]/layout.tsx never activates and the built site is uninstrumented.
Update the Meticulous workflow build step to export
NEXT_PUBLIC_METICULOUS_PROJECT_ID during pnpm build, matching the environment
expected by the layout logic so the recorder snippet is included in the CI-built
app.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

Push a commit to this branch (recommended)
Create a new PR with the fixes

ℹ️ Review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: ae7a75b3-fc48-4395-ba9a-c66492171c87

📥 Commits

Reviewing files that changed from the base of the PR and between 36c1337 and 81d4802.

📒 Files selected for processing (5)

.env.example
.github/workflows/meticulous.yml
app/[locale]/layout.tsx
lib/constants/meticulous.ts
lib/utils/getMeticulousProjectId.ts

coderabbitai · 2026-06-30T13:05:48Z

+      - name: Build Next.js app
+        run: pnpm build
+        env:
+          NODE_ENV: production


🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

Pass NEXT_PUBLIC_METICULOUS_PROJECT_ID into the CI build.

app/[locale]/layout.tsx only renders the recorder when NEXT_PUBLIC_METICULOUS_PROJECT_ID is set, but this workflow never exports that variable. The app built here will therefore omit the recorder snippet, so the Meticulous run is exercising an uninstrumented site.

Proposed fix

jobs: test: runs-on: ubuntu-latest timeout-minutes: 30 + env: + NEXT_PUBLIC_METICULOUS_PROJECT_ID: ${{ vars.NEXT_PUBLIC_METICULOUS_PROJECT_ID }} steps:

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In @.github/workflows/meticulous.yml around lines 37 - 40, The CI build is not passing NEXT_PUBLIC_METICULOUS_PROJECT_ID, so the recorder gate in app/[locale]/layout.tsx never activates and the built site is uninstrumented. Update the Meticulous workflow build step to export NEXT_PUBLIC_METICULOUS_PROJECT_ID during pnpm build, matching the environment expected by the layout logic so the recorder snippet is included in the CI-built app.

Disable checkout credential persistence before third-party actions, drop companion-assets config that caused API 400 errors, and set METICULOUS_BUILD for deterministic CI replays.

ryota-murakami · 2026-06-30T13:29:02Z

Addressed CodeRabbit review in 2bf92dd:

✅ persist-credentials: false — Applied to the checkout step before third-party actions run.

⏭️ NEXT_PUBLIC_METICULOUS_PROJECT_ID in CI build — Intentionally skipped. CI runs session replay, not recording. The recorder snippet is only needed in dev/preview to capture new sessions. Meticulous replays pre-recorded sessions from its cloud during the test run, so the CI-built app does not need the recorder script. Server-side test behavior is handled by METICULOUS_BUILD=true on the build step.

Also fixed the CI 400 error by removing companion-assets-* config (API rejected the regex).

alwaysmeticulous · 2026-06-30T13:29:57Z

🤖 Meticulous evaluated 1 user flows and took 2 visual snapshots. Meticulous has not yet run on 36c1337 of the main branch and so there was nothing to compare against.

If you recently setup Meticulous, this is expected. Meticulous will start reporting comparisons for new pull requests after the next commit to the main branch.

_{Last updated for commit 2bf92dd fix(ci): harden Meticulous workflow and remove broken companion assets. This comment will update as new commits are pushed.}

coderabbitai Bot reviewed Jun 30, 2026

View reviewed changes

fix(ci): harden Meticulous workflow and remove broken companion assets

2bf92dd

Disable checkout credential persistence before third-party actions, drop companion-assets config that caused API 400 errors, and set METICULOUS_BUILD for deterministic CI replays.

vercel Bot deployed to Preview June 30, 2026 13:29 View deployment

ryota-murakami merged commit 60ea897 into main Jun 30, 2026
13 checks passed

coderabbitai Bot mentioned this pull request Jul 16, 2026

feat: add reproducible Meticulous recording suite #31

Merged

Navigation Menu

Uh oh!

feat(meticulous): integrate Meticulous session recorder and testing w… - #28

feat(meticulous): integrate Meticulous session recorder and testing w…#28
ryota-murakami merged 2 commits into
mainfrom
feat/meticulous

ryota-murakami commented Jun 30, 2026 •

edited by coderabbitai Bot

Loading

Uh oh!

vercel Bot commented Jun 30, 2026 •

edited

Loading

Uh oh!

coderabbitai Bot commented Jun 30, 2026 •

edited

Loading

Walkthrough

Changes

Estimated code review effort

Poem

Uh oh!

coderabbitai Bot left a comment

Uh oh!

Uh oh!

coderabbitai Bot Jun 30, 2026

Uh oh!

ryota-murakami commented Jun 30, 2026

Uh oh!

alwaysmeticulous Bot commented Jun 30, 2026 •

edited

Loading

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

Uh oh!

Conversation

ryota-murakami commented Jun 30, 2026 • edited by coderabbitai Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by CodeRabbit

Uh oh!

vercel Bot commented Jun 30, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

coderabbitai Bot commented Jun 30, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Estimated code review effort

Poem

Uh oh!

coderabbitai Bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

coderabbitai Bot Jun 30, 2026

Choose a reason for hiding this comment

Uh oh!

ryota-murakami commented Jun 30, 2026

Uh oh!

alwaysmeticulous Bot commented Jun 30, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

ryota-murakami commented Jun 30, 2026 •

edited by coderabbitai Bot

Loading

vercel Bot commented Jun 30, 2026 •

edited

Loading

coderabbitai Bot commented Jun 30, 2026 •

edited

Loading

alwaysmeticulous Bot commented Jun 30, 2026 •

edited

Loading