Skip to content

fix(useUrlSearchParams): restore proper history and navigation behavior #4969

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Open
wants to merge 5 commits into
base: main
Choose a base branch
from
Open

fix(useUrlSearchParams): restore proper history and navigation behavior #4969

wants to merge 5 commits into from
+139 −10

Conversation

yosong-github
Copy link

@yosong-github yosong-github commented Aug 15, 2025 •
edited
Loading

fix #4968 browser's history recording and navigation functions

Before submitting the PR, please make sure you do the following

  • Read the Contributing Guidelines.
  • Read the Pull Request Guidelines.
  • Check that there isn't already a PR that solves the problem the same way to avoid creating a duplicate.
  • Provide a description in this PR that addresses what the PR is solving, or reference the issue that it solves (e.g. fixes #123).
  • Ideally, include relevant tests that fail without this PR but pass with it.
⚠️ Slowing down new functions

Warning: Slowing down new functions

As the VueUse audience continues to grow, we have been inundated with an overwhelming number of feature requests and pull requests. As a result, maintaining the project has become increasingly challenging and has stretched our capacity to its limits. As such, in the near future, we may need to slow down our acceptance of new features and prioritize the stability and quality of existing functions. Please note that new features for VueUse may not be accepted at this time. If you have any new ideas, we suggest that you first incorporate them into your own codebase, iterate on them to suit your needs, and assess their generalizability. If you strongly believe that your ideas are beneficial to the community, you may submit a pull request along with your use cases, and we would be happy to review and discuss them. Thank you for your understanding.

Description

fix #4968

Additional context

@yosong-github
fix(useUrlSearchParams): Fixing useUrlSearchParams has disrupted the …
3a3747b 
…browser's history recording and navigation functions
@dosubot dosubot bot added the size:S This PR changes 10-29 lines, ignoring generated files. label Aug 15, 2025
@yosong-github yosong-github changed the title fix(useUrlSearchParams): Fixing useUrlSearchParams has disrupted the browser's history recording and navigation functions fix(useUrlSearchParams): Fixing useUrlSearchParams has disrupted the browser's history recording and navigation functions Aug 15, 2025
@keeplearning66
Copy link
Contributor

keeplearning66 commented Aug 15, 2025 •
edited
Loading

Hello, I am also trying to handle this issue today. I followed the steps below for debugging.

In the example of the issue:

  1. Enter some values one by one in the input box.
  2. Click the Back button.
image

I found that state would be reset once and then become the correct value. The callback in pausableWatch is also executed as a result.This reset phenomenon confused me. I tried to prevent the reset, but all attempts failed.May I ask if you've encountered the same problem?

@pkg-pr-new pkg.pr.new
Copy link

pkg-pr-new bot commented Aug 15, 2025 •
edited
Loading

Open in StackBlitz

@vueuse/components

npm i https://pkg.pr.new/@vueuse/components@4969

@vueuse/core

npm i https://pkg.pr.new/@vueuse/core@4969

@vueuse/electron

npm i https://pkg.pr.new/@vueuse/electron@4969

@vueuse/firebase

npm i https://pkg.pr.new/@vueuse/firebase@4969

@vueuse/integrations

npm i https://pkg.pr.new/@vueuse/integrations@4969

@vueuse/math

npm i https://pkg.pr.new/@vueuse/math@4969

@vueuse/metadata

npm i https://pkg.pr.new/@vueuse/metadata@4969

@vueuse/nuxt

npm i https://pkg.pr.new/@vueuse/nuxt@4969

@vueuse/router

npm i https://pkg.pr.new/@vueuse/router@4969

@vueuse/rxjs

npm i https://pkg.pr.new/@vueuse/rxjs@4969

@vueuse/shared

npm i https://pkg.pr.new/@vueuse/shared@4969

commit: 4822a87

@ilyaliao
Copy link
Member

Thank you for your PR. Can you add some tests for this feature to prevent future regressions?

@dosubot dosubot bot added size:M This PR changes 30-99 lines, ignoring generated files. and removed size:S This PR changes 10-29 lines, ignoring generated files. labels Aug 15, 2025
@yosong-github
Copy link
Author

Thank you for your PR. Can you add some tests for this feature to prevent future regressions?

No problem. I have already added the unit tests.

@ilyaliao
Copy link
Member

I noticed that the test you added would still pass even without your fix. This means the test might not be covering the actual bug.

Could you double-check the test logic and make sure it would fail without your patch?

@dosubot dosubot bot added size:L This PR changes 100-499 lines, ignoring generated files. and removed size:M This PR changes 30-99 lines, ignoring generated files. labels Aug 19, 2025
@yosong-github
Copy link
Author

I noticed that the test you added would still pass even without your fix. This means the test might not be covering the actual bug.

Could you double-check the test logic and make sure it would fail without your patch?

I revised the unit tests to ensure that without my patch, the program would fail the tests.

@OrbisK OrbisK changed the title fix(useUrlSearchParams): Fixing useUrlSearchParams has disrupted the browser's history recording and navigation functions fix(useUrlSearchParams): Fixing useUrlSearchParams has disrupted the browser's history recording and navigation functions Aug 19, 2025
@OrbisK OrbisK changed the title fix(useUrlSearchParams): Fixing useUrlSearchParams has disrupted the browser's history recording and navigation functions fix(useUrlSearchParams): restore proper history and navigation behavior Aug 19, 2025
@dosubot dosubot bot added the lgtm This PR has been approved by a maintainer label Aug 20, 2025
ilyaliao
ilyaliao reviewed Aug 20, 2025
View reviewed changes
packages/core/useUrlSearchParams/index.test.ts
Comment on lines +286 to +287

it('when the user presses the forward or backward button of the browser, the parameters should be updated', async () => {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should we add issue numbers here like Vue or Nuxt do? Maybe it would make it easier to understand the purpose of this test case.

/cc @OrbisK @43081j wdyt?

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

personally i prefer having well written test descriptions rather than deferring to an issue

often issue-driven tests can be far too specific imo too

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@43081j 43081j 43081j left review comments

@ilyaliao ilyaliao ilyaliao approved these changes

Assignees
No one assigned
Labels
lgtm This PR has been approved by a maintainer size:L This PR changes 100-499 lines, ignoring generated files.
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

BUG | useUrlSearchParams | writeMode: 'push' breaks browser history navigation
4 participants
@yosong-github @keeplearning66 @ilyaliao @43081j