Next.js: Navigating with Next/Link does not alter the Image content using Next/Image

[raulfdm]

Bug report

Describe the bug

Hello there.

I recently face a bug where I switch from dynamic routes via next/link and despite all content has been changed, the image source remains the same.

To Reproduce

I've created create this repository to demo this problem: https://github.com/raulfdm/next-link-image-bug, but you can also access via codesandbox: https://codesandbox.io/s/github/raulfdm/next-link-image-bug

Steps:

1. Navigate to route /blog/test1. There you'll find a top level nav with page 1 and page 2
2. Then, click in Page 2 link.Note that the image just change the size but not the content
3. Refresh the page with F5. Note that the image will now be different
4. Now click in the Page 1. Note now the image will remain
5. Refresh the page with F5 and see the first image

Expected behavior

I expected when I navigate from dynamic routes (e.g /blog/a to /blog/b) it also replaces the image I'm seeing in the screen.

Screenshots

To see this video in details, check it out on my repo: https://github.com/raulfdm/next-link-image-bug/blob/main/public/report.mp4 or in the sandbox, the home page.

System information

• OS: Linux PopOS
• Browser (if applies) [e.g. chrome, safari]: Firefox Developer 84.0.2
• Version of Next.js: [e.g. 6.0.2]: 10.0.1
• Version of Node.js: [e.g. 10.10.0]: 15.0.1

Additional context

Add any other context about the problem here.

[timneutkens]

Can you try next@canary?

[raulfdm]

Can you try next@canary?

@timneutkens I tried using Canary version it seems fixed.

https://codesandbox.io/s/next-link-next-image-bug-canary-4l4pp

[timneutkens]

Thanks, we've already solved this on canary so I'll close this issue 👍