Unpoly lets the user restore a previous history entry, usually by pressing the browser's back button.
To restore a history entry, Unpoly goes through the following steps:
<body>
element. You may prefer other targets
by configuring up.history.config.restoreTargets
.Listeners to up:location:restore
may mutate the event.renderOptions
event to customize the render pass that is about to restore content:
up.on('up:location:restore', function(event) {
// Update a different fragment when restoring /special-path
if (event.location === '/special-path') {
event.renderOptions.target = '#other'
}
})
You may also substitute Unpoly's render pass with your own restoration behavior,
by preventing up:location:restore
. This will prevent Unpoly from changing any element.
Your event handler can then restore the page with your own custom code:
up.on('up:location:restore', function(event) {
// Stop Unpoly from rendering anything
event.preventDefault()
// We will render ourselves
document.body.innerText = `Restored content for ${event.location}!`
})
Neither preventing or mutating up:location:restore
will stop the
browser from restoring the URL in the address bar.
Custom restoration code should avoid pushing new history entries.
When a previous history is restored while an overlay is open, all overlays will be closed. The restored URL will be rendered in the root layer.
This behavior may cause overlay content to display as a full pages. In a canonic Unpoly app this is a good default, as Unpoly encourages all server routes to be prepared to render full HTML pages. In particular subinteractions make it easy to implement interactions that work both on the root layer, and in an overlay.
If you absolutely cannot work with the way Unpoly restores history with overlays, you have the following options:
up.layer.config.overlay.history = false
.