Mike Rodov Mike Rodov - 10 months ago 62
React JSX Question

ReactJS: Show custom element name in html

Let's say I rendered the following react element

<CustomElement />

let's say that CustomElement - is rendered as


In HTML I'll see

Question: Is there a way to display

Or something similar, I've heard that it's possible but didn't find a way to do this.

P.S. I'm not talking about setting class names or this kind of stuff for recognizing the element. I'm talking about the element name itself to be displayed as a custom element.

Answer Source

You can add a custom html tag and it will show up in the DOM tree:

class App extends React.Component {
  render() {
    return <div-CustomElement>Hello React</div-CustomElement>;

  <App />,

Here is a demo: http://codepen.io/PiotrBerebecki/pen/xEqLzr and here you can inspect it easily with dev tools: http://s.codepen.io/PiotrBerebecki/debug/xEqLzr