Warning: Prop `dangerouslySetInnerHTML` did not match

[nilesh-parab]

We are encountering this warning when we run our meteor app with non-minified bundle. The warning shows that the iframe tag on client side shows extra line breaks as compared to server side.

Below is the warning we are seeing:

Warning: Prop dangerouslySetInnerHTML did not match. Server: "<iframe src=\"//www.googletagmanager.com/ns.html?id=GTM-XXXXXX\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\">" Client: "\n <iframe src=\"//www.googletagmanager.com/ns.html?id=GTM-XXXXXX\"\n height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\">"

a.(anonymous function) @ raven.js:58 printWarning @ modules.js?hash=488d…4e5bb9733e559:46064 warning @ modules.js?hash=488d…4e5bb9733e559:46088 warnForPropDifference @ modules.js?hash=488d…4e5bb9733e559:67347 diffHydratedProperties$1 @ modules.js?hash=488d…4e5bb9733e559:68003 hydrateInstance @ modules.js?hash=488d…4e5bb9733e559:68785 prepareToHydrateHostInstance @ modules.js?hash=488d…4e5bb9733e559:72985 completeWork @ modules.js?hash=488d…4e5bb9733e559:74189 completeUnitOfWork @ modules.js?hash=488d…4e5bb9733e559:75801 performUnitOfWork @ modules.js?hash=488d…4e5bb9733e559:75978 workLoop @ modules.js?hash=488d…4e5bb9733e559:75990 renderRoot @ modules.js?hash=488d…4e5bb9733e559:76030 performWorkOnRoot @ modules.js?hash=488d…4e5bb9733e559:76647 performWork @ modules.js?hash=488d…4e5bb9733e559:76568 performSyncWork @ modules.js?hash=488d…4e5bb9733e559:76540 requestWork @ modules.js?hash=488d…4e5bb9733e559:76440 scheduleWork$1 @ modules.js?hash=488d…4e5bb9733e559:76306 scheduleRootUpdate @ modules.js?hash=488d…4e5bb9733e559:76873 updateContainerAtExpirationTime @ modules.js?hash=488d…4e5bb9733e559:76900 updateContainer @ modules.js?hash=488d…4e5bb9733e559:76927 ReactRoot.render @ modules.js?hash=488d…4e5bb9733e559:77210 (anonymous) @ modules.js?hash=488d…4e5bb9733e559:77350 unbatchedUpdates @ modules.js?hash=488d…4e5bb9733e559:76767 legacyRenderSubtreeIntoContainer @ modules.js?hash=488d…4e5bb9733e559:77346 hydrate @ modules.js?hash=488d…4e5bb9733e559:77402 Meteor.startup @ createRouter.jsx:83 maybeReady @ meteor.js?hash=c8108…14b613d0c4512cc:889 loadingCompleted @ meteor.js?hash=c8108…14b613d0c4512cc:901

I think this probably happening due to the line breaks within template literals as they get preserved in code here. Can possibly use a backslash (\) in that case.

These warnings are being shown on new env that we are setting up:

• Meteor 1.7.0.1
• Node 8.11.2
• React 16.4.0

The warning was not fired when we running on this env:

• Meteor 1.5.1
• Node 4.8.4
• React 15.5.x

Can you please help?

Thanks.

[macalinao]

I'm getting this error too.

[PhiNguyen1991]

Hey bro, using process.browser to make sure it rendered only on client