yobb
yobb

Reputation: 165

SVG components raise a warning

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 ?

Upvotes: 12

Views: 7696

Answers (1)

James Salamon
James Salamon

Reputation: 1422

Add outer <svg> tags around them:

<svg>
  <g />
</svg>

Upvotes: 9

Related Questions