Skip to content

Add vNext workflow template browser and visual previews - #3495

Open
AbigailDeng wants to merge 19 commits into
feat/2026-08-04_workflow-activity-vnextfrom
feat/2026-08-18_workflow-template-browser
Open

Add vNext workflow template browser and visual previews#3495
AbigailDeng wants to merge 19 commits into
feat/2026-08-04_workflow-activity-vnextfrom
feat/2026-08-18_workflow-template-browser

Conversation

@AbigailDeng

@AbigailDeng AbigailDeng commented Aug 18, 2026

Copy link
Copy Markdown
Contributor

Problem and solution

The vNext New workflow flow still used a bundled template selector, while the approved template design requires a page-level browser and backend PR #3484 provides the authoritative public template catalog and instantiate command.

This PR:

  • replaces the bundled template picker with the approved full-page template browser from [DO NOT MERGE] Refine workflow library template picker design #3439, without an internal filter rail;
  • gives the template browser its own canonical route: /scopes/:scopeId/workflow-activity-vnext/workflows/new/templates;
  • makes Use template update the URL instead of changing only transient React state, so refresh and browser navigation preserve the surface;
  • keeps exactly one page-level Start from a template heading and one supporting description;
  • exposes exactly View and Use template per row;
  • turns View into a visual workflow preview built with the shared Studio graph canvas, including nodes, arrows, branch labels, minimap, and zoom controls;
  • uses the catalog's authoritative edges for both visible connections and layout topology, while preserving the definition fallback for older/partial payloads;
  • distinguishes real branch edges from implicit next edges and nested child edges using the source step contract;
  • keeps the description and version below the visual graph without a redundant textual step-details section;
  • replaces terse sort copy with explicit field-and-direction labels in English and Chinese while keeping backend sort values unchanged;
  • uses the typed list/detail contracts and POST /api/scopes/{scopeId}/workflow-templates/{templateId}:instantiate;
  • observes the accepted draft receipt before navigating to the API-returned workflowId;
  • keeps templateId, draft workflowId, memberId, and publishedServiceId semantically separate;
  • prevents duplicate instantiation while an accepted receipt is being observed, delayed, or failed;
  • recovers from template version conflicts by refreshing both catalog and modal detail before retrying with the new authority version;
  • maps an initial catalog 404 to a contextual unavailable-environment message while retaining the raw HTTP error in Technical details;
  • routes list, detail, and instantiate requests explicitly to the configured Studio backend.

No bundled template catalog fallback or local backend/mock path remains.

Impacted paths

  • vNext New workflow creation UI, template route, sort controls, and detail modal
  • shared Studio graph composition in the template preview surface
  • runtime template models, decoders, and catalog client
  • Studio template instantiation client
  • development proxy routing
  • localized template page and unavailable-state copy
  • focused API, decoder, proxy, localization, route, graph, and interaction tests

Related work

Local verification

  • Related tests: pnpm --dir apps/aevatar-console-web exec jest src/pages/workflow-activity-vnext/workflows/WorkflowTemplateBrowser.test.ts src/pages/workflow-activity-vnext/workflows/NewWorkflowPage.test.tsx --runInBand - 2 suites passed, 19 tests passed
  • Changed-file static checks: pnpm --dir apps/aevatar-console-web exec biome check src/pages/workflow-activity-vnext/workflows/WorkflowTemplateBrowser.tsx src/pages/workflow-activity-vnext/workflows/WorkflowTemplateBrowser.test.ts src/pages/workflow-activity-vnext/workflows/NewWorkflowPage.test.tsx src/pages/workflow-activity-vnext/styles.ts src/locales/workflowActivityVNextMessages.en-US.ts src/locales/workflowActivityVNextMessages.zh-CN.ts - 6 files passed
  • Change scope: python3 ~/.codex/skills/frontend-incremental-pr/scripts/frontend_change_scope.py --repo . --base origin/feat/2026-08-04_workflow-activity-vnext
  • Diff validation: git diff --check - passed
  • A reliable repository-native affected typecheck is unavailable; full typecheck/build remain delegated to GitHub CI by the personal local workflow policy
  • Full frontend suite/build: deferred to GitHub CI by personal local workflow policy

Remote preview

The frontend remains available at http://localhost:5173 against the configured remote API and Studio targets. I reused the user's existing Chrome tab rather than opening a separate browser. The deployed remote catalog returned real details for auto_review (11 steps) and codex_long_running_handoff (3 steps); both rendered nonblank workflow graphs with visible arrows and controls. Desktop and 390x844 checks showed no document-level horizontal overflow, and the browser console reported no errors.

Follow-up verification: accepted draft materialization

The backend instantiate command returns 202 Accepted before the new draft is visible in the workflow-draft read model. The frontend now observes the scoped draft list first, waits until the receipt workflowId appears, then reads the draft document. A transient detail 404 is treated as projection delay and retried; non-404 failures still surface immediately.

  • Related tests: pnpm exec jest --runInBand src/pages/workflow-activity-vnext/hooks/useDraftMaterialization.test.ts src/pages/workflow-activity-vnext/workflows/NewWorkflowPage.test.tsx src/pages/workflow-activity-vnext/workflows/WorkflowTemplateBrowser.test.ts - 3 suites passed, 24 tests passed
  • Related API tests: pnpm exec jest --runInBand src/shared/studio/api.test.ts - 1 suite passed, 61 tests passed
  • Changed-file static checks: pnpm exec biome check src/pages/workflow-activity-vnext/hooks/useDraftMaterialization.ts src/pages/workflow-activity-vnext/hooks/useDraftMaterialization.test.ts - passed
  • Diff validation: git diff --check - passed
  • Full frontend suite/build: deferred to GitHub CI by the personal local workflow policy

Browser verification used the existing signed-in Chrome tab at http://localhost:5173 with the configured remote API and Studio targets. Clicking Use template for studio navigated to /workflow-activity-vnext/workflows/1f74619cd03c4cb7b70200a4af9bb2d4 and rendered the editor; the browser console reported no errors or warnings.

Follow-up: terminal template state

The accepted-draft observer still prevents duplicate template creation after a delayed or failed materialization, but terminal states no longer render as an endless loading action. Only accepted and observing show the Use template spinner. delayed and failed keep the action locked without the spinner and expose the existing Try again action.

  • Regression tests: pnpm exec jest --runInBand src/pages/workflow-activity-vnext/workflows/NewWorkflowPage.test.tsx -t "prevents duplicate template instantiation" - 2 tests passed
  • Focused suite: pnpm exec jest --runInBand src/pages/workflow-activity-vnext/hooks/useDraftMaterialization.test.ts src/pages/workflow-activity-vnext/workflows/NewWorkflowPage.test.tsx src/pages/workflow-activity-vnext/workflows/WorkflowTemplateBrowser.test.ts - 3 suites, 24 tests passed
  • Static checks: Biome changed-file check and git diff --check passed
  • Browser verification: existing Chrome tab with remote API; codex_long_running_handoff successfully opened the editor at /workflow-activity-vnext/workflows/cc513f397e2240e69d929cab3274f58f.

Follow-up: remove template step details

The template preview modal now keeps only the visual workflow graph, description, and source version. The redundant collapsed Step details section, its CSS, and its template-browser-only localization entries were removed. The separate workflow node inspector Step details surface remains unchanged.

  • Related tests: pnpm exec jest --runInBand src/pages/workflow-activity-vnext/hooks/useDraftMaterialization.test.ts src/pages/workflow-activity-vnext/workflows/NewWorkflowPage.test.tsx src/pages/workflow-activity-vnext/workflows/WorkflowTemplateBrowser.test.ts - 3 suites passed, 24 tests passed
  • Changed-file static checks: pnpm exec biome check src/locales/workflowActivityVNextMessages.en-US.ts src/locales/workflowActivityVNextMessages.zh-CN.ts src/pages/workflow-activity-vnext/styles.ts src/pages/workflow-activity-vnext/workflows/NewWorkflowPage.test.tsx src/pages/workflow-activity-vnext/workflows/WorkflowTemplateBrowser.tsx - passed
  • Diff validation: git diff --check - passed
  • Full frontend suite/build: deferred to GitHub CI by the personal local workflow policy

Follow-up: unified template pagination

The template catalog now uses the same Ant Design Pagination control and wa-vnext__activity-footer layout as the Activity page. The old template-specific Previous and Next button row and its CSS/localization entries were removed.

Because the template catalog contract exposes nextCursor without a total count, page navigation keeps the discovered cursor for each page, resets to page 1 when search or sort changes, hides arbitrary quick jumping, and disables navigation while the catalog is loading, a cursor is being resolved, or template creation is locked. Cursor-resolution failures keep the current page visible and expose the same retry treatment used by Activity.

  • Related tests: pnpm exec jest src/pages/workflow-activity-vnext/workflows/NewWorkflowPage.test.tsx src/pages/workflow-activity-vnext/workflows/WorkflowTemplateBrowser.test.ts --runInBand - 2 suites passed, 21 tests passed
  • Changed-file static checks: pnpm exec biome check src/pages/workflow-activity-vnext/workflows/WorkflowTemplateBrowser.tsx src/pages/workflow-activity-vnext/workflows/NewWorkflowPage.test.tsx src/pages/workflow-activity-vnext/styles.ts src/locales/workflowActivityVNextMessages.en-US.ts src/locales/workflowActivityVNextMessages.zh-CN.ts - 5 files passed
  • Diff validation: git diff --check - passed
  • Browser verification: reused the existing signed-in Chrome tab at http://localhost:5173 against the configured remote API; the template page rendered the Activity-style Page 1 pagination and the browser console reported no errors or warnings
  • Full frontend suite/build: deferred to GitHub CI by personal local workflow policy

Follow-up: blocked save feedback

Save now surfaces validation-blocked exits instead of returning silently. Parse or serialize findings that block saving set the editor status to Save failed, trigger the existing save-failure toast, and keep the inline validation findings visible.

  • Regression tests: pnpm exec jest --findRelatedTests src/pages/workflow-activity-vnext/hooks/useWorkflowEditor.ts --runInBand - 1 suite passed, 119 tests passed
  • Changed-file static checks: pnpm exec biome check src/pages/workflow-activity-vnext/hooks/useWorkflowEditor.ts src/pages/workflow-activity-vnext/index.test.tsx - passed
  • Diff validation: git diff --check - passed
  • Browser verification: reused the existing signed-in Chrome tab at http://localhost:5173 against the remote API; clicking Save from the template entry showed Save failed and the save-failure toast.
  • Full frontend suite/build: deferred to GitHub CI by the personal local workflow policy

Follow-up: template tool-set save contract

The backend template instance can contain the runtime permission field tool_sets on both roles and steps. The editor now treats the corresponding toolSets values as typed Studio document fields, and the save regression proves parse -> serialize -> save keeps those values intact. The durable parser/serializer fix is tracked in backend PR #3506 against feature/integrate.

Local verification

  • Related page test: pnpm exec jest src/pages/workflow-activity-vnext/index.test.tsx --runInBand - 1 suite passed, 120 tests passed
  • Dependency-related tests for shared Studio models: pnpm exec jest --findRelatedTests src/shared/studio/models.ts --runInBand - 31 suites passed, 768 tests passed
  • Changed-file static checks: pnpm exec biome check src/shared/studio/models.ts src/pages/workflow-activity-vnext/index.test.tsx - passed
  • Change scope: python3 ~/.codex/skills/frontend-incremental-pr/scripts/frontend_change_scope.py --repo . --base origin/feat/2026-08-04_workflow-activity-vnext
  • Diff validation: git diff --check - passed
  • No reliable repository-native affected typecheck is available; full typecheck/build remain delegated to GitHub CI by the personal local workflow policy
  • Full frontend suite/build: deferred to GitHub CI by personal local workflow policy

@AbigailDeng AbigailDeng changed the title Add vNext workflow template browser Fix vNext workflow template route and unavailable state Aug 20, 2026
@AbigailDeng AbigailDeng changed the title Fix vNext workflow template route and unavailable state Add vNext workflow template browser and visual previews Aug 20, 2026
@AbigailDeng

Copy link
Copy Markdown
Contributor Author

Follow-up: template entry save readiness

Use template now opens the materialized draft in a save-ready editor state instead of showing a disabled Save button with no explanation. The template entry query is consumed immediately and the URL is normalized back to the canonical workflow route. The editor remains dirty until the first explicit Save succeeds; normal existing-workflow loading keeps the previous clean/disabled behavior.

  • Focused tests: pnpm exec jest src/pages/workflow-activity-vnext/index.test.tsx src/pages/workflow-activity-vnext/navigation.test.ts --runInBand - 2 suites, 120 tests passed
  • Related tests: pnpm exec jest --findRelatedTests src/pages/workflow-activity-vnext/hooks/useWorkflowEditor.ts src/pages/workflow-activity-vnext/navigation.ts src/pages/workflow-activity-vnext/workflows/WorkflowTemplateBrowser.tsx --runInBand - 6 suites, 163 tests passed
  • Changed-file static checks: pnpm exec biome check src/pages/workflow-activity-vnext/hooks/useWorkflowEditor.ts src/pages/workflow-activity-vnext/index.test.tsx src/pages/workflow-activity-vnext/navigation.test.ts src/pages/workflow-activity-vnext/navigation.ts src/pages/workflow-activity-vnext/workflows/WorkflowTemplateBrowser.tsx - passed
  • Diff validation: git diff --check - passed
  • Full frontend suite/build: deferred to GitHub CI by the personal local workflow policy

Browser verification reused the existing signed-in Chrome tab at http://localhost:5173 with the remote API configured. After using the studio template, the URL normalized to the canonical workflow route, Save was enabled, the status showed Unsaved changes, and Publish was blocked until Save.

@AbigailDeng

Copy link
Copy Markdown
Contributor Author

Local verification update

  • Template browser headings now render once in a list-level header; rows contain values and actions only.
  • Related Jest: pnpm exec jest --findRelatedTests src/pages/workflow-activity-vnext/styles.ts src/pages/workflow-activity-vnext/workflows/WorkflowTemplateBrowser.tsx src/pages/workflow-activity-vnext/workflows/NewWorkflowPage.test.tsx --runInBand --watch=false (5 suites, 164 tests passed).
  • Explicit tests: pnpm exec jest src/pages/workflow-activity-vnext/workflows/NewWorkflowPage.test.tsx src/pages/workflow-activity-vnext/workflows/WorkflowTemplateBrowser.test.ts --runInBand --watch=false (2 suites, 22 tests passed).
  • Static checks: pnpm exec biome check src/pages/workflow-activity-vnext/styles.ts src/pages/workflow-activity-vnext/workflows/NewWorkflowPage.test.tsx src/pages/workflow-activity-vnext/workflows/WorkflowTemplateBrowser.tsx; git diff --check (passed).
  • Full frontend suite/typecheck/build remain delegated to GitHub CI by local validation policy.
  • Browser screenshot verification was not repeated because the existing Chrome connection exposed no usable tab; no new browser was opened.

@AbigailDeng
AbigailDeng force-pushed the feat/2026-08-18_workflow-template-browser branch from c6bbc58 to c7a918f Compare August 20, 2026 12:43
@AbigailDeng

Copy link
Copy Markdown
Contributor Author

Follow-up: instantiated templates open as saved

Root cause: template instantiation already persisted and materialized the draft, but the frontend appended ?source=template and used that flag to call markLocalEdit(). This manufactured an unsaved state and enabled an unnecessary second Save. That Save then called the deployed Studio parser, which still rejects tool_sets until backend PR #3506 is merged and deployed, so the editor reported failure even though the catalogue correctly contained the created draft.

The template browser now navigates directly to the canonical editor URL. A materialized template draft opens clean with Save disabled; only a real user edit marks it dirty. The toolSets round-trip save regression now performs a real title edit before Save.

Local verification

  • Dependency preflight: pnpm --dir apps/aevatar-console-web exec jest --listTests --findRelatedTests src/pages/workflow-activity-vnext/hooks/useWorkflowEditor.ts src/pages/workflow-activity-vnext/navigation.ts src/pages/workflow-activity-vnext/workflows/WorkflowTemplateBrowser.tsx - selected 6 vNext test files
  • Related tests: pnpm --dir apps/aevatar-console-web exec jest --runInBand --watch=false --findRelatedTests src/pages/workflow-activity-vnext/hooks/useWorkflowEditor.ts src/pages/workflow-activity-vnext/navigation.ts src/pages/workflow-activity-vnext/workflows/WorkflowTemplateBrowser.tsx - 6 suites passed, 167 tests passed
  • Changed tests: pnpm --dir apps/aevatar-console-web exec jest --runInBand --watch=false --runTestsByPath src/pages/workflow-activity-vnext/index.test.tsx src/pages/workflow-activity-vnext/navigation.test.ts - 2 suites passed, 123 tests passed
  • Changed-file static checks: pnpm --dir apps/aevatar-console-web exec biome check src/pages/workflow-activity-vnext/hooks/useWorkflowEditor.ts src/pages/workflow-activity-vnext/index.test.tsx src/pages/workflow-activity-vnext/navigation.test.ts src/pages/workflow-activity-vnext/navigation.ts src/pages/workflow-activity-vnext/workflows/WorkflowTemplateBrowser.tsx - 5 files passed
  • Diff validation: git diff --check - passed
  • A reliable repository-native affected typecheck is unavailable
  • Full frontend suite/typecheck/build: deferred to GitHub CI by personal local workflow policy

@AbigailDeng

Copy link
Copy Markdown
Contributor Author

Follow-up: publish saved runtime YAML directly

Root cause

Publish reparsed and reserialized an already saved workflow through the deployed Studio editor parser before calling runtime preview. That remote parser is behind runtime support for tool_sets, so it returned an unknown-field finding and the frontend stopped with This workflow needs valid executable steps before publishing. Neither runtime preview nor the publication endpoint was reached.

Semantic correction

  • Publish now sends the saved authoritative YAML unchanged to runtime explicit-request preview and publication.
  • Studio parse/serialize remains the edit/save boundary; runtime preview/compile remains the publish boundary.
  • An observed published service is authoritative for Run readiness, so stale Studio findings cannot veto a runtime revision that has already compiled and published successfully.
  • Added a regression covering role/step tool_sets, the role alias, numeric finding level 2, an old Studio parser rejection, unchanged YAML publication, Published status, and enabled Run.

Local verification

  • Related-test preflight: pnpm exec jest --findRelatedTests src/pages/workflow-activity-vnext/hooks/useWorkflowEditor.ts --runInBand --watch=false --listTests - selected only src/pages/workflow-activity-vnext/index.test.tsx
  • Changed test file: pnpm exec jest --runInBand --watch=false --runTestsByPath src/pages/workflow-activity-vnext/index.test.tsx - 1 suite passed, 121 tests passed
  • Changed-file static checks: pnpm exec biome check src/pages/workflow-activity-vnext/hooks/useWorkflowEditor.ts src/pages/workflow-activity-vnext/index.test.tsx - 2 files passed
  • Change scope: python3 /Users/abigaildeng/.codex/skills/frontend-incremental-pr/scripts/frontend_change_scope.py --repo . --base origin/feat/2026-08-04_workflow-activity-vnext
  • Diff validation: git diff --check - passed
  • Full frontend suite, typecheck, and production build: deferred to GitHub CI by personal local workflow policy

Remote browser verification

Reused the existing signed-in Chrome tab at http://localhost:5173 against the configured remote API and Studio targets. The same persisted studio draft advanced from Publish to Publishing to Published; the old publication error disappeared, and Run became enabled. No local backend, mock, bypass, new browser window, or duplicate tab was used.

The visible Studio tool_sets warning remains until backend PR #3506 is merged and deployed, but it no longer blocks runtime Publish or Run.

@AbigailDeng

Copy link
Copy Markdown
Contributor Author

Follow-up: fix console-web CI type checks

The failing console-web job did not reach Jest. It stopped in tsc --noEmit because the template preview test fixture inferred conditional branches as { approved: string } | { approved?: undefined }, which is not assignable to the API contract Record<string, string>.

After fixing that first error, the same CI command exposed a second declaration error: the exported buildTemplatePreviewGraph inferred a non-portable return type referencing pnpm's internal @xyflow/system path.

This update:

  • gives the fixture branch helper an explicit Record<string, string> return contract;
  • declares buildTemplatePreviewGraph as the shared public StudioGraphElements type;
  • derives the preview edge type from StudioGraphElements['edges'] so no dependency-internal type leaks into the exported declaration.

Local verification

  • CI failure reproduction before the fix: CODEX_ALLOW_FULL_FRONTEND_VALIDATION=1 pnpm --dir apps/aevatar-console-web tsc - reproduced TS2322, then TS2742 after the fixture correction
  • CI-equivalent typecheck after the fix: CODEX_ALLOW_FULL_FRONTEND_VALIDATION=1 pnpm --dir apps/aevatar-console-web tsc - passed
  • Dependency-related tests: pnpm exec jest --runInBand --watch=false --runTestsByPath src/pages/workflow-activity-vnext/workflows/WorkflowTemplateBrowser.test.ts src/pages/workflow-activity-vnext/workflows/NewWorkflowPage.test.tsx src/pages/workflow-activity-vnext/index.test.tsx - 3 suites passed, 143 tests passed
  • Changed-file static checks: pnpm exec biome check src/pages/workflow-activity-vnext/workflows/WorkflowTemplateBrowser.tsx src/pages/workflow-activity-vnext/workflows/WorkflowTemplateBrowser.test.ts - passed
  • Diff validation: git diff --check - passed
  • Full frontend Jest suite and production build: deferred to GitHub CI by personal local workflow policy

Commit: 7fff6750c

@AbigailDeng

Copy link
Copy Markdown
Contributor Author

Follow-up: align template catalogue columns

The template catalogue now matches the approved table treatment instead of sizing a standalone header grid and row grids independently.

  • Replaced the separate header and row layouts with the shared TableScrollRegion and one semantic table/colgroup.
  • Added visible Template, Reads, Connection, Does, and Updated headers plus an accessible unlabeled actions column.
  • Moved freshness into the dedicated Updated cell and kept template marker/name/description together in the first cell.
  • Added stable compact template markers derived from contract-backed workflow capabilities.
  • Kept narrow-screen overflow inside the shared table wrapper.

Local verification

  • Directly related tests: pnpm exec jest src/pages/workflow-activity-vnext/workflows/NewWorkflowPage.test.tsx src/pages/workflow-activity-vnext/workflows/WorkflowTemplateBrowser.test.ts src/locales/catalog.test.ts src/locales/hardcodedCopyAudit.test.ts --runInBand - 4 suites passed, 36 tests passed
  • Changed-file static checks: pnpm exec biome check src/pages/workflow-activity-vnext/workflows/WorkflowTemplateBrowser.tsx src/pages/workflow-activity-vnext/workflows/NewWorkflowPage.test.tsx src/pages/workflow-activity-vnext/styles.ts src/locales/workflowActivityVNextMessages.en-US.ts src/locales/workflowActivityVNextMessages.zh-CN.ts - 5 files passed
  • Diff validation: git diff --check - passed
  • Browser verification: reused the existing authenticated Chrome tab at http://127.0.0.1:5173 against the configured remote backend; all six desktop header/body x-coordinate deltas were 0px, the 390px document had no horizontal overflow, and the browser console reported no errors
  • Dependency selection note: shared styles/locales expand --findRelatedTests to nearly the entire frontend, so directly corresponding tests were used per the incremental validation policy
  • Full frontend suite/typecheck/build: deferred to GitHub CI by the personal local workflow policy

@AbigailDeng

Copy link
Copy Markdown
Contributor Author

Follow-up: stabilize the full-suite tool-set save regression

Root cause

The regression test updated the workflow display name and then compared the complete serialized document against an object whose document.name was still committed_source. In CI, the save path correctly supplied Committed source updated; the role and step toolSets that the test was meant to protect were still present. The assertion therefore failed on an unrelated name field after 1,625 other tests had passed. The test also treated the presence of the Save button as proof that editor hydration had completed.

Fix

  • Wait for the loaded workflow name before editing.
  • Wait for Save to become enabled before clicking.
  • Assert the role-level and step-level toolSets at the serialize boundary instead of requiring equality for unrelated document fields.
  • Continue asserting that saved YAML contains tool_sets: [nyxid.connected_services].

Verification

  • Focused regression: pnpm exec jest src/pages/workflow-activity-vnext/index.test.tsx --runInBand --runTestsByPath -t "preserves template tool set scopes through serialize and save" - 1 passed.
  • CI-equivalent full suite: CODEX_ALLOW_FULL_FRONTEND_VALIDATION=1 pnpm --dir apps/aevatar-console-web test --runInBand - 164 suites passed, 1,626 tests passed.
  • Typecheck: CODEX_ALLOW_FULL_FRONTEND_VALIDATION=1 pnpm --dir apps/aevatar-console-web tsc --noEmit - passed.
  • Production build: CODEX_ALLOW_FULL_FRONTEND_VALIDATION=1 pnpm --dir apps/aevatar-console-web build - passed.
  • Changed-file static check: pnpm exec biome check src/pages/workflow-activity-vnext/index.test.tsx - passed.
  • Test stability guard: bash tools/ci/test_stability_guards.sh - passed.
  • Diff validation: git diff --check - passed.

The full suite and build were run locally this time specifically to reproduce the GitHub failure; GitHub CI will repeat them for pushed head 503fc8874.

@AbigailDeng

Copy link
Copy Markdown
Contributor Author

Template catalogue scrolling follow-up

Root cause

The template table is a horizontal scroll container and inherited overscroll-behavior: contain. That trapped vertical wheel input over the table, so the vNext page-level scroller never received it even though .wa-vnext__main had vertical overflow.

Fix

  • Keep horizontal scrolling inside the table region.
  • Set overscroll-behavior-y: auto on the template table region so vertical wheel input chains to the existing page scroller.
  • Add a regression covering the scoped stylesheet contract.

Local verification

  • Related tests: pnpm exec jest --findRelatedTests src/pages/workflow-activity-vnext/styles.ts --runInBand - 4 suites passed, 165 tests passed.
  • Changed test file: pnpm exec jest src/pages/workflow-activity-vnext/workflows/NewWorkflowPage.test.tsx --runInBand --runTestsByPath - 1 suite passed, 22 tests passed.
  • Changed-file static checks: pnpm exec biome check src/pages/workflow-activity-vnext/styles.ts src/pages/workflow-activity-vnext/workflows/NewWorkflowPage.test.tsx - passed.
  • Stability guard: bash tools/ci/test_stability_guards.sh - passed.
  • Diff validation: git diff --check - passed.
  • Existing Chrome desktop verification: a 500px wheel gesture over the table moved the page scroller from 0 to its 231px maximum and exposed pagination.
  • Existing Chrome 390x844 verification: the same gesture moved the page scroller from 0 to 286.5px of 287px; pagination was visible; document width stayed 390px; horizontal overflow remained inside the 358px table region.
  • Full frontend suite/typecheck/build: deferred to GitHub CI by personal local workflow policy.

Commit: b4aa91657.

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

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant