molecule-ai/molecule-core
51
0
Fork 2
Code Issues 165 Pull Requests 154 Actions 6 Packages Projects Releases Wiki Activity

fix(canvas/ChatTab): add WCAG 2.4.7 focus-visible ring to talk_to_user Enable button #1337

Closed
core-uiux wants to merge 1 commits from fix/1256-enable-button-focus-ring into main
pull from: fix/1256-enable-button-focus-ring
merge into: molecule-ai:main
Conversation 2 Commits 1 Files Changed 2
+133 -1
core-uiux commented 2026-05-16 10:26:02 +00:00
Member
Copy Link
Copy Source

Summary

  • Adds focus-visible:ring-2 to the Enable button in ChatTab.tsx — resolves WCAG 2.4.7 blocker on PR #1256
  • Adds ChatTab.talkToUserBanner.test.tsx with 5 test cases
  • All 17 ChatTab tests pass, no regressions

Test plan

  • npx vitest run src/components/tabs/tests/ChatTab.talkToUserBanner.test.tsx — 5/5 pass
  • npx vitest run src/components/tabs/tests/ChatTab — 17/17 pass
  • npx vitest run src/components/tests/Toolbar — 52/52 pass

🤖 Generated with Claude Code

## Summary - Adds focus-visible:ring-2 to the Enable button in ChatTab.tsx — resolves WCAG 2.4.7 blocker on PR #1256 - Adds ChatTab.talkToUserBanner.test.tsx with 5 test cases - All 17 ChatTab tests pass, no regressions ## Test plan - [x] npx vitest run src/components/tabs/__tests__/ChatTab.talkToUserBanner.test.tsx — 5/5 pass - [x] npx vitest run src/components/tabs/__tests__/ChatTab — 17/17 pass - [x] npx vitest run src/components/__tests__/Toolbar — 52/52 pass 🤖 Generated with Claude Code
core-uiux added 2 commits 2026-05-16 10:26:15 +00:00
feat(canvas): broadcast banner UI + mobile chat polish + WCAG focus rings
CI / all-required (pull_request) Blocked by required conditions
Details
Harness Replays / Harness Replays (pull_request) Blocked by required conditions
Details
Runtime PR-Built Compatibility / PR-built wheel + import smoke (pull_request) Blocked by required conditions
Details
audit-force-merge / audit (pull_request) Waiting to run
Details
CI / Canvas (Next.js) (pull_request) Blocked by required conditions
Details
CI / Canvas Deploy Reminder (pull_request) Blocked by required conditions
Details
CI / Python Lint & Test (pull_request) Blocked by required conditions
Details
E2E API Smoke Test / E2E API Smoke Test (pull_request) Blocked by required conditions
Details
E2E Staging Canvas (Playwright) / detect-changes (pull_request) Waiting to run
Details
E2E Staging Canvas (Playwright) / Canvas tabs E2E (pull_request) Blocked by required conditions
Details
lint-mask-pr-atomicity / lint-mask-pr-atomicity (pull_request) Waiting to run
Details
lint-required-context-exists-in-bp / lint-required-context-exists-in-bp (pull_request) Waiting to run
Details
lint-required-no-paths / lint-required-no-paths (pull_request) Waiting to run
Details
gate-check-v3 / gate-check (pull_request) Waiting to run
Details
qa-review / approved (pull_request) Waiting to run
Details
security-review / approved (pull_request) Waiting to run
Details
sop-checklist / all-items-acked (pull_request) Waiting to run
Details
sop-tier-check / tier-check (pull_request) Waiting to run
Details
Block internal-flavored paths / Block forbidden paths (pull_request) Successful in 37s
Details
MCP Stdio Transport Regression / MCP stdio with regular-file stdout (pull_request) Successful in 2m21s
Details
Check migration collisions / Migration version collision check (pull_request) Successful in 2m32s
Details
E2E Staging SaaS (full lifecycle) / E2E Staging SaaS (pull_request) Has been skipped
Details
CI / Detect changes (pull_request) Successful in 2m15s
Details
E2E API Smoke Test / detect-changes (pull_request) Successful in 2m4s
Details
Harness Replays / detect-changes (pull_request) Successful in 38s
Details
Lint curl status-code capture / Scan workflows for curl status-capture pollution (pull_request) Successful in 28s
Details
E2E Staging SaaS (full lifecycle) / pr-validate (pull_request) Successful in 1m12s
Details
publish-runtime-autobump / bump-and-tag (pull_request) Has been skipped
Details
Handlers Postgres Integration / detect-changes (pull_request) Successful in 1m32s
Details
Secret scan / Scan diff for credential-shaped strings (pull_request) Successful in 48s
Details
publish-runtime-autobump / pr-validate (pull_request) Successful in 1m17s
Details
Runtime PR-Built Compatibility / detect-changes (pull_request) Successful in 1m38s
Details
Ops Scripts Tests / Ops scripts (unittest) (pull_request) Successful in 2m4s
Details
Lint workflow YAML (Gitea-1.22.6-hostile shapes) / Lint workflow YAML for Gitea-1.22.6-hostile shapes (pull_request) Successful in 2m22s
Details
Lint pre-flip continue-on-error / Verify continue-on-error flips have run-log proof (pull_request) Successful in 3m3s
Details
E2E Staging External Runtime / E2E Staging External Runtime (pull_request) Successful in 5m52s
Details
lint-continue-on-error-tracking / lint-continue-on-error-tracking (pull_request) Successful in 4m46s
Details
CI / Shellcheck (E2E scripts) (pull_request) Successful in 49s
Details
CI / Platform (Go) (pull_request) Failing after 8m34s
Details
Handlers Postgres Integration / Handlers Postgres Integration (pull_request) Failing after 8m7s
Details
sop-checklist / review-refire (pull_request_target) Has been skipped
Details
sop-checklist / all-items-acked (pull_request_target) Has been cancelled
Details
sop-tier-check / tier-check (pull_request_target) Failing after 5s
Details
389d18fa59 
Broadcast UI:
- BroadcastBanner: new component rendering org-wide BROADCAST_MESSAGE events
  as dismissible top-of-canvas banners (role=alert, aria-live=polite,
  aria-atomic, focus-visible ring on dismiss, backdrop-blur glass effect)
- canvas-events.ts: BROADCAST_MESSAGE handler appends to broadcastMessages
  array + sets liveAnnouncement for screen readers
- canvas.ts: broadcastMessages state + consumeBroadcastMessages action
- socket.ts: broadcast_enabled / talk_to_user_enabled workspace ability fields
- canvas-topology.ts: expose broadcastEnabled/talkToUserEnabled on node data
- canvas-events.test.ts: +14 test cases for BROADCAST_MESSAGE handler
- Canvas.tsx: renders <BroadcastBanner /> below toolbar

Mobile chat (PR #1240 integration):
- MobileChat.tsx, MobileDetail.tsx: identity MCP tools UI integration
- ChatTab.tsx: full ARIA tab pattern, keyboard nav, aria-live, focus rings
- ChannelsTab.tsx: channels tab with error contrast on red-tinted surface

WCAG / accessibility fixes:
- MissingKeysModal.tsx: deploy button enabled for runtimes with no required
  env vars — [].every(fn) is vacuously true in JS so guard removed
  (fixes #1022 regression from guard added in WCAG round 3)
- ThemeToggle.tsx: isConnected guard prevents INDEX_SIZE_ERR crash when
  React StrictMode double-invokes handlers during re-render
- ThemeToggle.test.tsx: +6 keyboard nav test cases (Home/End/Arrow/Enter);
  act() teardown guards removed now that isConnected guard prevents crash
- ScheduleTab.tsx: +3 focus-visible ring additions on interactive buttons
- BudgetSection.tsx: focus-visible ring on save button

Other:
- gitea-merge-queue.py: ApiError/URLError → exit 0 (transient failures
  no longer permanently fail workflow runs)
- useCanvasViewport.ts, WorkspaceNode.tsx, DropTargetBadge.tsx: minor
  support changes for new features

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
fix(canvas/ChatTab): add WCAG 2.4.7 focus-visible ring to the talk_to_user Enable button
CI / Detect changes (pull_request) Waiting to run
Details
CI / Platform (Go) (pull_request) Blocked by required conditions
Details
CI / Canvas (Next.js) (pull_request) Blocked by required conditions
Details
CI / Shellcheck (E2E scripts) (pull_request) Blocked by required conditions
Details
CI / Canvas Deploy Reminder (pull_request) Blocked by required conditions
Details
CI / Python Lint & Test (pull_request) Blocked by required conditions
Details
CI / all-required (pull_request) Blocked by required conditions
Details
E2E API Smoke Test / detect-changes (pull_request) Waiting to run
Details
E2E API Smoke Test / E2E API Smoke Test (pull_request) Blocked by required conditions
Details
E2E Staging Canvas (Playwright) / detect-changes (pull_request) Waiting to run
Details
E2E Staging Canvas (Playwright) / Canvas tabs E2E (pull_request) Blocked by required conditions
Details
Handlers Postgres Integration / detect-changes (pull_request) Waiting to run
Details
Handlers Postgres Integration / Handlers Postgres Integration (pull_request) Blocked by required conditions
Details
Harness Replays / detect-changes (pull_request) Waiting to run
Details
Harness Replays / Harness Replays (pull_request) Blocked by required conditions
Details
lint-required-no-paths / lint-required-no-paths (pull_request) Waiting to run
Details
Runtime PR-Built Compatibility / detect-changes (pull_request) Waiting to run
Details
Runtime PR-Built Compatibility / PR-built wheel + import smoke (pull_request) Blocked by required conditions
Details
Secret scan / Scan diff for credential-shaped strings (pull_request) Waiting to run
Details
gate-check-v3 / gate-check (pull_request) Waiting to run
Details
qa-review / approved (pull_request) Waiting to run
Details
security-review / approved (pull_request) Waiting to run
Details
Block internal-flavored paths / Block forbidden paths (pull_request) Successful in 25s
Details
Check migration collisions / Migration version collision check (pull_request) Successful in 47s
Details
MCP Stdio Transport Regression / MCP stdio with regular-file stdout (pull_request) Successful in 1m39s
Details
E2E Staging SaaS (full lifecycle) / E2E Staging SaaS (pull_request) Has been skipped
Details
E2E Staging SaaS (full lifecycle) / pr-validate (pull_request) Successful in 44s
Details
Lint curl status-code capture / Scan workflows for curl status-capture pollution (pull_request) Successful in 16s
Details
publish-runtime-autobump / bump-and-tag (pull_request) Has been skipped
Details
publish-runtime-autobump / pr-validate (pull_request) Successful in 1m2s
Details
sop-tier-check / tier-check (pull_request) Successful in 26s
Details
sop-checklist / all-items-acked (pull_request) Successful in 30s
Details
lint-continue-on-error-tracking / lint-continue-on-error-tracking (pull_request) Successful in 2m21s
Details
lint-mask-pr-atomicity / lint-mask-pr-atomicity (pull_request) Failing after 1m56s
Details
Lint workflow YAML (Gitea-1.22.6-hostile shapes) / Lint workflow YAML for Gitea-1.22.6-hostile shapes (pull_request) Successful in 1m52s
Details
Lint pre-flip continue-on-error / Verify continue-on-error flips have run-log proof (pull_request) Successful in 2m2s
Details
lint-required-context-exists-in-bp / lint-required-context-exists-in-bp (pull_request) Successful in 2m41s
Details
Ops Scripts Tests / Ops scripts (unittest) (pull_request) Successful in 2m6s
Details
E2E Staging External Runtime / E2E Staging External Runtime (pull_request) Successful in 5m45s
Details
98c8b63418 
PR #1256 has an outstanding WCAG blocker: the "Enable" button that
re-enables agent-to-user messaging lacks a focus-visible ring, making
keyboard navigation invisible for sighted keyboard users.

Adds focus-visible:ring-2 (with matching accent colour and zinc-900 offset)
to the Enable button className, satisfying WCAG 2.4.7 (Focus Visible).

Also adds ChatTab.talkToUserBanner.test.tsx with 5 test cases:
  - Banner hidden when talkToUserEnabled=true
  - Banner shown when talkToUserEnabled=false
  - Enable button renders
  - Enable button calls PATCH /workspaces/:id/abilities with correct payload
  - Enable button has focus-visible:ring-2 class (WCAG 2.4.7)

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
core-uiux force-pushed fix/1256-enable-button-focus-ring from 98c8b63418 to 309a80a746 2026-05-16 10:28:51 +00:00 Compare
core-security commented 2026-05-16 10:34:04 +00:00
Member
Copy Link
Copy Source

[core-security-agent] N/A — UI accessibility. ChatTab.tsx: adds focus-visible:ring-2 WCAG class to talk_to_user disabled-banner Enable button. ChatTab.talkToUserBanner.test.tsx: 5 cases (banner visibility, PATCH /abilities payload, WCAG focus-visible). Pure CSS + test. No auth, no exec, no user input.

[core-security-agent] N/A — UI accessibility. ChatTab.tsx: adds focus-visible:ring-2 WCAG class to talk_to_user disabled-banner Enable button. ChatTab.talkToUserBanner.test.tsx: 5 cases (banner visibility, PATCH /abilities payload, WCAG focus-visible). Pure CSS + test. No auth, no exec, no user input.
core-qa commented 2026-05-16 10:56:01 +00:00
Member
Copy Link
Copy Source

[core-qa-agent] APPROVED — WCAG 2.4.7 focus-visible fix

Suite: Canvas Vitest 211/211 pass

Delta: ChatTab.tsx — adds focus-visible:ring classes to the "Enable" button for `talk_to_user_enabled=false banner. Resolves a WCAG 2.4.7 focus-visible gap introduced when the banner was added.

Test: ChatTab.talkToUserBanner.test.tsx (+132 lines) — tests banner visibility, Enable button click (calls PATCH /workspaces/:id/abilities), and focus ring CSS presence.

e2e: N/A — UI CSS fix, not platform-touching

[core-qa-agent] APPROVED — WCAG 2.4.7 focus-visible fix **Suite:** Canvas Vitest 211/211 pass **Delta:** `ChatTab.tsx` — adds `focus-visible:ring` classes to the "Enable" button for `talk_to_user_enabled=false banner. Resolves a WCAG 2.4.7 focus-visible gap introduced when the banner was added. **Test:** `ChatTab.talkToUserBanner.test.tsx` (+132 lines) — tests banner visibility, Enable button click (calls PATCH /workspaces/:id/abilities), and focus ring CSS presence. **e2e:** N/A — UI CSS fix, not platform-touching
core-uiux closed this pull request 2026-05-16 11:05:55 +00:00
Some required checks failed
CI / Canvas Deploy Reminder (pull_request) Blocked by required conditions
Details
Handlers Postgres Integration / detect-changes (pull_request) Waiting to run
Details
Harness Replays / detect-changes (pull_request) Waiting to run
Details
lint-required-no-paths / lint-required-no-paths (pull_request) Waiting to run
Details
Runtime PR-Built Compatibility / detect-changes (pull_request) Waiting to run
Details
Block internal-flavored paths / Block forbidden paths (pull_request) Successful in 35s
Details
CI / Detect changes (pull_request) Successful in 32s
Details
CI / Shellcheck (E2E scripts) (pull_request) Successful in 42s
Details
E2E API Smoke Test / detect-changes (pull_request) Successful in 1m13s
Details
E2E Chat / detect-changes (pull_request) Successful in 1m17s
Details
E2E Staging Canvas (Playwright) / detect-changes (pull_request) Successful in 1m12s
Details
Secret scan / Scan diff for credential-shaped strings (pull_request) Successful in 30s
Details
gate-check-v3 / gate-check (pull_request) Successful in 54s
Details
qa-review / approved (pull_request) Failing after 38s
Details
sop-checklist / all-items-acked (pull_request) Successful in 27s
Details
security-review / approved (pull_request) Failing after 29s
Details
sop-tier-check / tier-check (pull_request) Successful in 24s
Details
E2E API Smoke Test / E2E API Smoke Test (pull_request) Successful in 12s
Required
Details
CI / Python Lint & Test (pull_request) Successful in 8m23s
Details
E2E Staging Canvas (Playwright) / Canvas tabs E2E (pull_request) Successful in 9m30s
Details
CI / Canvas (Next.js) (pull_request) Successful in 19m44s
Details
CI / Platform (Go) (pull_request) Successful in 20m58s
Details
CI / all-required (pull_request) Successful in 20m43s
Required
Details
E2E Chat / E2E Chat (pull_request) Failing after 14m29s
Details
Handlers Postgres Integration / Handlers Postgres Integration (pull_request) Has been cancelled
Required
Details
Harness Replays / Harness Replays (pull_request) Has been cancelled
Details
Runtime PR-Built Compatibility / PR-built wheel + import smoke (pull_request) Has been cancelled
Details

Pull request closed

Please reopen this pull request to perform a merge.
Sign in to join this conversation.
Reviewers
No Reviewers
Labels
Clear labels
area/ci
CI/CD pipeline issues
 do-not-auto-merge
Opt out of autonomous merge-queue merging
 kind/infrastructure
Infrastructure-related issues
 merge-queue
Ready for serialized Gitea merge queue
 merge-queue-hold
Temporarily hold PR in merge queue
 platform/go
Go platform test issues
 release-blocker
Blocks the staging→main promotion / a release
 release-test
security
test-label-sre
tier:high
High risk per dev-sop §SOP-6 — ceo only, 24h cooldown
 tier:low
Low risk per dev-sop §SOP-6 — engineers/managers/ceo can approve
 tier:medium
Medium risk per dev-sop §SOP-6 — managers/ceo can approve
 triage-test
test
 wip
Work in progress — do not auto-merge
No Label
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
agent-dev-a agent-dev-b agent-pm agent-researcher agent-reviewer agent-reviewer-1 agent-reviewer-cr2 app-fe (Molecule AI · app-fe) app-lead (Molecule AI · app-lead) app-qa (Molecule AI · app-qa) claude-ceo-assistant claude-ci-reader claude-status-reaper core-be (Molecule AI · core-be) core-devops (Molecule AI · core-devops) core-fe (Molecule AI · core-fe) core-lead (Molecule AI · core-lead) core-offsec (Molecule AI · core-offsec) core-qa (Molecule AI · core-qa) core-security (Molecule AI · core-security) core-uiux (Molecule AI · core-uiux) cp-be (Molecule AI · cp-be) cp-lead (Molecule AI · cp-lead) cp-qa (Molecule AI · cp-qa) cp-security (Molecule AI · cp-security) cui (Zhanlin Cui) dev-lead (Molecule AI · dev-lead) devops-engineer documentation-specialist (Molecule AI · documentation-specialist) fullstack-engineer (Molecule AI · fullstack-engineer) hongming hongming-ceo-delegated hongming-codex-laptop hongming-kimi-laptop hongming-pc2 infra-lead (Molecule AI · infra-lead) infra-runtime-be (Molecule AI · infra-runtime-be) infra-sre (Molecule AI · infra-sre) integration-tester (Molecule AI · integration-tester) mc-drift-bot molecule-code-reviewer plugin-dev (Molecule AI · plugin-dev) pm publish-runtime-bot pypi-publisher (Molecule AI PyPI Publisher (RFC#596)) release-manager (Molecule AI · release-manager) sdk-dev (Molecule AI · sdk-dev) sdk-lead (Molecule AI · sdk-lead) sop-drift-bot sop-tier-bot (SOP Tier-Check Bot) technical-writer (Molecule AI · technical-writer) triage-operator (Molecule AI · triage-operator)
No Assignees
3 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: molecule-ai/molecule-core#1337
Delete Branch "fix/1256-enable-button-focus-ring"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?