vercel/next.js

When opening DevTools and hitting refresh in Chrome, unable to view page

KingJulius opened this issue · 1 comments

Link to the code that reproduces this issue

https://github.com/KingJulius/react-fundamentals-practice

To Reproduce

  1. Run the application in the dev environment. (pnpm run dev)
  2. Open the localhost:3000 URL in the Chrome to see if the application is running.
  3. Open up DevTools & Hit Reload Page.
  4. Getting No Internet Connection webpage with no specific error mentioned. This issue goes away when DevTools is closed and we refresh the page. Due to this, we cannot see elements or console messages on reload, or emptying cache, or hard reload.

issue_1

Current vs. Expected behavior

Unable to refresh the page when DevTools is open. This in turn cannot be used to see the update in styling and elements from 1 state to another during a page refresh degrading the existing developer experience. I have also tested this in next version 15.1.0 as well, and I am still facing this issue.

Provide environment information

For Test 1:
Operating System:
  Platform: win32
  Arch: x64
  Version: Windows 11 Home
  Available memory (MB): 32631
  Available CPU cores: 16
Binaries:
  Node: 23.3.0
  npm: N/A
  Yarn: N/A
  pnpm: N/A
Relevant Packages:
  next: 14.2.1 // An outdated version detected (latest is 15.1.0), upgrade is highly recommended!
  eslint-config-next: 14.2.1
  react: 18.2.0
  react-dom: 18.2.0
  typescript: 5.4.5

For Test 2:
Operating System:
  Platform: win32
  Arch: x64
  Version: Windows 11 Home
  Available memory (MB): 32631
  Available CPU cores: 16
Binaries:
  Node: 23.3.0
  npm: 10.9.2
  Yarn: N/A
  pnpm: 8.13.1
Relevant Packages:
  next: 15.1.0 // Latest available version is detected (15.1.0).
  eslint-config-next: 15.1.0
  react: 19.0.0
  react-dom: 19.0.0
  typescript: 5.7.2
Next.js Config:
  output: N/A

Which area(s) are affected? (Select all that apply)

Developer Experience

Which stage(s) are affected? (Select all that apply)

next dev (local)

Additional context

This issue is reproducible locally in the dev environment. This issue is only in Chrome. Tested this using Firefox and not facing this issue on this browser.

Just did some further tests and have concluded that this is not an issue with the framework but more of an issue with Chrome. Closing this issue.