Skip to content

Commit 42530e1

Browse files
committed
fix(platform): Avoid IntersectionObserver issues
We have a lot of issues like this: https://sentry.sentry.io/issues/5543047544/?project=1267915 TBH not sure how that happens, but I guess we can try to be defensive here. Maybe inner height is missing somehow?
1 parent c102680 commit 42530e1

File tree

1 file changed

+5
-4
lines changed
  • src/components/sidebarTableOfContents

1 file changed

+5
-4
lines changed

src/components/sidebarTableOfContents/index.tsx

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -157,16 +157,17 @@ export function SidebarTableOfContents() {
157157

158158
// Mark the active item based on the scroll position
159159
useEffect(() => {
160-
if (!tocItems.length) {
160+
const innerHeight = window.innerHeight;
161+
if (!tocItems.length || !innerHeight) {
161162
return () => {};
162163
}
163164
// account for the header height
164165
const rootMarginTop = 100;
165166
// element is consiered in view if it is in the top 1/3 of the screen
166-
const rootMarginBottomRaw = (2 / 3) * window.innerHeight - rootMarginTop;
167-
const rootMarginBottom = Math.floor(rootMarginBottomRaw);
167+
const rootMarginBottomRaw = (2 / 3) * innerHeight - rootMarginTop;
168+
const rootMarginBottom = Math.floor(rootMarginBottomRaw) * -1;
168169
const observerOptions = {
169-
rootMargin: `${rootMarginTop}px 0px -${rootMarginBottom}px 0px`,
170+
rootMargin: `${rootMarginTop}px 0px ${rootMarginBottom}px 0px`,
170171
threshold: 1,
171172
};
172173
const observer = new IntersectionObserver(entries => {

0 commit comments

Comments
 (0)