Why is this an issue?

If JSX special characters (>, }) appear unescaped in the element body, this may be either because you simply forgot to escape them or because there is a problem with the JSX tag or expression (for example, misplaced or duplicate closing > or } brackets).

<MyComponent
  name="abc"
  foo="bar">
  x="y"> {/* Noncompliant: closing > should only be on this line */}
  Body Text
</MyComponent>

To fix the issue, check the structure of your JSX tag or expression - are the closing brackets correct and in the right place? If the special character is there on purpose - you need to change it to the appropriate HTML entity.

• replace > with >
• replace } with }

<MyComponent
  name="abc"
  foo="bar"
  x="y">
  Body Text
</MyComponent>

The characters < and { should also be escaped, but they are not checked by this rule because it is a syntax error to include those tokens inside of a tag.

Resources

Documentation

• React Documentation - Writing markup with JSX
• MDN web docs - Entity codes