fix: update scroll position after the new page is visible

TylerBarnes · Mar 27, 2019 · 36e5000 · 36e5000
1 parent 6fc3af5
commit 36e5000
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 1 deletion.
diff --git a/src/components/TransitionHandler.js b/src/components/TransitionHandler.js
@@ -64,6 +64,7 @@ export default class TransitionHandler extends Component {
                             pathname,
                             updateContext,
                             triggerResolve,
+                            appearAfter: getMs(appearAfter),
                             e
                           })
                         }

diff --git a/src/functions/onEnter.js b/src/functions/onEnter.js
@@ -1,3 +1,5 @@
+import { setTimeout } from "requestanimationframe-timer";
+
 const onEnter = ({
   node,
   inTransition,
@@ -6,10 +8,14 @@ const onEnter = ({
   exitProps,
   triggerResolve,
   pathname,
+  entryProps: { delay = 0 },
+  appearAfter = 0,
   e
 }) => {
   if (inTransition) {
-    window.scrollTo(0, 0);
+    setTimeout(() => {
+      window.scrollTo(0, 0);
+    }, appearAfter);
   } else {
     const storageKey = `@@scroll|${pathname}`;
     const savedPosition = sessionStorage.getItem(storageKey);
@@ -20,8 +26,15 @@ const onEnter = ({
 
   const { trigger: removed, ...entryPropsTrimmed } = entryProps;
 
+  const timeout = appearAfter + delay;
+
+  const visiblePromise = new Promise(resolve => {
+    setTimeout(() => resolve(), timeout);
+  });
+
   triggerResolve.entry({
     ...entryPropsTrimmed,
+    visible: visiblePromise,
     node
   });