Skip to content
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.

Sign up for GitHub

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

Jump to bottom

React 16: "Expected server HTML to contain a matching <noscript> in <body>" #11155

Closed
gaearon opened this issue Oct 9, 2017 · 2 comments
Closed

React 16: "Expected server HTML to contain a matching <noscript> in <body>" #11155

gaearon opened this issue Oct 9, 2017 · 2 comments
Labels
Component: Server Rendering

Comments

@gaearon
Copy link
Collaborator

gaearon commented Oct 9, 2017

It seems like putting <noscript> at the very end of the <body> tag makes React think it's missing. So React warns and compensates by adding another one.

screen shot 2017-10-09 at 3 50 17 pm

screen shot 2017-10-09 at 3 49 53 pm

This looks like a bug to me. Another (but different) issue about noscript: #10993.
@gaearon
Copy link
Collaborator Author

gaearon commented Oct 9, 2017

I don’t actually think this is a bug now. It was caused by the <script> running before <noscript> because we’re mounting into the document in that SSR fixture. It seems like if you render right into document then <script> that does the hydration should go last.

I could also work around it by delaying rendering:

window.addEventListener('DOMContentLoaded', () => {
  hydrate(<App assets={window.assetManifest} />, document);  
});

I’ll close this for now but if we hear from more people that it’s confusing maybe we can make the message better.

@gaearon gaearon closed this as completed Oct 9, 2017
@gaearon gaearon removed the Type: Bug label Oct 9, 2017
@leggomuhgreggo leggomuhgreggo mentioned this issue Dec 29, 2017
Closed
@Toske94
Copy link

Toske94 commented Sep 13, 2018 •
edited
Loading

I'm new in this, can someone explain to me why I got this error

The script that I use is returning a picture, but sometimes the picture is not showing and I got this error:

Expected server HTML to contain a matching in .

> import React from 'react';
> import {Menu} from 'semantic-ui-react';
> import { Link } from '../routes';
> 
> export default (props) => {
>     return (
>       <Menu borderless id="logo">
>         <script 
>             type="text/javascript" 
>             src="https://example.com/link/script/" >
>         </script>
>     </Menu>
>     );
> };

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
Component: Server Rendering
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@gaearon @Toske94