Skip to content

Hydration issue involving __gchrome_uniqueid on iPad Chrome/Edge browser #77710

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

Open
danvim opened this issue Apr 2, 2025 · 3 comments
Open
Labels
linear: next Confirmed issue that is tracked by the Next.js team. Output Related to the the output configuration option.

Comments

@danvim
Copy link

danvim commented Apr 2, 2025

Link to the code that reproduces this issue

https://github.com/danvim/next-gchrome-hydration-reproduction

To Reproduce

  1. Start development server
  2. Visit development server via iPad Chrome/Edge browser app.

Current vs. Expected behavior

Expected no error.

Current error message:

Hydration failed because the server rendered HTML didn't match the client...

    <Home>
      <input
-      __gchrome_uniqueid="1"
      >
    ...

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 24.3.0: Thu Jan  2 20:24:24 PST 2025; root:xnu-11215.81.4~3/RELEASE_ARM64_T6030
  Available memory (MB): 36864
  Available CPU cores: 11
Binaries:
  Node: 22.12.0
  npm: 10.9.0
  Yarn: 1.22.22
  pnpm: N/A
Relevant Packages:
  next: 15.3.0-canary.29 // Latest available version is detected (15.3.0-canary.29).
  eslint-config-next: N/A
  react: 19.1.0
  react-dom: 19.1.0
  typescript: 5.8.2
Next.js Config:
  output: N/A

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

Output

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

next dev (local)

Additional context

iPad Chrome: 135.0.7049.53
iPad Edge: 134.3124.95
iPad Safari tested without issues.

@github-actions github-actions bot added the Output Related to the the output configuration option. label Apr 2, 2025
@verheyenkoen
Copy link

I also noticed this on Chrome on iOS. Is there a way to define a list of selectors that get ignored for hydration warnings? This can also be useful for browser extensions that inject markup.

@alexdsgmoura
Copy link

my fix for this are verify if component is mounted

const [isMounted, setIsMounted] = useState(false)

useEffect(() => {
setIsMounted(true)
}, [])

if (!isMounted) {
return null
}

this "fixed" for me!

@github-actions github-actions bot added the linear: next Confirmed issue that is tracked by the Next.js team. label Apr 21, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
linear: next Confirmed issue that is tracked by the Next.js team. Output Related to the the output configuration option.
Projects
None yet
Development

No branches or pull requests

3 participants