[WIP] Diffs for hydration errors

[gaearon]

• [ ] Errors
  • [x] Extra server element
  • [x] Extra server text
  • [x] Extra client element
  • [x] Extra client text
  • [ ] Extra server attributes
  • [ ] Prop mismatch
• [ ] Formatting
  • [x] Parent tag and attributes
  • [x] Sibling tag/text and attributes
  • [x] Child tag/text and attributes
  • [x] Ellipsis to indicate more siblings before or after
• [ ] Special cases
  • [ ] Document/fragment parent
  • [x] Long attributes
  • [x] Too many attributes
  • [ ] Quotes in attributes
  • [ ] Long text
  • [x] Skip over non-element/text siblings
• [ ] Other stuff
  • [ ] Flow

[sizebot]

Comparing: 0dc4e6663dc875e0f734b1a96b26ebc33902323a...35c1424b35d036c8941e562a32da55ea5f4a1c1b

Critical size changes

Includes critical production bundles, as well as any change greater than 2%:

Name	+/-	Base	Current	+/- gzip	Base gzip	Current gzip
oss-stable/react-dom/cjs/react-dom.production.min.js	=	131.52 kB	131.52 kB	=	42.10 kB	42.10 kB
oss-experimental/react-dom/cjs/react-dom.production.min.js	=	136.79 kB	136.79 kB	=	43.68 kB	43.68 kB
facebook-www/ReactDOM-prod.classic.js	=	441.02 kB	441.02 kB	=	80.44 kB	80.44 kB
facebook-www/ReactDOM-prod.modern.js	=	426.28 kB	426.28 kB	=	78.25 kB	78.25 kB
facebook-www/ReactDOMForked-prod.classic.js	=	441.02 kB	441.02 kB	=	80.44 kB	80.44 kB

Significant size changes

Includes any change greater than 0.2%:

Expand to show

Name	+/-	Base	Current	+/- gzip	Base gzip	Current gzip
facebook-www/ReactDOMTesting-dev.modern.js	+0.53%	1,033.54 kB	1,039.06 kB	+0.45%	232.82 kB	233.87 kB
oss-stable-semver/react-dom/umd/react-dom.development.js	+0.52%	1,072.44 kB	1,078.02 kB	+0.44%	232.01 kB	233.02 kB
oss-stable/react-dom/umd/react-dom.development.js	+0.52%	1,072.44 kB	1,078.02 kB	+0.44%	232.01 kB	233.02 kB
facebook-www/ReactDOMTesting-dev.classic.js	+0.52%	1,062.15 kB	1,067.67 kB	+0.44%	238.49 kB	239.55 kB
oss-stable-semver/react-dom/cjs/react-dom.development.js	+0.51%	1,022.14 kB	1,027.40 kB	+0.44%	229.47 kB	230.49 kB
oss-stable/react-dom/cjs/react-dom.development.js	+0.51%	1,022.14 kB	1,027.40 kB	+0.44%	229.47 kB	230.49 kB
oss-experimental/react-dom/cjs/react-dom-unstable_testing.development.js	+0.51%	1,034.13 kB	1,039.39 kB	+0.44%	233.26 kB	234.29 kB
facebook-www/ReactDOMForked-dev.modern.js	+0.51%	1,127.64 kB	1,133.36 kB	+0.43%	249.63 kB	250.70 kB
oss-experimental/react-dom/umd/react-dom.development.js	+0.51%	1,102.97 kB	1,108.55 kB	+0.44%	238.26 kB	239.30 kB
oss-experimental/react-dom/cjs/react-dom.development.js	+0.50%	1,051.26 kB	1,056.52 kB	+0.43%	235.69 kB	236.72 kB
facebook-www/ReactDOMForked-dev.classic.js	+0.50%	1,151.61 kB	1,157.33 kB	+0.43%	253.99 kB	255.08 kB
facebook-www/ReactDOM-dev.modern.js	+0.49%	1,127.64 kB	1,133.16 kB	+0.42%	249.64 kB	250.68 kB
facebook-www/ReactDOM-dev.classic.js	+0.48%	1,151.61 kB	1,157.12 kB	+0.42%	253.99 kB	255.07 kB

Generated by :no_entry_sign: dangerJS against 35c1424b35d036c8941e562a32da55ea5f4a1c1b

[karlhorky]

This would be great, also for Next.js:

• https://github.com/vercel/next.js/issues/37847

[himself65]

Any update for this PR?

[gaearon]

No, I'm not actively working on this so there won't be any update.

[gaearon]

Someone motivated could pick this up though!

[himself65]

Someone motivated could pick this up though!

I will try to continue when I'm avaliable!

[gaearon]

That would be great! The first step would probably be to get this rebased and/or rewrite it based on the tests I added and the logic I've included. Then you can look at the remaining TODOs.

[sebmarkbage]

Going with a more invasive refactor and different approach in #28512.