fix(a11y): fix aria-allowed-attr, invalid sidebar list structure, and session filter label mismatch on flow editor

[olayinkaadelakun]

Summary

Fixes three structural accessibility failures on the flow editor (/flow/[id]) that blocked Lighthouse from scoring 100/100.

aria-allowed-attr (WCAG 4.1.2 — Critical)

Radix PopoverTrigger with asChild was injecting aria-expanded, aria-haspopup, and aria-controls onto a <div>. These attributes are only valid on interactive elements. Changed to <button type="button"> so the attributes are legal and the element is keyboard-focusable.

list / listitem (WCAG 1.3.1 — Serious)

SidebarSegmentedNav was wrapping each <SidebarMenuItem> (<li>) in a <div>, producing an invalid <ul> → <div> → <li> structure. Replaced the wrapper <div> with <Fragment> and the <Separator> with <li role="separator" aria-hidden="true"> so all six nav items are direct <li> children of the <ul>.

label-content-name-mismatch (WCAG 2.5.3 — Serious)

The session filter button had aria-label="Session filter" but displayed "All Sessions" (or a session ID) as visible text. WCAG 2.5.3 requires the accessible name to contain the visible label so voice-control users can activate it by speaking what they see. Removed the mismatched aria-label; visible text is sufficient.

Extras

Added aria-label to the FlowMenu button trigger (flow name or "Untitled Flow" fallback) and to the Flow Settings and Memory Config PopoverContent panels for richer screen reader context.

---

Test plan

• Broken tests that queried the session filter button by { name: "Session filter" } are fixed — button now carries data-testid="session-filter-button" and all queries updated
• New test: menu_bar_display element is a <button> (not a <div>)
• New test: FlowMenu aria-label falls back to "Untitled Flow" when flow name is absent
• New test: PopoverContent in FlowMenu carries aria-label="Flow settings"; in MemoryDetails carries aria-label="Config"
• New tests: sidebar separator renders exactly once as <li role="separator" aria-hidden="true">, appears immediately before the memories item, no anonymous <div> children inside the sidebar menu
• All 81 affected unit tests pass (FlowMenu.spec, MemoryDetails.test, MemoryDetailsHeader.test, sidebarSegmentedNav.test)
• Manual: run Lighthouse on /flow/[id] Traces view and confirm score reaches 100/100
• Manual: confirm no regression on /flows Lighthouse score

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

🗂️ Base branches to auto review (1)

• release-.*

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: fab05a5f-9c6b-43d4-ac30-178f08902a60

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch LE-1573

---

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

• X
• Mastodon
• Reddit
• LinkedIn

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

[github-actions]

✅ Test Coverage Advisor

No source changes detected without accompanying tests. Thanks for keeping coverage up! 🎉

Advisory check only — never blocks merge.

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 58.46%. Comparing base (bac8a7b) to head (d697099).

❌ Your project check has failed because the head coverage (54.34%) is below the target coverage (60.00%). You can increase the head coverage or adjust the target coverage.

Additional details and impacted files

@@             Coverage Diff             @@
##           LE-1568   #13668      +/-   ##
===========================================
- Coverage    58.68%   58.46%   -0.23%     
===========================================
  Files         2304     2304              
  Lines       219368   219319      -49     
  Branches     31103    32909    +1806     
===========================================
- Hits        128740   128217     -523     
- Misses       89170    89643     +473     
- Partials      1458     1459       +1     

Flag	Coverage Δ
frontend	57.76% <100.00%> (-0.33%)	⬇️

Flags with carried forward coverage won't be shown. Click here to find out more.

Files with missing lines	Coverage Δ
...e/appHeaderComponent/components/FlowMenu/index.tsx	94.01% <100.00%> (+0.07%)	⬆️
...s/MemoriesMainContent/components/MemoryDetails.tsx	95.67% <100.00%> (+0.08%)	⬆️
...riesMainContent/components/MemoryDetailsHeader.tsx	93.57% <100.00%> (ø)
...idebarComponent/components/sidebarSegmentedNav.tsx	96.19% <100.00%> (+0.15%)	⬆️

... and 85 files with indirect coverage changes

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[github-actions]

Frontend Unit Test Coverage Report

Coverage Summary

Lines	Statements	Branches	Functions
	43.43% (57872/133246)	69.08% (7849/11362)	41.72% (1301/3118)

Unit Test Results

Tests	Skipped	Failures	Errors	Time
4965	0 💤	0 ❌	0 🔥	17m 57s ⏱️