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

Make window.innerHeight available in getPageInfo() #685

Closed
nuschk opened this issue Mar 25, 2019 · 4 comments
Closed

Make window.innerHeight available in getPageInfo() #685

nuschk opened this issue Mar 25, 2019 · 4 comments

Comments

@nuschk
Copy link
Contributor

nuschk commented Mar 25, 2019

Use case

My iframe contains an Infinite loader (using 'react-visibility-sensor'), which loads list items whenever the user scrolls to the bottom of a list. The iframe adjusts its height according to the number of items already in the list. The iframe doesn't scroll at all, only the parent document does.

Problem

I can't determine the parent's viewport from within the iframe. Using getPageInfo() I can get close, but unfortunately, clientHeight doesn't work, because it's the document's size and the document will be taller than the actual viewport and parts of it may be off-screen. I only want to trigger reload when bottom of the list is visible in the window.

Proposed Solution

Make window.innerHeight and window.innerWidth available in getPageInfo().

@davidjbradshaw
Copy link
Owner

davidjbradshaw commented Mar 25, 2019 via email

@nuschk
Copy link
Contributor Author

nuschk commented Mar 26, 2019

Here's one: #686. Seems simple enough.

I somehow couldn't get the tests to work though. If you could take a look? (Edit: seems to work on CI, but didn't locally...)

Also, documentation is a bit misleading now. window.inner* is essentially the HTML viewport size. Now clientWidth and clientHeight already claim that. Maybe we should describe those more clearly and say what it really is (i.e., the maximum of document and viewport size).

Thanks!

@davidjbradshaw
Copy link
Owner

Maybe the best solution is to also add documentClientHeight and documentClientWidth as well.

Then the current options we can either explain in the docs what it actually does, or just leave it in undocumented for backwards compatibility.

@nuschk
Copy link
Contributor Author

nuschk commented Mar 26, 2019

Ok, I've done that. I renamed them to documentWidth/Height and windowWidth/Height which is less verbose and still very clear. I've also added a deprecation note to the clientWidth/Height.

Tests are now working.

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

2 participants