SVG components raise a warning

Question

I migrated my application to React 16 and updated some packages in the same time. Now when I run it, I get the warnings:

Warning: The tag <g> is unrecognized in this browser. If you meant to render a React component, start its name with an uppercase letter.
Warning: <foreignObject /> is using uppercase HTML. Always use lowercase HTML tags in React.
Warning: The tag <foreignObject> is unrecognized in this browser. If you meant to render a React component, start its name with an uppercase letter.

I use SVG components to render d3 objects. I am using Chrome 62. These warnings do not seem to be justified by any bug in the application. Does someone have an explanation ?

Answer 1

Add outer <svg> tags around them:

<svg>
  <g />
</svg>