Routable tabs not pushing state correctly

I’m using routable tabs (React) but for some reason they are not pushing state correctly to the browser.

I can see the hash change but browser doesn’t add it to its history and hashchange event doesn’t trigger.

Here’s the code:

{
  path: "/home/",
  component: HomePage,
  tabs: [
  // First (default) tab has the same url as the page itself
  {
    path: "/",
    id: "feed-tab",
    async(routeTo, routeFrom, resolve, reject) {
      ensureAuth.apply(this, [Feed, ...arguments])
    },
  },
  {
    path: "/searches/",
    id: "searches-tab",
    async(routeTo, routeFrom, resolve, reject) {
      ensureAuth.apply(this, [Searches, ...arguments])
    },
  },
  {
    path: "/settings/",
    id: "settings-tab",
    async(routeTo, routeFrom, resolve, reject) {
      ensureAuth.apply(this, [Settings, ...arguments])
    },
  },
],

},

ensureAuth is just a change that loads login if user is not authenticated.

Any ideas what to try to get this to work? Hashchange event not loading is messing up analytics quite nicely :roll_eyes:

1 Like

I was able to partly fix this by using Router’srouteChanged event but I would still like to have consistent back button functionality in Android.

Bad implementation, see docs bro. Need tab template

What are you talking about?