htmx 4: hx-push-url doesn't update URL after 303 redirect #3594
Description
Hello 👋 - I noticed this change in behaviour between [email protected] and [email protected].
Given:
- an element like
<button hx-post="/redirectme" hx-target="body" hx-push-url="true">Redirect me</button> - and, a server response on
/redirectmethat's a 303 (See Other) redirect to/redirected
I'd expect the URL in my browser's address bar to change to /redirected, however it remains as /redirectme. It doesn't seem to follow the redirect.
I couldn't find any documentation around this change in behaviour on the Changes in htmx 4.0 page so assuming it's a regression.
Here's a minimal repro (run with node, and toggle the four var to switch between htmx 2 and htmx 4 to see the change in behaviour).
const http = require('http')
const four = true
const version = four ? "4.0.0-alpha5" : "2.0.8"
const indexHtml = `<!DOCTYPE html>
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/htmx.org@${version}/dist/htmx.min.js"></script>
</head>
<body>
<button hx-post="/redirectme" hx-target="body" hx-push-url="true">Redirect me</button>
</body>
</html>`
const redirectedHtml = `<!DOCTYPE html>
<html>
<body>
<h1>Redirected! My url should be /redirected</h1>
</body>
</html>`
const server = http.createServer((req, res) => {
const url = req.url
if (url === '/') {
res.writeHead(200, { 'Content-Type': 'text/html' })
res.end(indexHtml)
} else if (url === '/redirectme') {
res.writeHead(303, { 'Location': '/redirected' })
res.end()
} else if (url === '/redirected') {
res.writeHead(200, { 'Content-Type': 'text/html' })
res.end(redirectedHtml)
} else {
res.writeHead(404)
res.end()
}
})
const PORT = 4444
server.listen(PORT, () => {
console.log(`Server running at http://localhost:${PORT}/`)
})From my brief testing, I don't think this is down to a limitation with fetch() as its response object follows the 303 redirect as expected, and contains the right information for the correct URL to be pushed:
const res = await fetch('/redirectme')
res.status // => 200
res.url // 'http://localhost:4444/redirected'Thanks for your work on htmx!