Enter/leave the app (back button issue)

[johnelliott]

My app works server-rendered without javascript.
My app works properly when clicking links within app routes.

const app = choo()
app.route('/view/:image', detail) // <-- page with an image
//         /small/image.jpg <-- static image served by nginx
app.route('/', main) // <-- index page with grid of images

The problem I am having seems to be navigating in and out of the app to other sites or static files:

Steps to reproduce behavior

If I start at the index route /, then navigate via an <a> to another route of the app—/view/image.jpg—then click another <a> link, taking me to a static original file /static/image.jpg that's served from my static server I get unexpected behavior:

Expected behavior

I expect that clicking the back button goes back to /view/image.jpg.

Actual behavior

But actually clicking the back button goes to /.

It seems like my browser history has no knowledge of what happened when I was using Choo, and I'm sure the solution is something simple, but I've really struggled understanding what the intended approach to building apps with Choo is because there aren't many examples out there. I've found out I was doing too much with state/events, and needed to use routes and pages more, and that's taken me to this point.