Stuck on an issue?
Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.
And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.
Scroll position is lost when screenshots are taken
See original GitHub issueDue to the way the DOM is cloned, sent to the cloud, and then recreated, the scroll positions of <div>'s are lost.
I doubt there’s a simple solution, but in theory you could detect, save, and restore the scroll position (see jQuery scrollTop())
Screenshot…
It should look like this (it’s a React Virtualized Table scrolled to the bottom)…
Issue Analytics
- State:
- Created 5 years ago
- Reactions:1
- Comments:10 (4 by maintainers)
Top Results From Across the Web
Screenshot is missing content due to lazy loading - Applitools
Another problem is that the screenshot is missing elements on the page in which their loading is triggered by scrolling. The Solution.
Read more >Here's why you can't take scrolling screenshots on Android 11
Hold the Power and Volume Down buttons for a few seconds, or use the three-finger swipe. Once you see the screenshot preview appear,...
Read more >How can I get the scrollbar position with JavaScript?
You can use element.scrollTop and element.scrollLeft to get the vertical and horizontal offset, respectively, that has been scrolled.
Read more >Maintain and restore scroll position in React mobile apps
Learn how to maintain React app scroll position when users close a full-page mobile menu to improve UX by implementing a custom Hook....
Read more >How to Capture Scrolling Screenshot Windows 10/11
To take a scrolling screenshot on Windows with SreenPresso, you only need to download and install it, then position your cursor in a...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Thanks for the answer, we ended up using another solution, and checking whether or not an element was clickable
Usually the best way to combat this is to provide Percy CSS that un-overflows the container that’s clipping the height of the page (that way a full page screenshot can be captured, rather than just he current viewport). Browsers will respect any content that’s clipped and capture only the visible portion of the page.