Multiple <Helmet> tags will break (only one will render)

[matthew-dean]

Do you want to request a feature or report a bug?
Bug

What is the current behavior?
A component has a <Helmet> component tag inside it. That component is rendered along-side another <Helmet> tag. However, the contents of only one <Helmet> tag will render.

If the current behavior is a bug,
please provide the steps to reproduce and if
possible a minimal demo of the problem.
Your bug will get fixed much faster if we can run your
code and it doesn't have dependencies other than React and react-helmet.
Paste the link to your JSFiddle (https://jsfiddle.net/Luktwrdm/) or
CodeSandbox (https://codesandbox.io/s/new) example below:
https://codesandbox.io/s/sparkling-dust-qc0zgn?file=/src/index.js

What is the expected behavior?
The contents of both <Helmet> tags will render

Which versions of React and react-helmet, and which browser / OS are affected by this issue?
Did this work in previous versions of React and/or react-helmet?
React 16.14.0 / React-Helmet 6.1.0

[matthew-dean]

Additional context -- I've checked this with React 17 and the issue persists. React 18 didn't seem to have the issue, but we're not ready to upgrade to React 18.

[matthew-dean]

I think this may be a bug related to this feature:

Nested or latter components will override duplicate changes

In this case, these are not duplicates but are completely unique tags. But they are obliterated by the later <Helmet> call.

[derzierau]

+1 same for us. In our case our site uses react-helmet and we have a web component running inside of it using also react-helmet. It initially renders the main site helmet tags and deletes them when the web component is rendered.