Skip to content
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

getBoundingClientRect() gives different values on test run vs. in browser #2715

Closed
enkelmedia opened this issue Apr 23, 2024 · 1 comment
Closed

Comments

@enkelmedia
Copy link

enkelmedia commented Apr 23, 2024

Hi!
I'm using Web Test Runner and Playwright to execute tests. I'm trying to create a test for a component that will expand some content on click (think of a accordion).

I figured that one way to do this would be to mesure the height before and after the click and assert that it's higher after the click.

I'm using element.getBoundingClientRect().height before and after to get the height but noticed that the value does not change. So I figured something was wrong with my test so I run in watch-mode to open the browser and debug.

Turns out that the values in the browser console is correct, but the values in the test output is not:

image

Notice that the browsers says 50 before and 101 after, while the console output says 50 before and 50 after.

Code basically looks something like this:

console.log('before2',element.getBoundingClientRect().height);

// click on element
await aTimeout(1800);

console.log('after2',element.getBoundingClientRect().height);

Also tried element.offsetHeight and document.body.offsetHeight but none of these are chaning.

Any ideas as to why this is happening?

@enkelmedia
Copy link
Author

I don't know what happened, got up thing morning and figured "I should try this on another computer". Made the test and it suddenly worked.

image

Got back to the same machine where I had the problem yesterday and tried again, also worked. The only thing I can think of that I did was to install a package or two and a restart.

Hopefully this was some kind of temporary thing. Sorry.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant