daangn
@dnd-kit/core 라이브러리의 DndContext 사용시 하단에 빈 스크롤이 생기는 현상 제보
안녕하세요,
@dnd-kit/core 라이브러리의 DndContext를 사용할 때 접근성을 지원하기 위해 생성되는 LiveRegion 컴포넌트로 인해 하단에 불필요한 스크롤이 생기는 문제가 발생해서 제보드려요.
이 문제는 LiveRegion 컴포넌트가 position: fixed로 지정되면서 뷰포트 하단에 고정되고, 이로 인해 stackflow의 스타일 속성과 충돌하여 예상치 못한 레이아웃 문제가 발생하는 것으로 예상하고 있는데요.
비슷한 문제를 다룬 관련된 이슈를 참고해서 이 문제를 해결했어요. 해결 방법은 LiveRegion 컴포넌트를 stackflow div의 외부로 이동시켜 stackflow의 CSS 속성과의 충돌을 방지하는 것이었어요.
이 문제를 해결하기 위해 position: fixed 속성과 stackflow 내부의 스타일과 충돌하는 부분을 확인해주시면 좋을 것 같아요. 검토 부탁드려요!
재연 가능한 최소 예제를 통해 확인한 결과 activity 요소에 적용된 transform: translate3d(0, 0, 0); 속성이 새로운 스태킹 컨텍스트를 형성하면서, 자식 요소의 position: fixed가 뷰포트 영역이 아닌, activity 요소를 기준으로 고정되는 현상이 발생하는 것을 확인했습니다!
이 문제는 특정 라이브러리나 코드베이스에 한정된 것이 아니라, 스태킹 컨텍스트를 생성하는 CSS 속성의 동작에 따른 일반적인 이슈로 판단됩니다. 따라서, 이슈를 라이브러리 관점에서 어떻게 처리할지 검토 부탁드립니다!
