[examples] Bizarre render bug when a Button is used inside a Card on SSR (remix-run)

[dan-cooke]

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Current behavior 😯

Codesandbox: https://codesandbox.io/s/happy-monad-5qif8r?file=/app/src/createEmotionCache.ts

Following the remix run example, when using a Button or IconButton inside a Card > CardActionArea - it seems that the server side render puts additional cards outside the layout.

I cannot really describe what I'm seeing, its better to just look at the code sandbox.

Weirdest bug i've seen this year so far.

I'm also not sure where to file the bug report, here or over on @remix-run. But at the moment I feel like its probably something that the CardActionArea is doing that is not fully supported by remix? Either that, or the remix integration example is missing something.

Note: I also tried initialising the emotion cache with prepend: true but this causes my app to render nothing at all.

Expected behavior 🤔

It should not duplicate the render of certain cards

Steps to reproduce 🕹

No response

Context 🔦

No response

Your environment 🌎

No response

[mnajdova]

What exactly are you seeing? I see the 5 cards, and that's what I would expect, no? Could you do a screenshot?

[github-actions]

Since the issue is missing key information, and has been inactive for 7 days, it has been automatically closed.
If you wish to see the issue reopened, please provide the missing information.

[dan-cooke]

@mnajdova

What exactly are you seeing? I see the 5 cards, and that's what I would expect, no? Could you do a screenshot?

Apologies, I removed the broken code after posting this issue. If you check again now you will see the following:

If you could re-open this issue, it would be appreciated

[Arber3434]

I also just encountered this issue. Good to see that it has already been reported!

[github-actions]

Since the issue is missing key information, and has been inactive for 7 days, it has been automatically closed.
If you wish to see the issue reopened, please provide the missing information.