mirror of
https://github.com/hoppscotch/hoppscotch.git
synced 2026-04-25 16:55:59 +03:00
[GH-ISSUE #2227] [feature]: Syncing query parameters in URL and query parameter input #764
Labels
No labels
CodeDay
a11y
browser limited
bug
bug fix
cli
core
critical
design
desktop
discussion
docker
documentation
duplicate
enterprise
feature
feature
fosshack
future
good first issue
hacktoberfest
help wanted
i18n
invalid
major
minor
need information
need testing
not applicable to hoppscotch
not reproducible
pull-request
question
refactor
resolved
sandbox
self-host
spam
stale
testmu
wip
wont fix
No milestone
No project
No assignees
1 participant
Notifications
Due date
No due date set.
Dependencies
No dependencies set.
Reference
starred/hoppscotch#764
Loading…
Add table
Add a link
Reference in a new issue
No description provided.
Delete branch "%!s()"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
Originally created by @FidalMathew on GitHub (Apr 2, 2022).
Original GitHub issue: https://github.com/hoppscotch/hoppscotch/issues/2227
Is there an existing issue for this?
Summary
When we add query parameters in the query parameters input, it does not show any change in URL and visa versa.
Case 1:

Parameters in URL but not in Query Parameters:
Case 2:

Key-value pair in Query Parameter but not in URL:
New feature:

Why should this be worked on?
Syncing the URL and query parameters will help the developer to get a clear understanding of how query parameters work. Moreover, it helps identify all query parameters being used in a single glance.
@AndrewBastin commented on GitHub (Apr 2, 2022):
This is a design decision we chose to take. We have seen that for long parameter chains, the effect of the parameters being on the URL is detrimental to the readability of the URL compared to the separated parameters.
We will keep the issue for a while to poll opinions on whether we have to rollback though.
@KartikSoneji commented on GitHub (Jul 8, 2022):
Allowing parameters to be defined in two places (url and the parameters tab) is both inconsistent and can lead to unexpected and hard to find bugs, especially in urls with many parameters.
Maybe there can be a button to toggle between the expanded and unexpanded url?
Case in point:

As a side note, maybe duplicate parameters can have a visual indicator (and a warning) to show they are duplicates?
Not all framworks support repeated query parameters, some only read the first or last value while others require the name be suffixed by
[](eg:a[]=0&a[]=1).@AndrewBastin commented on GitHub (Jul 13, 2022):
A button to move things back and forth of the variable from URLs is something we can consider as a compromise.
But we are still going to keep this behaviour of having parameters in both the places independently to keep the URL area more cleaner.
The visual indicator idea won't work and you have provided the reason yourself why not yourself, it is not explicitly disallowed by the spec (See: https://stackoverflow.com/a/24728298). Hence we cannot add an indicator.
Keeping this open for review/reconsideration for later.
@KartikSoneji commented on GitHub (Jul 13, 2022):
Sorry I didn't get this.
Adding url parameters in both places is confusing.
How is that better than having a toggle?
We can add an indicator with a tooltip to warn users, just so they know the potential issues.
It won't prevent users from making the request.
@AndrewBastin commented on GitHub (Jul 14, 2022):
As I said, I am looking to a compromise where we will be adding a separate section to the Parameters list that shows the things inferred from the URL (Similar to how we have inferred headers in the Headers section), along with that we can add an option to move the parameter to and from the URL or the parameter list.
The main idea behind that isolation of Parameters to a separate section is to keep the URL area clean, although a toggle can allow the other part to be hidden, it is not a fully complete solution, for example, certain query parameters are pretty constant and have a quality of being like a part of the URL itself. Those are better to be in the URL. Parameters section is more meant for things that can change frequently or have a need to be isolated as a value that can be modified.
Now as to how confusing that is, I don't really think so. One thing to note is, this issue has been open for a while now and there has been no echos for support for this to be implemented in the app. It is an isolated concern that you are having. Along with that other alternatives (for example, Insomnia), also keep the same behavior where they don't sync up like that.
So there is already a precedent that has been set.
Again, the spec doesn't disallow it. Hence we are not going to add any sort of warning there. We have even instances where there are APIs that work against the HTTP spec (like the Elasticsearch REST API). We do not want to create extra noise in the UI just for some warnings.
Our plan with warnings is only for cases where we can't technically make the request according to the user's will. For example like with the aforementioned Elasticsearch REST API, which want the GET request to have a request body (completely against the HTTP spec). We want to implement a warning there because it is against the spec and we cannot actually send a body from the browser for a GET request anyways.
@jtleathers commented on GitHub (May 17, 2023):
Clearly I am in the minority here based on the lack for responses but I tried switching from Postman to Hoppscotch and the implementation of parameters here is a deal breaker for me.
To me, the purpose of the parameter fields is as an interface to build the URL. Unfortunately, Hoppscotch doesn't display this final result anywhere easy to access. You can find the URL in "Show code" mixed in with other code or the "Headers" tab, though even there it is not always accurate I've found.
If Hoppscotch implements some toggle to be able to show/hide the URL with all parameters I would gladly switch over to using it.
@me-nkr commented on GitHub (Jun 10, 2023):
Although, Insomnia has a URL preview that shows a URL with all the query parameters.
@duerrm commented on GitHub (Jul 27, 2023):
Same for me. Would be very happy about a configuration option to en-/disable the parameter sync.
@MaRmARk0 commented on GitHub (Dec 12, 2023):
@duerrm you're not a minority. This is dealbreaker for me also. I'm a developer designing an API and for example now I tried to switch from Insomnia to HoppScotch, but the lack of conversion from Parameters tab into query-string is kinda weird. It's simple to do and e.g. I cannot simply copy full GET URL with 11 parameters nor can I see it anywhere. If there was some Request log or at least something where I could see full constructed GET URL with all the params... ach.
Yes I can open developer tools (F12) and copy it from there but c-mon guys, can't you just add some
URL Previewbutton which will show fully constructed URL just for sake of copy-pasting it?@liyasthomas commented on GitHub (Dec 12, 2023):
Hoppscotch can send URL query parameters to the Parameters section by selecting the URL text. Does this work for you?
screenity copy.webm
Also to view the URL preview, there's another feature that allows you to preview the entire request setup.
Does this help you?
screenity.webm
@MaRmARk0 commented on GitHub (Dec 12, 2023):
Sorry @liyasthomas those images weren't probably uploaded correctly.
I need to preview URL including query parameters so I can copy&paste it e.g. into Slack or wherever
https://i.imgur.com/97h6uGm.png
@liyasthomas commented on GitHub (Dec 12, 2023):
I've reuploaded the assets. Can you check @MaRmARk0?
@MaRmARk0 commented on GitHub (Dec 12, 2023):
Oh, this should be documented more. I'd never imagine Show code would show something like this. To be honest it was the only submenu item I did not click on.
This should do the work. Thanks :)
@liyasthomas commented on GitHub (Dec 12, 2023):
Sorry for making it difficult to discover this feature. We will improve the design to be more intuitive going forward.
Meanwhile, I've added the feature to the documentation: Snippets
@chimit commented on GitHub (Apr 11, 2024):
Absolutely agree with @jtleathers. It's very hard to keep track of currently active GET parameters. The only way is to check green checkboxes. When you have dozens of params you can't even see all of them without scrolling.
@maxgalbu commented on GitHub (Jun 12, 2024):
@jtleathers add me to the minority who agrees with you
@oonil commented on GitHub (Jan 23, 2025):
@jtleathers
same having :paramName is good way to directly add in parameter list instead of changing url for every request.
@ozzyrys commented on GitHub (Mar 4, 2025):
I know this topic is quite old but still relevant years later. My company and I were looking to migrate from Postman but lack of this feature is a deal breaker and now we have to look elsewhere.
We need to see query params in, you know, query. It's a very simple use case: I need to see query params, request body and response body all at once. Switching between tabs just to see my request in full is just a no go.
@liyasthomas commented on GitHub (Mar 4, 2025):
@ozzyrys you can make use of the HTTP 1.1 Request String format mode from code generation to visualize the current active request setup at once.
@iscle commented on GitHub (Jun 6, 2025):
I just arrived here thinking this was a bug (coming from Postman) but I see this is the expected behavior.
As other people say, this is very confusing, especially for those coming from Postman.
I don't see the reason to not have the url box show the query parameters too. They are part of the URL spec, so not having it shown in there would be considered an error in my book.
Also, if some query parameter is too long does not matter, since they are always at the end of the url anyway. The beginning of the url would be shown either way.
If both the url box and the parameter tab are synced, it would be less confusing and better for ANY users to check what actual parameters are being sent, without having to scroll the url manually in case they, for example, copy pasted a url with the query parameters already there (something I do often). It would also be easier to see if a parameter is duplicated (which can happen during development) or has a typo, etc.
This is breaking the SST principle...
@gopi-ar commented on GitHub (Sep 5, 2025):
That workaround helps, but it doesn't solve the main issue. Our team wants to switch to Hoppscotch but can't because copying GET requests from browsers is such a pain..
Right now, to get a complete URL with params, we have to:
Compare that to any browser where you just copy the URL field. It's the difference between 1 step and 4 steps for something developers do constantly.
@liyasthomas would you be open to a PR that syncs the URL field with the params section? This would make adoption so much easier for teams that frequently work with parameterized URLs.
@21307369 commented on GitHub (Dec 2, 2025):
@ozzyrys
Some of the parameters of my request scripts, such as the order number timestamp, signature, etc., cannot be displayed here. My script is as follows:
My suggestion is to add a button to copy the request link to the picture


or add a new panel.
Or refer to
@OnlyTL commented on GitHub (Dec 22, 2025):
I think this feature is actually quite necessary.
For users migrating from tools like Postman, the lack of synchronization between query parameters in the URL and the Params table is very unintuitive and can be frustrating. Copy-pasting a full URL with query parameters is a very common workflow, and having to manually re-enter them breaks that flow.
I understand that the current proposed solutions may introduce complexity or edge cases, but instead of completely avoiding this behavior, would it be possible to provide an optional setting / toggle to enable URL ↔ Params synchronization?
This would keep the default behavior simple for existing users, while offering a more familiar experience for those coming from Postman or similar tools.
Even a one-way sync (URL → Params on paste) would already be a big improvement.
@liyasthomas commented on GitHub (Dec 22, 2025):
As I've added in https://github.com/hoppscotch/hoppscotch/issues/2227#issuecomment-1851957220, you can send the inline URL parameters list to the Params section by selecting the URL > Add to parameters.
Step 1: Select URL:
Step 2: Click "Add to parameters"
@lenovin commented on GitHub (Jan 21, 2026):
Atleast provide an option for the users to toggle between as a feature than removing the feature completely...
@Cas-Vandendriessche commented on GitHub (Feb 25, 2026):
I recently switched from Postman to Hoppscotch and I’m definitely missing this feature