Skip to content

test(activity-feed-v2): add TaskModalV2 stories and a11y visual tests#4673

Merged
mergify[bot] merged 3 commits into
box:masterfrom
jackiejou:fix/task-modal-v2-a11y-pass
Jul 2, 2026
Merged

test(activity-feed-v2): add TaskModalV2 stories and a11y visual tests#4673
mergify[bot] merged 3 commits into
box:masterfrom
jackiejou:fix/task-modal-v2-a11y-pass

Conversation

@jackiejou

@jackiejou jackiejou commented Jul 2, 2026 •
edited by coderabbitai Bot
Loading

Copy link
Copy Markdown
Contributor

Summary

  • Add Storybook stories for TaskModalV2 (create general/approval, edit approval, submit error) driven by a self-contained InteractiveTaskModal wrapper with mocked fetchUsers/fetchAvatarUrls, so no MSW handlers are needed
  • Add visual-regression-test stories with play functions for the two flows that require a real browser: tab order through the form fields and date picker segments, and accessible names for the open assignee listbox (user and group options)
  • Static end states (create/edit prefill, submit error notice) are captured by the regular stories above, and validation wiring is covered by the jest suites, so no VRT stories duplicate them
  • Mock data includes user and group assignees with realistic collaborator ids and a consistent assigned_to collection

Test plan

  • yarn start:storybook and verify the stories under Elements/ContentSidebar/TaskModalV2 render and play functions pass
  • Chromatic run captures the new visual-regression-test stories
  • yarn lint passes (eslint + tsc)

Summary by CodeRabbit

  • New Features

    • Added richer Task Modal v2 examples in Storybook, including creating general tasks, creating approval tasks, editing approval tasks, and showcasing submit-error scenarios.

  • Tests

    • Expanded visual/accessibility Storybook coverage for Task Modal v2, including keyboard tab order and focus, combobox/listbox interaction with accessible option names, edit-mode prefilling, required-field validation, and error notice handling.

@jackiejou @cursoragent
test(activity-feed-v2): add TaskModalV2 stories and a11y visual tests
162e136 
Co-authored-by: Cursor <cursoragent@cursor.com>
@jackiejou jackiejou requested review from a team as code owners July 2, 2026 01:37
@coderabbitai

coderabbitai Bot commented Jul 2, 2026 •
edited
Loading

Copy link
Copy Markdown
Contributor

Review Change Stack

Walkthrough

Adds Storybook coverage for InteractiveTaskModal with reusable mocks and wrapper state, standard create/edit/error stories, and play-function stories that exercise keyboard focus and assignee listbox accessibility.

Changes

TaskModalV2 Storybook coverage

Layer / File(s) Summary
Mock data and InteractiveTaskModal wrapper component
src/elements/content-sidebar/stories/__mocks__/TaskModalV2Mocks.tsx		 Exports mock contacts, fetch helpers, assignee builders, mockEditingAssignees, mockEditingTask, mockSubmitError, and the InteractiveTaskModal wrapper that manages open/close state and simulated submit/error behavior, rendering TaskModalV2 in create or edit mode.
Standard Storybook stories
src/elements/content-sidebar/stories/TaskModalV2.stories.tsx		 Defines Storybook meta and four stories: CreateGeneralTask, CreateApprovalTask, EditApprovalTask, and SubmitError.
Visual and interaction test stories
src/elements/content-sidebar/stories/tests/TaskModalV2-visual.stories.tsx		 Defines Storybook meta and play-function stories for approval-task tab order and assignee listbox accessible names.
Estimated code review effort: 2 (Simple) ~12 minutes

Possibly related PRs

Suggested reviewers: zhirongwang, jmcbgaston, jpan-box

Poem

A bunny hops through modal light,
With stories snug and tests so bright,
Assignees tab, listboxes sing,
And errors bloom then lose their sting,
TaskModalV2 goes thump-thump tonight 🐇

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
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.
Title check ✅ Passed The title clearly summarizes the main change: adding TaskModalV2 stories and accessibility-focused visual tests.
Description check ✅ Passed The description is on-topic and includes a clear summary and test plan, which is sufficient despite not mirroring the template comment.
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

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

JChan106
JChan106 previously approved these changes Jul 2, 2026
View reviewed changes
jmcbgaston
jmcbgaston previously approved these changes Jul 2, 2026
View reviewed changes
@mergify mergify Bot added the queued label Jul 2, 2026
@mergify

mergify Bot commented Jul 2, 2026 •
edited
Loading

Copy link
Copy Markdown
Contributor

Merge Queue Status

  • ✅ Entered queue — 2026-07-02 18:23 UTC · Rule: Automatic strict merge · triggered by rule Automatic merge queue
  • 🚫 Left the queue — 2026-07-02 18:56 UTC · at 162e136aaa96ee8bbc7d41b14179b6b29ac6aa92

This pull request spent 33 minutes 27 seconds in the queue, with no time running CI.

Reason

Pull request #4673 has been dequeued

Queue conditions are not satisfied:

  • any of: [🔀 queue conditions]
    • all of: [📌 queue conditions of queue rule Automatic boxmoji merge]
      • author = boxmoji
      • files ~= ^i18n/
      • title ~= ^fix\(i18n\):\supdate translations$
    • all of: [📌 queue conditions of queue rule Automatic dependabot merge]
      • author = dependabot[bot]
      • files ~= ^(package\.json|yarn\.lock)$
      • title ~= ^chore\(deps(-dev)?\):\sbump\s
    • all of: [📌 queue conditions of queue rule Automatic strict merge]
      • label = ready-to-merge

Hint

You should look at the reason for the failure and decide if the pull request needs to be fixed or if you want to requeue it.
If you do update this pull request, it will automatically be requeued once the queue conditions match again.
If you think this was a flaky issue instead, you can requeue the pull request, without updating it, by posting a @mergifyio queue comment.

Requeued — the merge queue status continues in this comment ↓.

@jackiejou
test(activity-feed-v2): address TaskModalV2 story review feedback
6f21d06 
Seed a submit error so the SubmitError story renders the notice, assert
due-date prefill and completion-rule state in the edit prefill test with
a timezone-safe midday-UTC due_at, assert per-field invalid state in the
validation test, disable inline docs previews for the visual test file,
and use the Blueprint Button in the story wrapper.
@jackiejou jackiejou dismissed stale reviews from jmcbgaston and JChan106 via 6f21d06 July 2, 2026 20:15
@mergify mergify Bot removed the dequeued label Jul 2, 2026
@jackiejou
test(activity-feed-v2): trim TaskModalV2 VRTs to browser-only flows
85d3bf0 
Keep the tab-order and open-listbox stories, which need a real browser.
Static end states and validation wiring are covered by the public
TaskModalV2 stories and the jest suites.
@mergify mergify Bot added the queued label Jul 2, 2026
@mergify

mergify Bot commented Jul 2, 2026 •
edited
Loading

Copy link
Copy Markdown
Contributor

Merge Queue Status

  • ✅ Entered queue — 2026-07-02 22:36 UTC · Rule: Automatic strict merge · triggered by rule Automatic merge queue
  • ✅ Checks skipped · PR is already up-to-date
  • ✅ Merged — 2026-07-02 22:51 UTC · at 85d3bf0100bffdc5629b388650077c9b10e9caa9 · squash

This pull request spent 15 minutes 29 seconds in the queue, including 4 seconds running CI.

Required conditions to merge

@jackiejou

jackiejou commented Jul 2, 2026

Copy link
Copy Markdown
Contributor Author

@Mergifyio refresh

@mergify

mergify Bot commented Jul 2, 2026

Copy link
Copy Markdown
Contributor

refresh

✅ Pull request refreshed

@mergify mergify Bot merged commit a0dae00 into box:master Jul 2, 2026
11 of 12 checks passed
@mergify mergify Bot removed the queued label Jul 2, 2026
@jackiejou jackiejou deleted the fix/task-modal-v2-a11y-pass branch July 2, 2026 22:52
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@mrscobbler mrscobbler mrscobbler approved these changes
@jmcbgaston jmcbgaston jmcbgaston approved these changes
@JChan106 JChan106 JChan106 left review comments

Assignees

No one assigned

Labels

ready-to-merge

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

4 participants

@jackiejou @mrscobbler @JChan106 @jmcbgaston