-
Notifications
You must be signed in to change notification settings - Fork 3
Support full CSS overflow scroll behavior in DocumentEventDispatcher for nested scroll containers #229
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
…lementation Co-authored-by: yorkie <1935767+yorkie@users.noreply.github.com>
Co-authored-by: yorkie <1935767+yorkie@users.noreply.github.com>
Co-authored-by: yorkie <1935767+yorkie@users.noreply.github.com>
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pull Request Overview
This PR implements comprehensive support for nested scroll containers with proper CSS overflow behavior in JSAR's browser engine. Previously, only single-level scroll containers were supported, preventing proper handling of complex layouts with nested scrollable elements.
Key changes:
- Enhanced scroll event bubbling to propagate from innermost to outermost scroll containers when boundaries are reached
- Added boundary detection to prevent unnecessary scroll operations when containers can't scroll further
- Improved CSS overflow compliance by respecting
scroll,auto, andhiddenvalues in scroll chain building
Reviewed Changes
Copilot reviewed 18 out of 18 changed files in this pull request and generated 5 comments.
Show a summary per file
| File | Description |
|---|---|
src/client/scroll/scrollable_area.hpp |
Added iostream include and changed scroll methods to return boolean success indicators |
src/client/scroll/scrollable_area.cpp |
Implemented boundary checking and debug output for scroll operations |
src/client/layout/layout_view.cpp |
Added lifecycle callback for layout completion |
src/client/layout/layout_object.hpp |
Added method to find deepest scrollable container |
src/client/layout/layout_object.cpp |
Implemented deepest scrollable container search with CSS overflow filtering |
src/client/layout/layout_box.hpp |
Changed scroll methods to return success status and reorganized layout lifecycle |
src/client/layout/layout_box.cpp |
Updated scroll methods with boundary checking and moved layout updates to lifecycle callback |
src/client/dom/element.hpp |
Changed scroll simulation method to return success status |
src/client/dom/element.cpp |
Added boundary checking and success return values for scroll operations |
src/client/dom/document_renderer.cpp |
Fixed Z-coordinate unit conversion from pixels to meters |
src/client/dom/document_event_dispatcher.hpp |
Added scroll container chain building and current target scrolling methods |
src/client/dom/document_event_dispatcher.cpp |
Implemented nested scroll container chain building and automatic event bubbling |
src/client/dom/document.hpp |
Changed document scroll method to return success status |
src/client/dom/document.cpp |
Updated document scroll with success return value |
src/client/builtin_scene/web_content.cpp |
Fixed code formatting inconsistencies in constructor initializer lists |
src/client/builtin_scene/instanced_mesh.hpp |
Added debug output operator for ContentInstancesList |
src/client/builtin_scene/instanced_mesh.cpp |
Removed std:: prefix from unordered_map for consistency |
fixtures/html/css-overflow.html |
Updated test HTML to demonstrate nested scroll container functionality |
| #pragma once | ||
|
|
||
| #include <optional> | ||
| #include <iostream> |
Copilot
AI
Aug 26, 2025
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The <iostream> include should not be added to header files unless absolutely necessary. The operator<< friend function is only declared here and implemented in the .cpp file, so this include is not needed in the header. Move this include to the .cpp file only.
This PR implements comprehensive support for nested scroll containers with proper CSS overflow behavior, enabling JSAR to handle complex spatial web layouts that match standard browser scroll event propagation.
Problem
Previously, JSAR's
DocumentEventDispatcheronly supported single-level scroll containers. When a user interacted with nested scrollable elements, scroll events would target the first containing scroll container rather than the deepest one, breaking expected browser behavior for nested layouts like:Solution
This implementation adds proper nested scroll container support with:
1. Boundary-Aware Scroll Detection
ScrollableArea::canScrollInDirection()to check if containers can scroll further before attempting scroll operations2. Scroll Container Chain Building
DocumentEventDispatcher::buildScrollContainerChain()to create an ordered hierarchy from deepest to shallowest scrollable containersscrollandauto, excludeshiddenfrom user-initiated scrolling3. Automatic Event Bubbling
4. CSS Overflow Compliance
overflow: scrollandoverflow: auto- Participate in scroll chains and handle user scroll eventsoverflow: hidden- Excluded from scroll chains for user-initiated scrolling (can still be scrolled programmatically)Technical Details
The implementation maintains backward compatibility while adding nested support:
prepareSetupForScroll()now builds a complete scroll container chain instead of finding just the first containeronScroll()attempts to scroll the current target, and if it can't scroll further, automatically bubbles to the next parent containertryScrollCurrentTarget()performs boundary checking before scrolling and returns whether the scroll was successfulTesting
Added comprehensive test scenarios and boundary checking tests to validate the implementation works correctly with various nesting configurations and overflow values.
This enables spatial web content to support complex layouts and user interactions with nested scroll containers, bringing JSAR's browser engine into alignment with expected web standards for overflow and scroll event propagation.
Fixes #228.
Warning
Firewall rules blocked me from connecting to one or more addresses (expand for details)
I tried to connect to the following addresses, but was blocked by firewall rules:
registry.npmmirror.comnpm ci(dns block)If you need me to access, download, or install something from one of these locations, you can either:
✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.