feat(toolbar)!: move the AJAX chip into a menu beside Extensions; the bar keeps the page request instead of following AJAX tags.

[terabytesoftw]

Pull Request

• Breaking change (fix or feature that would cause existing functionality to change)
• Bugfix (non-breaking change that fixes an issue)
• CI/build configuration
• Documentation update
• New feature (non-breaking change that adds functionality)
• Refactoring (no functional changes)

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 100.00%. Comparing base (2101333) to head (80130d1).
✅ All tests successful. No failed tests found.

Additional details and impacted files

@@             Coverage Diff             @@
##                main       #64   +/-   ##
===========================================
  Coverage     100.00%   100.00%           
  Complexity      2355      2355           
===========================================
  Files            165       165           
  Lines           8737      8737           
===========================================
  Hits            8737      8737           

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[coderabbitai]

Warning

Review limit reached

Next included review available in 48 minutes.

Check out review usage here.

View limit details

Limit details: You’ve used the included review currently available.

You've used all free OSS reviews for now. Wait for the free limit to reset to keep reviewing this public repository.

Learn how review limits work.

Review configuration:

⚙️ Run configuration

Configuration used: Organization UI

Review profile: ASSERTIVE

Plan: Advanced

Run ID: 40758a79-65a9-43b9-92da-ed67e8b282eb

📥 Commits

Reviewing files that changed from the base of the PR and between d6853ec and 80130d1.

⛔ Files ignored due to path filters (2)

• resources/assets/dist/js/toolbar.min.js is excluded by !**/dist/**, !**/*.min.js
• resources/assets/svg/dots.svg is excluded by !**/*.svg

📒 Files selected for processing (2)

• resources/src/toolbar/icons.js
• resources/src/toolbar/toolbar-shadow.css

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: ASSERTIVE

Plan: Advanced

Run ID: 6327b61e-1c11-40bb-81eb-73d5ccf9ed4a

📥 Commits

Reviewing files that changed from the base of the PR and between 2101333 and d6853ec.

⛔ Files ignored due to path filters (1)

• resources/assets/dist/js/toolbar.min.js is excluded by !**/dist/**, !**/*.min.js

📒 Files selected for processing (21)

• resources/src/toolbar/drawer.js
• resources/src/toolbar/element.js
• resources/src/toolbar/extensions.js
• resources/src/toolbar/index.js
• resources/src/toolbar/loader.js
• resources/src/toolbar/loading.js
• resources/src/toolbar/menu.js
• resources/src/toolbar/messaging.js
• resources/src/toolbar/panel.js
• resources/src/toolbar/render.js
• resources/src/toolbar/toolbar-shadow.css
• resources/tests/toolbar-element-ajax.test.js
• resources/tests/toolbar-element-extensions.test.js
• resources/tests/toolbar-element-lifecycle.test.js
• resources/tests/toolbar-element-loading.test.js
• resources/tests/toolbar-element-render.test.js
• resources/tests/toolbar-extensions.test.js
• resources/tests/toolbar-menu.test.js
• resources/tests/toolbar-messaging.test.js
• resources/tests/toolbar-runtime.test.js
• stryker.config.mjs

💤 Files with no reviewable changes (4)

• resources/src/toolbar/loading.js
• resources/src/toolbar/panel.js
• resources/src/toolbar/extensions.js
• resources/tests/toolbar-extensions.test.js

Included review availability: Your plan provides up to 1 included review per hour; 0 remain after this review.

📜 Recent review details

⏰ Context from checks skipped due to timeout. (4)

• GitHub Check: mutation / PHP 8.5-ubuntu-latest
• GitHub Check: Verify Vite build reproduces dist.
• GitHub Check: mutation / PHP 8.5-ubuntu-latest
• GitHub Check: Verify Vite build reproduces dist.

🧰 Additional context used

🪛 ast-grep (0.45.3)

resources/src/toolbar/element.js

[warning] 245-252: Avoid assigning untrusted data to innerHTML/outerHTML or document.write
Context: this.barRoot.innerHTML = this.expanded
? renderBrand(view) +
profilingChip +
renderPanels(view, split.inline) +
renderAjaxMenu(view) +
renderExtensions(view, split.extensions) +
renderControls(view)
: renderCollapsedOpener(view)
Note: [CWE-79] Improper Neutralization of Input During Web Page Generation ('Cross-site Scripting').

(inner-outer-html)

🪛 OpenGrep (1.29.0)

resources/src/toolbar/element.js

[WARNING] 130-130: Setting innerHTML with dynamic content can lead to XSS. Use textContent or createElement with proper escaping instead.

(coderabbit.xss.innerhtml-assignment)

---

[WARNING] 246-253: Setting innerHTML with dynamic content can lead to XSS. Use textContent or createElement with proper escaping instead.

(coderabbit.xss.innerhtml-assignment)

🔇 Additional comments (13)

resources/src/toolbar/menu.js (1)

13-55: LGTM!

resources/tests/toolbar-menu.test.js (1)

1-78: LGTM!

stryker.config.mjs (1)

17-17: LGTM!

resources/src/toolbar/index.js (1)

12-21: LGTM!

resources/tests/toolbar-element-extensions.test.js (1)

104-118: LGTM!

Also applies to: 150-150, 180-180, 198-198, 208-244, 255-255, 285-286, 312-321, 333-355, 392-412, 422-422, 438-438

resources/src/toolbar/render.js (2)

32-33: LGTM!

Also applies to: 46-46, 153-245, 295-320

---

249-267: 🩺 Stability & Availability

resources/src/toolbar/menu.js defines the ajax menu and all selectors match the rendered AJAX markup. toolbarMenu("ajax") therefore returns a definition, so the claimed early return is not caused by a missing menu entry or selector mismatch.

resources/src/toolbar/element.js (2)

106-145: LGTM!

Also applies to: 156-157, 206-211, 250-250

---

147-148: 📐 Maintainability & Code Quality

Keep normalizeUrl; it still has active callers.

loader.js and drawer.js call toolbar.normalizeUrl(...). Removing the prototype method or its normalizeToolbarUrl import would break both loading and panel navigation.

resources/src/toolbar/toolbar-shadow.css (2)

493-562: LGTM!

Also applies to: 575-625, 864-864, 877-877, 893-910

---

660-665: 🎯 Functional Correctness

The left-docking condition does not apply. normalizeToolbarPosition reduces every position to top or bottom, and element.js writes that normalized value back to data-position before adding the position class. No left position reaches the menu layout.

resources/tests/toolbar-element-ajax.test.js (1)

41-118: LGTM!

Also applies to: 129-138, 204-239, 281-318, 324-507, 550-625

resources/tests/toolbar-element-render.test.js (1)

166-166: LGTM!

Also applies to: 180-181, 194-194, 214-219

---

📝 Summary

Summary by CodeRabbit

• New Features

  • Replaced the AJAX panel with a dropdown menu showing tracked requests, statuses, URLs, timing, and available capture links.
  • Unified AJAX and Extensions controls under a shared menu system.
  • Opening one toolbar menu now closes any other open menu.
  • Added improved keyboard and focus handling when menus refresh or close.

• Style

  • Updated toolbar menus with consistent layouts, badges, request rows, and responsive styling.

Walkthrough

The toolbar replaces Extensions-only state with a shared named-menu system. The AJAX panel becomes a request menu with in-place refresh and focus handling. Loader rollback and tag-following behavior are removed. Tests and styles follow the new menu structure.

Changes

Toolbar menu system

Layer / File(s)	Summary
Menu contract and drawer lifecycle resources/src/toolbar/menu.js, resources/src/toolbar/drawer.js, resources/src/toolbar/render.js, resources/tests/toolbar-menu.test.js	Named AJAX and Extensions menus now share openMenu, selectors, focus handling, Escape dismissal, pointer dismissal, and toggle behavior.
AJAX menu rendering and refresh resources/src/toolbar/render.js, resources/src/toolbar/element.js, resources/src/toolbar/panel.js, resources/src/toolbar/toolbar-shadow.css, resources/tests/toolbar-element-ajax.test.js	The AJAX panel now renders request rows, status badges, capture links, empty states, and shared menu styling. Refreshes replace the menu in place and restore focus when possible.
Toolbar loading and request lifecycle resources/src/toolbar/element.js, resources/src/toolbar/loader.js, resources/src/toolbar/loading.js, resources/src/toolbar/messaging.js, resources/tests/toolbar-element-lifecycle.test.js, resources/tests/toolbar-element-loading.test.js, resources/tests/toolbar-messaging.test.js, resources/tests/toolbar-runtime.test.js	Loader callbacks, rollback metadata, tag tracking, and followTag behavior are removed. Requests now settle through direct rendering and toolbar data updates.
Extensions menu integration resources/src/toolbar/extensions.js, resources/src/toolbar/render.js, resources/tests/toolbar-element-extensions.test.js, resources/tests/toolbar-extensions.test.js	Extensions markup and tests use the named-menu API. Opening AJAX and Extensions menus now switches the shared openMenu value and closes the other menu.

Priority: ➖ Normal

Estimated code review effort: 4 (Complex) | ~45 minutes

Change: Feature

Sequence Diagram(s)

sequenceDiagram
  participant User
  participant ToolbarDrawer
  participant ToolbarMenu
  participant ToolbarDOM
  User->>ToolbarDrawer: click .menu-toggle
  ToolbarDrawer->>ToolbarMenu: resolve data-menu
  ToolbarDrawer->>ToolbarDOM: set openMenu and sync menu state
  ToolbarDOM-->>User: show one menu and focus its first action

Loading

Merge Risk: ⚪ Minimal · up to d6853

No concrete current-head defect remains, so the toolbar change is ready to merge after normal checks.

🚥 Pre-merge checks | ✅ 3 | ❌ 2

❌ Failed checks (1 warning, 1 inconclusive)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 52.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 25 functions across 16 files. (1 skipped:…	Write docstrings for the functions missing them to satisfy the coverage threshold.
Description check	❓ Inconclusive	The description only marks the pull request as a breaking change. It does not explain the toolbar menu changes or the AJAX request behavior.	Add a concise summary stating that the AJAX chip moves into a menu beside Extensions and that the toolbar keeps the page request instead of following AJAX tags.

✅ Passed checks (3 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly summarizes the main changes: moving the AJAX chip into a shared menu and keeping the page request instead of following AJAX tags.
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.

Full details: Docstring Coverage

Explanation

Docstring coverage is 52.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 25 functions across 16 files. (1 skipped: 1 unsupported.)

✨ Finishing Touches 💡 1

📝 Generate docstrings 💡

• Commit to this branch
• Create a new PR

🧪 Generate unit tests (beta)

• Commit to this branch
• Create a new PR

---

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

_{A rabbit hops where menu doors align
AJAX rows refresh in a tidy line
One open name guides the way
Focus returns where buttons stay
Extensions and requests now share the day}

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