Updated `sanitizeElement` to strictly remove whitespace and control characters from URI attributes before validation.
This prevents bypasses like `java\tscript:` in `href`, `src`, `action`, and `formaction` attributes.
Added comprehensive unit tests covering these bypass vectors.
Co-authored-by: AEmotionStudio <163354043+AEmotionStudio@users.noreply.github.com>
Added `sanitizeElement` utility to recursively remove inline event handlers (on*) and javascript: URIs from HTML elements.
Applied sanitization in `MagnifyGlass.renderHtmlOverlays` when cloning nodes for the magnifying glass view.
Added unit tests to verify sanitization logic.
Co-authored-by: AEmotionStudio <163354043+AEmotionStudio@users.noreply.github.com>
Added `sanitizeElement` utility to recursively remove inline event handlers (on*) from HTML elements.
Applied sanitization in `MagnifyGlass.renderHtmlOverlays` when cloning nodes for the magnifying glass view.
Added unit tests to verify sanitization logic.
Co-authored-by: AEmotionStudio <163354043+AEmotionStudio@users.noreply.github.com>
- Replaced read-only hex code span with an editable text input in `createColorPicker`
- Implemented bidirectional sync between text input and color picker
- Added validation for hex codes and auto-correction on change/blur
- Ensured keydown propagation is stopped to prevent triggering global shortcuts
- Added aria-label for accessibility
- Updated unit tests to verify sync logic and event handling
- Added CSS styles for `magnify-color-preview` input to match UI design
Co-authored-by: AEmotionStudio <163354043+AEmotionStudio@users.noreply.github.com>
Reduced redundant iterations over `app.graph._nodes` in `OffscreenRenderer`.
Implemented `getVisibleNodes` to calculate visible nodes once per frame (O(N)) and reused this list for text, title, and image preview rendering passes (O(M)).
This improves performance for large graphs by replacing multiple O(N) traversals with a single O(N) traversal followed by O(M) traversals where M << N.
Added unit tests in `tests/unit/OffscreenRenderer.test.ts` to verify node visibility culling logic.
Updated `.jules/bolt.md` with performance learnings.
Co-authored-by: AEmotionStudio <163354043+AEmotionStudio@users.noreply.github.com>
- Replaced read-only hex code span with an editable text input in `createColorPicker`
- Implemented bidirectional sync between text input and color picker
- Added validation for hex codes and auto-correction on blur
- Ensured keydown propagation is stopped to prevent triggering global shortcuts
- Added aria-label for accessibility
- Updated unit tests to verify sync logic and event handling
- Added CSS styles for `magnify-color-preview` input to match UI design
Co-authored-by: AEmotionStudio <163354043+AEmotionStudio@users.noreply.github.com>
Removed the `isHtml` flag support in `UIManager`, which allowed bypassing HTML escaping.
Replaced it with a `specialType` mechanism (specifically 'focus-node') to render trusted
HTML structures internally while ensuring dynamic values are always escaped.
Updated `Security.test.ts` to verify the fix and prevent regression.
Fixes: Potential XSS vulnerability via unchecked HTML injection.
Refactors `MagnifyGlass.updateMagnifiedView` and `calculateSourceRegion` to accept an optional cached `DOMRect`. This allows `EventHandler` to pass the canvas dimensions it read before updating the glass position, preventing a forced synchronous reflow (Read-Write-Read cycle) that was previously occurring on every mouse move frame.
Optimizes the hot path for mouse movement and magnifier updates.
- Add visible focus indicators for interactive elements in the sidebar
- Add aria-valuetext to sliders to announce values with units
- Update journal with accessibility learnings
- Implemented 'onWidgetEdit' listener in 'InfoPanel' to force refresh when popout widgets change.
- Refactored 'NodeDataExtractor' to display all widgets in the inspector (matching popout behavior) and removed aggressive deduplication.
- Fixed theme update logic in 'UIManager' to correctly handle hyphenated theme names.
- Enhanced combo box editing in 'popout-viewer.html' with better selection and blur handling.
- Added 'Obsidian', 'Obsidian Dark', and 'Milk White' themes to Info Panel and PopOut viewer.
- Improved theme detection in 'StateManager' to support new themes.
- Implemented button widget support in PopOut viewer with 'button-click' event handling.
- Enhanced widget options handling in 'PopOutManager' for combo widgets.
- Updated dropdown accessibility tests.
- Updated `drawNodeImages` to render multiple images from `node.imgs[]` in a grid.
- Implemented aspect-ratio-preserving centering for each image within its grid cell.
- Added configurable gap between images in the grid.
- Added support for inline action buttons in the inspector panel.
- Implemented `InlineControlFactory.createInlineButton` to execute widget callbacks.
- Enhanced `WidgetSyncManager` to detect 'button' widgets via type or heuristics.
- Updated `UIManager` and `NodeDataExtractor` to process actionable widgets.
- Added styles for inline action buttons.
- Added `Escape` key handler to slider widget editor.
- Refactored canvas coordinate calculations in `MagnifyGlass` for better accuracy.
- Refactor `showWebGLError` to use `document.createElement` instead of `innerHTML`
- Replace inline `onclick` handler with `addEventListener` for CSP compliance
- Add unit test to verify XSS prevention and button functionality
- Add role="button", tabindex="0", and aria-expanded to section headers
- Implement keyboard navigation (Enter/Space) for expanding/collapsing sections
- Generate unique IDs for aria-controls to link headers and content bodies
- Ensure proper accessibility attributes for sidebar inspector panel
This change improves keyboard navigation and screen reader support for the
sidebar settings and inspector panels.
- Moves invariant calculations (DPR, scaling, pivot points) out of the widget loop in `renderHtmlOverlays`.
- Reduces redundant property accesses and arithmetic operations per frame.
- Improves performance for workflows with many visible nodes.
- Added '*' hotkey to focus the currently inspected node
- Added 'ArrowLeft' and 'ArrowRight' hotkeys to navigate nodes by execution order
- Updated README.md and CHANGELOG.md with the new hotkeys and navigation features
- Added full keyboard support (Arrows, Enter, Esc) for all dropdown types
- Implemented global '*' hotkey to center canvas on currently inspected node
- Improved event handling to reliably intercept keys before ComfyUI canvas
- Fixed memory leaks in dropdown event listeners
- Allow precise value input by removing automatic step rounding in sync manager
- Standardize stepper button increment to 1 for finer control
- Ensure dropdowns close when clicking the canvas
Ensures `htmlOverlayContainer` is cleared when exiting `renderHtmlOverlays` early (e.g. no nodes or zero scale), preventing stale content from persisting.
- Replaced `innerHTML` with `textContent` for dynamic titles in `SidebarSettings.ts` to prevent potential XSS.
- Maintained `innerHTML` usage only for trusted static SVG icons.
- Added defense-in-depth against future changes that might introduce user-controlled titles.
Refactors `renderHtmlOverlays` to eliminate layout thrashing by separating DOM read operations (getBoundingClientRect, getComputedStyle) from DOM write operations.
- Creates a `RenderTask` interface to store read data.
- Implements a Read Phase to collect measurements and cull nodes.
- Implements a Write Phase to batch DOM updates using a DocumentFragment.
- Preserves video tracking logic to ensure animation loop continuity.
- Reduces browser reflows from O(n) to O(1) per frame.
- Replaced native select elements with a viewport-aware 'CustomDropdown' for better reliability and positioning.
- Added 'High Contrast Text' mode for improved legibility in inputs and values.
- Implemented parameter value deduplication in 'NodeDataExtractor' to reduce panel clutter.
- Expanded Google Font selection with 10+ new styles.
- Switched UI dimensions to relative units (em) for consistent scaling.
- Fixed layout 'bouncing' in sticky mode by removing hover transforms.
- Added a copy-to-clipboard button for 'Category' and 'Path' node details in the Inspector panel.
- Enhanced dropdown interaction stability by using 'mousedown' capture phase and broad event propagation prevention in 'InlineControlFactory'.
- Updated 'build' script to ensure CSS files are correctly synchronized from 'css/' to 'web/'.
- Standardized copy icon and styling, including a subtle checkmark feedback on success.
- Fixed an issue where the Inspector panel would 'bounce' due to hover transforms while in sticky mode.
- Improved dropdown closure logic to handle clicks both outside and within the panel content area.
- Optimized 'persist-active' mode to use viewport-based height limits and proper flex scrolling.
- Enhanced event propagation handling in 'InlineControlFactory' for better dropdown stability.
- Standardized panel font sizes and updated inline dropdowns to match the green theme.
- Added theme-specific CSS overrides for Light and GitHub themes in widget editors.
- Simplified copy-to-clipboard UI feedback.
