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"></iframe>" Client: "\n <iframe src="//www.googletagmanager.com/ns.html?id=GTM-XXXXXX"\n height="0" width="0" style="display:none;visibility:hidden"></iframe>"

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