Skip to content
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.

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

Link component does not resolve a relative URI fragment properly #50832

Closed
1 task done
cdtkrk opened this issue Jun 6, 2023 · 4 comments
Closed
1 task done

Link component does not resolve a relative URI fragment properly #50832

cdtkrk opened this issue Jun 6, 2023 · 4 comments
Labels
area: app App directory (appDir: true) bug Issue was opened via the bug report template.

Comments

@cdtkrk
Copy link

cdtkrk commented Jun 6, 2023

Verify canary release

  • I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
      Platform: darwin
      Arch: arm64
      Version: Darwin Kernel Version 22.3.0: Thu Jan  5 20:49:43 PST 2023; root:xnu-8792.81.2~2/RELEASE_ARM64_T8103
    Binaries:
      Node: 18.15.0
      npm: 9.5.0
      Yarn: N/A
      pnpm: N/A
    Relevant packages:
      next: 13.4.4
      eslint-config-next: 13.4.4
      react: 18.2.0
      react-dom: 18.2.0
      typescript: 5.1.3

Which area(s) of Next.js are affected? (leave empty if unsure)

App directory (appDir: true)

Link to the code that reproduces this issue or a replay of the bug

https://codesandbox.io/p/sandbox/vigilant-https-f3r6c3

To Reproduce

  • Use App Router
  • Create a folder and make a page for example /someDir/page.tsx
  • Add Link component into it, specify href props as #foo

Describe the Bug

If I click <Link> component pointing #foo in the page /someDir, then it navigate to /#foo instead of /someDir#foo. It seems that <Link> component does not resolve path properly.

Pages Router (devtools)

pages-router

App Router (devtools)

app-router

Expected Behavior

I expect that on /someDir page, href #foo should be resolve to /someDir#foo as same as in Pages router.

Which browser are you using? (if relevant)

No response

How are you deploying your application? (if relevant)

No response

@cdtkrk cdtkrk added the bug Issue was opened via the bug report template. label Jun 6, 2023
@github-actions github-actions bot added the area: app App directory (appDir: true) label Jun 6, 2023
@cdtkrk cdtkrk changed the title Link component does not resolve a relative URL properly Link component does not resolve a relative URL fragment properly Jun 6, 2023
@Shub3am
Copy link

Shub3am commented Jun 6, 2023

You have to explicitly define your route paths, also "/someDir#foo" This path seems illogical if you are not using it to navigate to a particular section on the page itself

@cdtkrk
Copy link
Author

cdtkrk commented Jun 6, 2023

@Shub3am I updated my description.

If I click <Link> component pointing #foo in the page /someDir, then it navigate to /#foo instead of /someDir#foo.

In Pages router, it works as expected. I think that it is natural and flexible to use URI fragment only.
see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#linking_to_an_element_on_the_same_page

@cdtkrk cdtkrk changed the title Link component does not resolve a relative URL fragment properly Link component does not resolve a relative URI fragment properly Jun 6, 2023
@cdtkrk
Copy link
Author

cdtkrk commented Jun 6, 2023

Sorry. I've found that #49521 PR. This is duplicated.

@cdtkrk cdtkrk closed this as completed Jun 6, 2023
@github-actions
Copy link
Contributor

github-actions bot commented Jul 7, 2023

This closed issue has been automatically locked because it had no new activity for a month. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.

@github-actions github-actions bot locked as resolved and limited conversation to collaborators Jul 7, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
area: app App directory (appDir: true) bug Issue was opened via the bug report template.
Projects
None yet
Development

No branches or pull requests

2 participants