How to Get the Correct Y Position of an Element in CHATGPT UI
The Problem You try to get the vertical position of an element like this: window . scrollY ...but it always returns 0. Even worse, this common pattern also fails: element . getBoundingClientRect (). top + window . scrollY If you're inspecting the ChatGPT web UI, this can be very confusing. Why window.scrollY Is Always 0 In ChatGPT (and many modern web apps): The page itself does not scroll Scrolling happens inside a nested container The <body> is fixed-height That means: window . scrollY === 0 // always true So "the top of the page" is not the document - it's the scrollable container. Step 1: Target the Element const el = document . querySelector ( " div.whitespace-pre-wrap " ); Step 2: Find the Scroll Container This helper walks up the DOM and finds the element that actually scrolls: function findScrollParent ( element ) { let parent = element . parentElement ; while ( parent ) { const style = getComputedStyle ( parent ); if ( / ( auto|scroll ) / . test ( style . overflowY )) { return
Continue reading on Dev.to JavaScript
Opens in a new tab
