Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
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
fix(web): invalidate position on ancestor scroll #472
fix(web): invalidate position on ancestor scroll #472
Changes from 1 commit
83d21dd
986f4a5
File filter
Filter by extension
Conversations
Jump to
There are no files selected for viewing
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@motiz88 you should probably subscribe to resize events the react-native way:
https://necolas.github.io/react-native-web/docs/use-window-dimensions/
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@jspizziri
resize
event was pre-existing and I had no intention of changing it as part of this bugfix. I merely renamedonResize
toinvalidateContainerPosition
to better communicate what it does (and reuse it in theonScroll
handler).useWindowDimensions
(which would tie us to the React component lifecycle in a way that might not be the most correct/efficient for this use case)There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
If there's no way to do this in a more react-native idiomatic way, my opinion would be to do something like the following at the top of the file:
That would reduce the overall number of
@ts-ignore
comments in the code, which aren't ideal.Perhaps it would be even better to create a unique hook (e.g.
useOnDocumentScroll
that receives a callback or something), that abstracts this functionality.There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think the
@ts-ignore
issue (which, again, is pre-existing here) would be best solved by configuring TypeScript to properly typecheck uses of DOM APIs in.web.tsx
files. This might be solved by adding/// <reference lib="dom" />
to the top of the file, but I haven't tried it.There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@jspizziri I've put up #475 to deal with the
@ts-ignore
s comprehensively.