Using emotion with SSR and rehydration results in React error

[tannerlinsley]

• emotion version: 10.0.10
• react version: 16.8.2

Relevant code:

import React from 'react'
import styled from '@emotion/styled'

const Div = styled.div`
  color: blue;
`

export default () => (
  <Div>
    <h1>Welcome to React-Static</h1>
  </Div>
)

What you did:

Exported the above component using the recommended SSR approach

What happened:

SSR export works and resulting HTML is good! However, during hydration, this error occurs:

Reproduction:

This is using a new alpha build of React-Static v7, so reproduction will be difficult. I understand it may not be fixable until I can provide a replicable setup. Stay tuned as I work on it.

Problem description:

Strangely, the error only happens when NODE_ENV==='production' so I'm not sure what's happening in the production code that would cause this.

Suggested solution:

Not sure yet... :(

[tannerlinsley]

More information!

I'm not sure what it does exactly, but after disabling speedy mode as outlined in the docs, everything seems to work. What exactly is speedy doing under the hood?

[Andarist]

This issue doesn't contain any concrete repro steps - but the error itself looks really similar to what got reported here - #1468 - and what will be fixed by this - #1572

I might be mistaken of course, but until you provide repro steps I must close this issue due to long inactivity