Skip to content

fix suppressHydrationWarning being set to "true" instead of true#5733

Merged
adhami3310 merged 1 commit into
mainfrom
fix-suppressHydrationWarning-being-set-to-"true"-instead-of-true
Aug 25, 2025

Hidden character warning

The head ref may contain hidden characters: "fix-suppressHydrationWarning-being-set-to-"true"-instead-of-true"
Merged

fix suppressHydrationWarning being set to "true" instead of true#5733
adhami3310 merged 1 commit into
mainfrom
fix-suppressHydrationWarning-being-set-to-"true"-instead-of-true

Conversation

@adhami3310
Copy link
Copy Markdown
Member

No description provided.

Copy link
Copy Markdown
Contributor

@greptile-apps greptile-apps Bot left a comment

Choose a reason for hiding this comment

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

Greptile Summary

This PR fixes a React hydration issue where the suppressHydrationWarning attribute was incorrectly being set as the string "true" instead of the boolean true. In React/JSX, boolean HTML attributes must be actual boolean values, not string representations.

The changes span three files in the compiler and app modules:

  1. reflex/app.py: Updates the document root generation to use boolean True instead of string "true" for the suppressHydrationWarning attribute
  2. reflex/compiler/compiler.py: Modifies the type annotation for html_custom_attrs from dict[str, Var | str] to dict[str, Var | Any] and adds the Any import
  3. reflex/compiler/utils.py: Updates the matching type annotation in the create_document_root function

The suppressHydrationWarning prop is a React feature used to suppress hydration mismatch warnings between server-side and client-side rendering. When set incorrectly as a string, React treats it as truthy but semantically incorrect, potentially causing hydration issues. This fix ensures proper React hydration behavior by allowing the type system to accept boolean values while maintaining the existing support for Var objects and other types that may be needed for HTML attributes.

The changes integrate well with Reflex's existing architecture for handling custom HTML attributes and document root compilation, maintaining backward compatibility while fixing the specific boolean attribute issue.

Confidence score: 5/5

  • This PR is safe to merge with minimal risk as it fixes a clear type system bug
  • Score reflects a straightforward fix addressing a specific React hydration issue with well-defined changes
  • No files require special attention as the changes are consistent and well-targeted

3 files reviewed, no comments

Edit Code Review Bot Settings | Greptile

@codspeed-hq
Copy link
Copy Markdown

codspeed-hq Bot commented Aug 25, 2025

CodSpeed Performance Report

Merging #5733 will not alter performance

Comparing fix-suppressHydrationWarning-being-set-to-"true"-instead-of-true (b79d785) with main (fe9551d)

Summary

✅ 8 untouched benchmarks

Copy link
Copy Markdown
Collaborator

@masenf masenf left a comment

Choose a reason for hiding this comment

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

great branch name

@adhami3310 adhami3310 merged commit 286a84e into main Aug 25, 2025
41 checks passed
@adhami3310 adhami3310 deleted the fix-suppressHydrationWarning-being-set-to-"true"-instead-of-true branch August 25, 2025 18:21
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants