navigation-stack 0.4.0 → 0.5.1

package/test/session/InMemorySession.test.js

@@ -13,7 +13,7 @@ describe('InMemorySession', () => {
     session.start(parseInputLocation('/initial?bar=baz#qux'));
 
     expect(location).to.deep.include({
-      operation: 'INIT',
+      operation: 'init',
       pathname: '/initial',
       search: '?bar=baz',
       query: {
@@ -42,21 +42,21 @@ describe('InMemorySession', () => {
 
     expect(listener).to.have.been.calledOnce();
     expect(listener.firstCall.args[0]).to.deep.include({
-      operation: 'INIT',
+      operation: 'init',
       pathname: '/initial',
       index: 0,
       delta: 0,
     });
     listener.resetHistory();
 
-    session.navigate('PUSH', {
+    session.navigate('push', {
       pathname: '/new',
     });
 
     const newLocation = location;
 
     expect(newLocation).to.deep.include({
-      operation: 'PUSH',
+      operation: 'push',
       pathname: '/new',
       index: 1,
       delta: 1,
@@ -65,17 +65,17 @@ describe('InMemorySession', () => {
 
     expect(listener).to.have.been.calledOnce();
     expect(listener.firstCall.args[0]).to.deep.include({
-      operation: 'PUSH',
+      operation: 'push',
       pathname: '/new',
       index: 1,
       delta: 1,
     });
     listener.resetHistory();
 
-    session.navigate('PUSH', { pathname: '/new-2' });
+    session.navigate('push', { pathname: '/new-2' });
 
     expect(location).to.include({
-      operation: 'PUSH',
+      operation: 'push',
       pathname: '/new-2',
       index: 2,
       delta: 1,
@@ -83,17 +83,17 @@ describe('InMemorySession', () => {
 
     expect(listener).to.have.been.calledOnce();
     expect(listener.firstCall.args[0]).to.deep.include({
-      operation: 'PUSH',
+      operation: 'push',
       pathname: '/new-2',
       index: 2,
       delta: 1,
     });
     listener.resetHistory();
 
-    session.navigate('REPLACE', { pathname: '/new-3' });
+    session.navigate('replace', { pathname: '/new-3' });
 
     expect(location).to.include({
-      operation: 'REPLACE',
+      operation: 'replace',
       pathname: '/new-3',
       index: 2,
       delta: 0,
@@ -101,7 +101,7 @@ describe('InMemorySession', () => {
 
     expect(listener).to.have.been.calledOnce();
     expect(listener.firstCall.args[0]).to.deep.include({
-      operation: 'REPLACE',
+      operation: 'replace',
       pathname: '/new-3',
       index: 2,
       delta: 0,
@@ -112,7 +112,7 @@ describe('InMemorySession', () => {
 
     expect(listener).to.have.been.calledOnce();
     expect(listener.firstCall.args[0]).to.deep.include({
-      operation: 'SHIFT',
+      operation: 'shift',
       pathname: '/new',
       key: newLocation.key,
       index: 1,
@@ -126,8 +126,8 @@ describe('InMemorySession', () => {
   it('should support subscribing and unsubscribing', () => {
     const session = new InMemorySession();
     session.start(parseInputLocation('/initial'));
-    session.navigate('PUSH', { pathname: '/new' });
-    session.navigate('PUSH', { pathname: '/new-2' });
+    session.navigate('push', { pathname: '/new' });
+    session.navigate('push', { pathname: '/new-2' });
 
     const listener = sinon.spy();
     const unsubscribe = session.subscribe(listener);
@@ -136,7 +136,7 @@ describe('InMemorySession', () => {
 
     expect(listener).to.have.been.calledOnce();
     expect(listener.firstCall.args[0]).to.include({
-      operation: 'SHIFT',
+      operation: 'shift',
       pathname: '/new',
     });
     listener.resetHistory();
@@ -153,8 +153,8 @@ describe('InMemorySession', () => {
   it('should respect stack bounds', () => {
     const session = new InMemorySession();
     session.start(parseInputLocation('/initial'));
-    session.navigate('PUSH', { pathname: '/new' });
-    session.navigate('PUSH', { pathname: '/new-2' });
+    session.navigate('push', { pathname: '/new' });
+    session.navigate('push', { pathname: '/new-2' });
 
     const listener = sinon.spy();
     session.subscribe(listener);
@@ -169,7 +169,7 @@ describe('InMemorySession', () => {
 
     expect(listener).to.have.been.calledOnce();
     expect(listener.firstCall.args[0]).to.include({
-      operation: 'SHIFT',
+      operation: 'shift',
       pathname: '/initial',
       delta: -2,
     });
@@ -189,7 +189,7 @@ describe('InMemorySession', () => {
 
     expect(listener).to.have.been.calledOnce();
     expect(listener.firstCall.args[0]).to.include({
-      operation: 'SHIFT',
+      operation: 'shift',
       pathname: '/new-2',
       delta: 2,
     });
@@ -207,10 +207,10 @@ describe('InMemorySession', () => {
   it('should not reset forward entries on replace', () => {
     const session = new InMemorySession();
     session.start(parseInputLocation('/initial'));
-    session.navigate('PUSH', { pathname: '/new' });
-    session.navigate('PUSH', { pathname: '/new-2' });
+    session.navigate('push', { pathname: '/new' });
+    session.navigate('push', { pathname: '/new-2' });
     session.shift(-2);
-    session.navigate('REPLACE', { pathname: '/new-3' });
+    session.navigate('replace', { pathname: '/new-3' });
 
     const listener = sinon.spy();
     session.subscribe(listener);
@@ -219,7 +219,7 @@ describe('InMemorySession', () => {
 
     expect(listener).to.have.been.calledOnce();
     expect(listener.firstCall.args[0]).to.include({
-      operation: 'SHIFT',
+      operation: 'shift',
       pathname: '/new',
       delta: 1,
     });
@@ -231,10 +231,10 @@ describe('InMemorySession', () => {
     const session = new InMemorySession();
 
     session.start(parseInputLocation('/initial'));
-    session.navigate('PUSH', { pathname: '/new' });
-    session.navigate('PUSH', { pathname: '/new-2' });
+    session.navigate('push', { pathname: '/new' });
+    session.navigate('push', { pathname: '/new-2' });
     session.shift(-2);
-    session.navigate('PUSH', { pathname: '/new-3' });
+    session.navigate('push', { pathname: '/new-3' });
 
     const listener = sinon.spy();
     session.subscribe(listener);
@@ -297,8 +297,8 @@ describe('InMemorySession', () => {
   //       pathname: '/initial',
   //     });
   //
-  //     session1._navigation.navigate('PUSH', { pathname: '/new' });
-  //     session1._navigation.navigate('PUSH', { pathname: '/new-2' });
+  //     session1._navigation.navigate('push', { pathname: '/new' });
+  //     session1._navigation.navigate('push', { pathname: '/new-2' });
   //     session1._navigation.shift(-1);
   //
   //     const session2 = new InMemorySession({ save, load });

package/test/session/ServerSession.test.js

@@ -13,7 +13,7 @@ describe('ServerSideRenderSession', () => {
     session.start(parseInputLocation('/foo?bar=baz#qux'));
 
     expect(location).to.deep.include({
-      operation: 'INIT',
+      operation: 'init',
       pathname: '/foo',
       search: '?bar=baz',
       query: {

package/test/session/WebBrowserSession.test.js

@@ -62,7 +62,7 @@ describe('WebBrowserSession', () => {
     session.start(parseInputLocation(window.location));
 
     expect(location).to.deep.include({
-      operation: 'INIT',
+      operation: 'init',
       pathname: '/initial',
       search: '?bar=baz',
       query: {
@@ -78,7 +78,7 @@ describe('WebBrowserSession', () => {
     session = new WebBrowserSession();
 
     expect(() =>
-      session.navigate('PUSH', {
+      session.navigate('push', {
         pathname: '/new',
         search: '?search',
         hash: '#hash',
@@ -103,14 +103,14 @@ describe('WebBrowserSession', () => {
 
     expect(listener).to.have.been.calledOnce();
     expect(listener.firstCall.args[0]).to.deep.include({
-      operation: 'INIT',
+      operation: 'init',
       pathname: '/initial',
       index: 0,
       delta: 0,
     });
     listener.resetHistory();
 
-    session.navigate('PUSH', {
+    session.navigate('push', {
       pathname: '/new',
       search: '?search',
       hash: '#hash',
@@ -124,7 +124,7 @@ describe('WebBrowserSession', () => {
       hash: '#hash',
     });
     expect(newLocation).to.deep.include({
-      operation: 'PUSH',
+      operation: 'push',
       pathname: '/new',
       search: '?search',
       hash: '#hash',
@@ -135,21 +135,21 @@ describe('WebBrowserSession', () => {
 
     expect(listener).to.have.been.calledOnce();
     expect(listener.firstCall.args[0]).to.deep.include({
-      operation: 'PUSH',
+      operation: 'push',
       pathname: '/new',
       index: 1,
       delta: 1,
     });
     listener.resetHistory();
 
-    session.navigate('PUSH', {
+    session.navigate('push', {
       pathname: '/new-2',
       search: '',
       hash: '',
     });
 
     expect(location).to.include({
-      operation: 'PUSH',
+      operation: 'push',
       pathname: '/new-2',
       index: 2,
       delta: 1,
@@ -157,7 +157,7 @@ describe('WebBrowserSession', () => {
 
     expect(listener).to.have.been.calledOnce();
     expect(listener.firstCall.args[0]).to.deep.include({
-      operation: 'PUSH',
+      operation: 'push',
       pathname: '/new-2',
       index: 2,
       delta: 1,
@@ -166,14 +166,14 @@ describe('WebBrowserSession', () => {
 
     expect(window.location.pathname).to.equal('/new-2');
 
-    session.navigate('REPLACE', {
+    session.navigate('replace', {
       pathname: '/new-3',
       search: '',
       hash: '',
     });
 
     expect(location).to.include({
-      operation: 'REPLACE',
+      operation: 'replace',
       pathname: '/new-3',
       index: 2,
       delta: 0,
@@ -184,7 +184,7 @@ describe('WebBrowserSession', () => {
 
     expect(listener).to.have.been.calledOnce();
     expect(listener.firstCall.args[0]).to.deep.include({
-      operation: 'REPLACE',
+      operation: 'replace',
       pathname: '/new-3',
       index: 2,
       delta: 0,
@@ -202,7 +202,7 @@ describe('WebBrowserSession', () => {
 
     expect(listener).to.have.been.calledOnce();
     expect(listener.firstCall.args[0]).to.deep.include({
-      operation: 'SHIFT',
+      operation: 'shift',
       pathname: '/new',
       search: '?search',
       hash: '#hash',
@@ -219,7 +219,7 @@ describe('WebBrowserSession', () => {
 
     expect(listener).to.have.been.calledOnce();
     expect(listener.firstCall.args[0]).to.deep.include({
-      operation: 'SHIFT',
+      operation: 'shift',
       pathname: '/initial',
       index: 0,
       delta: -1,
@@ -231,12 +231,12 @@ describe('WebBrowserSession', () => {
     window.history.replaceState(null, null, '/');
     session = new WebBrowserSession();
     session.start(parseInputLocation(window.location));
-    session.navigate('PUSH', {
+    session.navigate('push', {
       pathname: '/new',
       search: '',
       hash: '',
     });
-    session.navigate('PUSH', {
+    session.navigate('push', {
       pathname: '/new-2',
       search: '',
       hash: '',
@@ -250,7 +250,7 @@ describe('WebBrowserSession', () => {
 
     expect(listener).to.have.been.calledOnce();
     expect(listener.firstCall.args[0]).to.include({
-      operation: 'SHIFT',
+      operation: 'shift',
       pathname: '/new',
     });
     listener.resetHistory();

package/types/index.d.ts

@@ -35,22 +35,23 @@ export interface Location extends LocationBase {
    * a unique key identifying the current history entry
    */
   key: string;
+
+  /**
+   * the current index of the history entry, starting at 0 for the initial
+   * entry; this increments on `.push()` but not on `.replace()`
+   */
+  index: number;
 }
 
-type PushOrReplaceOperation = 'PUSH' | 'REPLACE';
+type PushOrReplaceOperation = 'push' | 'replace';
 
 export interface LocationInternal extends Location {
   /**
    * `navigation-stack` operation.
    */
-  operation: PushOrReplaceOperation | 'SHIFT' | 'INIT';
-  /**
-   * the current index of the history entry, starting at 0 for the initial
-   * entry; this increments on `.push()` but not on `.replace()`
-   */
-  index: number;
+  operation: PushOrReplaceOperation | 'shift' | 'init';
   /**
-   * the difference between the current index and the index of the previous location
+   * the difference between the index of the current location and the index of the previous location.
    */
   delta: number;
 }
@@ -155,7 +156,7 @@ export class NavigationStack<ScrollableContainer = any, Anchor = any> {
 
   shift(delta: number): void;
 
-  locationRendered(): void;
+  locationRendered(): Promise<void>;
 
   stop(): void;
 }

package/types/scroll-position/index.d.ts

@@ -15,21 +15,21 @@ export class ScrollPositionRestoration<
 
     // `_options` are currently only used in tests.
     _options?: {
-      // `_options._shouldUpdatePageScrollPositionForLocation`
+      // `_options._shouldSetPageScrollPositionOnLocationChange`
       // isn't used in real life and is not part of the public API.
       // It's only used in tests.
-      _shouldUpdatePageScrollPositionForLocation?: (
+      _shouldSetPageScrollPositionOnLocationChange?: (
         location: Location,
         prevLocation: Location | undefined,
       ) => boolean;
 
-      // `_options._getPageScrollPositionForLocation`
+      // `_options._getSavedPageScrollPositionOnLocationChange`
       // isn't used in real life and is not part of the public API.
       // It's only used in tests.
-      _getPageScrollPositionForLocation?: (
+      _getSavedPageScrollPositionOnLocationChange?: (
         location: Location,
         prevLocation: Location | undefined,
-      ) => boolean;
+      ) => [number, number] | undefined;
 
       // Using this option, a developer could theoretically provide their own implementation
       // of setting a scroll position. For example, it could use "smooth" (animated) scrolling, etc.
@@ -47,21 +47,21 @@ export class ScrollPositionRestoration<
 
     // `_options` are currently only used in tests.
     _options?: {
-      // `_options._shouldUpdateScrollPositionForLocation`
+      // `_options._shouldSetScrollPositionOnLocationChange`
       // isn't used in real life and is not part of the public API.
       // It's only used in tests.
-      _shouldUpdateScrollPositionForLocation?: (
+      _shouldSetScrollPositionOnLocationChange?: (
         location: Location,
         prevLocation: Location | undefined,
       ) => boolean;
 
-      // `_options._getScrollPositionForLocation`
+      // `_options._getSavedScrollPositionOnLocationChange`
       // isn't used in real life and is not part of the public API.
       // It's only used in tests.
-      _getScrollPositionForLocation?: (
+      _getSavedScrollPositionOnLocationChange?: (
         location: Location,
         prevLocation: Location | undefined,
-      ) => boolean;
+      ) => [number, number] | undefined;
 
       // Using this option, a developer could theoretically provide their own implementation
       // of setting a scroll position. For example, it could use "smooth" (animated) scrolling, etc.
@@ -70,7 +70,7 @@ export class ScrollPositionRestoration<
     },
   ): () => void;
 
-  locationRendered: (location: Location) => void;
+  locationRendered: (location: Location) => Promise<void>;
 
   stop(): void;
 

package/test/scroll-position/withScrollableContainerAtIndexPage.js

@@ -1,62 +0,0 @@
-// Adds a 100x100 scrollable container on the website.
-//
-// * When the current location is "/", it renders a large amount of content
-//   (20000x20000 to be specific) inside the container, making it scrollable.
-//
-// * At any other location, it doesn't render anything in the container.
-//
-export default function withScrollableContainerAtIndexPage(app) {
-  const container = document.createElement('div');
-  container.style.height = '100px';
-  container.style.width = '100px';
-  container.style.overflow = 'hidden';
-  document.body.appendChild(container);
-
-  let element;
-  let unregister;
-
-  // This will only be called once, so no need to guard.
-  function listen(listener) {
-    function shouldUpdatePageScrollPositionForLocation(
-      location,
-      prevLocation,
-    ) {
-      // Disable the automatic scroll restoration after a SHIFT, to check the
-      // scroll-on-register behavior.
-      if (prevLocation && location.operation === 'SHIFT') {
-        return false;
-      }
-
-      return true;
-    }
-
-    const unlisten = app.listen((location) => {
-      listener(location);
-
-      if (location.pathname === '/') {
-        element = document.createElement('div');
-        element.style.height = '20000px';
-        element.style.width = '20000px';
-        container.appendChild(element);
-
-        unregister = app.registerScrollableContainer('container', container, {
-          shouldUpdatePageScrollPositionForLocation,
-        });
-      } else {
-        container.removeChild(element);
-        unregister();
-      }
-    });
-
-    return () => {
-      unlisten();
-      document.body.removeChild(container);
-    };
-  }
-
-  return {
-    ...app,
-    container,
-    listen,
-  };
-}