Conversation
- Add SidebarView.resize(width) and SidebarView.getWidth() APIs for programmatic sidebar resizing with proper persistence and resync - Auto-widen sidebar to 370px on first AI tab activation when narrower than the preferred width, using a one-time view state flag - Switch to Files tab when Show in File Tree is triggered from another tab - Expose SidebarView on brackets.test for integration tests - Add integration tests for resize API, Show in File Tree tab switching, and sidebar width save/restore
![github-advanced-security[bot]](https://avatars.githubusercontent.com/in/57789?s=60&v=4){kind=small}
| '<span class="ai-tool-icon" style="color:' + color + '">' + | ||
| '<i class="' + iconClass + '"></i>' + | ||
| '</span>' |
Check failure
Code scanning / CodeQL
DOM text reinterpreted as HTML High
Show autofix suggestion
Hide autofix suggestion
Copilot Autofix
AI about 3 hours ago
In general, the problem is that untrusted DOM text (data-tool-icon) is being concatenated into an HTML string that is then interpreted as HTML. The safest fix is to construct the DOM nodes programmatically using document.createElement / jQuery element creation and set attributes and text through DOM APIs, rather than by string concatenation. This way, attacker-controlled values can only populate attribute values or text, not create new elements or event handlers.
For this specific case, instead of building:
$prev.find(".ai-tool-spinner").replaceWith(
'<span class="ai-tool-icon" style="color:' + color + '">' +
'<i class="' + iconClass + '"></i>' +
'</span>'
);we should:
- Create a
<span>element with classai-tool-icon. - Apply the color via
.css("color", color)(orstyle.color = color) instead of interpolating it into astyleattribute string. - Create an
<i>element and use.addClass(iconClass)to add the class string; jQuery will treat it as class names, not as HTML. - Append the
<i>element to the<span>. - Call
.replaceWith()with the constructed jQuery element.
This preserves existing behavior (same DOM structure, same classes, same color) while eliminating the re-interpretation of a string as HTML. No new external dependencies are required; we only use jQuery and the DOM API, both already in use.
The change is localized to the _finishActiveTools function in src/core-ai/AIChatPanel.js, around lines 659–668. We do not need to modify imports or other parts of the file.
| @@ -661,11 +661,13 @@ | ||
| $prev.addClass("ai-tool-done"); | ||
| const iconClass = $prev.attr("data-tool-icon") || "fa-solid fa-check"; | ||
| const color = $prev.css("--tool-color") || "#adb9bd"; | ||
| $prev.find(".ai-tool-spinner").replaceWith( | ||
| '<span class="ai-tool-icon" style="color:' + color + '">' + | ||
| '<i class="' + iconClass + '"></i>' + | ||
| '</span>' | ||
| ); | ||
| const $iconSpan = $("<span>").addClass("ai-tool-icon").css("color", color); | ||
| const $icon = $("<i>"); | ||
| if (iconClass) { | ||
| $icon.addClass(iconClass); | ||
| } | ||
| $iconSpan.append($icon); | ||
| $prev.find(".ai-tool-spinner").replaceWith($iconSpan); | ||
| }); | ||
| } | ||
|
|
- Delay adding ai-tool-done class by 1.5s so the streaming preview remains visible while the tool is active and briefly after completion - Add final flush of aiToolStream on content_block_stop to ensure browser receives latest preview data before tool completes - Update get_browser_console_logs MCP tool description to mention PhNode logs are included
|
1 participant
No description provided.