From 6701c1995622b9665c92d8429523782170ca40b7 Mon Sep 17 00:00:00 2001
From: Matt Mo <matt@montoyatech.com>
Date: Thu, 11 Nov 2021 11:43:10 -0800
Subject: [PATCH] Added a managed pop state listener to the route extension so
 that back events are handled correctly.

---
 ignite-html-router.js | 25 ++++++++++++++++++-------
 1 file changed, 18 insertions(+), 7 deletions(-)

diff --git a/ignite-html-router.js b/ignite-html-router.js
index 9b81b76..190072a 100644
--- a/ignite-html-router.js
+++ b/ignite-html-router.js
@@ -55,16 +55,22 @@ IgniteTemplate.prototype.route = function(routes, showCallback = null, hideCallb
         }
     };
 
-    //Create a managed callback
-    var managed = new IgniteCallback(update, () => {
-        window.removeEventListener("pushstate", managed.callback);
+    //Create a managed push & pop callback
+    var managedPush = new IgniteCallback(update, () => {
+        window.removeEventListener("pushstate", managedPush.callback);
     });
 
-    //Register our callback to the route event.
-    window.addEventListener("pushstate", managed.callback);
+    var managedPop = new IgniteCallback(update, () => {
+        window.removeEventListener("popstate", managedPop.callback);
+    });
 
-    //Add the managed callback to our template so that upon deconstruction our callback is destroyed correctly.
-    this._callbacks.push(managed);
+    //Register our push & pop callbacks.
+    window.addEventListener("pushstate", managedPush.callback);
+    window.addEventListener("popstate", managedPop.callback);
+
+    //Add the managed callbacks to our template so that upon deconstruction our callback is destroyed correctly.
+    this._callbacks.push(managedPush);
+    this._callbacks.push(managedPop);
 
     //Create a constructor callback that will update the state upon first load.
     this._constructors.push(update);
@@ -294,6 +300,11 @@ class Router {
             Router.states.pop(); //Pop the current state.
             Router.navigate(Router.states.pop(), null, refresh); //Navigate to the previous state.
         } else {
+            //Pop the current state, otherwise it can be used to go back but we don't want that.
+            if (Router.states.length > 0) {
+                Router.states.pop();
+            }
+
             if (fallback) {
                 Router.navigate(fallback, null, refresh);
             } else {