updating url after get request

[rockwellll]

Hi, so i have this little peice of code

        const selectedPlan = Array.from(document.querySelectorAll("input[type='radio']"))
            .find((el) => el.checked);

        const response = await get(this.urlValue, {
            query: {
                plan: selectedPlan.value
            },
            responseKind: 'turbo-stream'
        });

the response i get is a turbo stream and all works well. However, the browser url is not being updated to the updated one, i was wondering if there is a way to perform this.

I thought perhaps i can add a key to the header in the backend, like this

   response.header['url] = current_url

and in the javascript i can access it like

   response.headers.url 

or i can do it inside the controller like this

        if(response.ok) {
            history.pushState({}, null, this.urlValue);
            Turbo.navigator.history.push(this.urlValue);
        }

and then i can update it

I am currently in the process of migrating a get form to use Request.js calls, anything would be appreciated

[rockwellll]

I guess it was my bad, i had to access

        const response = await get(this.urlValue, {
            query: {
                plan: selectedPlan.value
            },
            responseKind: 'turbo-stream'
        });

        console.log(response.response)

to get the actual response object which contained the url. But, is it possible to make Request.js handle this? I'd love to make a PR for this!

[marcelolx]

@A7madXatab Hi Ahmad, the first thing I would like to know is, why are you migration a get form to use Request.JS? I mean, is there something special that you need to do instead of just submitting the form and return a redirect which the browser will handle automatically.

[rockwellll]

HI @marcelolx, actually no, the thing is today i encountered a weird behaviour in the form

https://user-images.githubusercontent.com/38360603/129346329-be8fcb33-f907-446a-9e3b-5e7c52aa6186.mov

If you can see, when i click the browser back button the url changes but turbo does not replace the page again, when i inspect the network tab when clicking the browser back button no request is made to the backend to refetch the old page

I was wondering why that might happen!. And reading from the forum i got the impression maybe request.js would help, but i reverted back to the get form, the only issue as i said is the one stated above. I think i'd have to post this on the turbo repo

[marcelolx]

@A7madXatab Yeah I think that the ideal would be to post on the turbo repo with an application example that simulates this problem, probably it's a problem related to page caching.

With Request.JS if you only want to redirect after the response, you just need to respond with a redirect from the server and Request.JS will follow the redirect https://github.com/rails/request.js/blob/main/src/fetch_request.js#L129, but it would be much simpler if you could rely on the common get form submission