#browser-automation ## Scroll ### Making assertions about an element's position If a test needs to make assertions about an element's position after scrolling: - Keep in mind that an element's position after scroll may be different with different viewport height - Keep in mind that scrolling is not possible with a great viewport height (imagine a headless browser with a window height of 2000px; scrolling may not have an effect here as all content is already within the viewport) ## Click ### Debugging a click If the click on an element does not work, this is how to find out where the click actually happens. Add a listener for clicks to `document` and log the clicked element and coordinates. This can be done by executing the following JavaScript inside the browser before the test run: ```js document.addEventListener( 'click', (e) => { console.error(document.elementFromPoint(e.clientX, e.clientY).outerHTML); console.error(e.clientX, e.clientY); }, { capture: true } ); ``` So, for example with Selenium (JavaScript bindings), the above snippet needs to be wrapped into `driver.executeScript()`: ```js await driver.executeScript( 'document.addEventListener("click", (e) => {console.error( document.elementFromPoint(e.clientX, e.clientY).outerHTML); console.error(e.clientX, e.clientY)}, {capture: true});' ); ``` Then look into the browser console output to see the result. Either keep the automated browser open and look there or look into the console entries, e.g. via Selenium: ```js await driver.manage().logs().get(logging.Type.BROWSER); ```