jsx render error

[Vanessa219]

Github is ok， but a rendering error occurs in https://hacpai.com/article/1570754498261#toc_h3_2.

/React.Fragment> has class highlight-err

code:

//Add the component to the render function
function App() {
  const [isModal, setModal] = React.useState(false);

  return (
    <React.Fragment>
      <button onClick={() => setModal(true)}>Click Here</button>
      <Modal
        isVisible={isModal}
        title="Modal Title"
        content={<p>Add your content here</p>}
        footer={<button>Cancel</button>}
        onClose={() => setModal(false)}
      />
    </React.Fragment>
  );
}

ReactDOM.render(<App />, document.getElementById('root'));

[dguo]

The same thing seems to happen (I'm indirectly using Chroma through Hugo) with the shorthand syntax for Fragments:

function App() {
    return (
        <>
            <p>test</p>
        </>
    );
}

I get error highlighting for the /> part of the closing Fragment tag.

[phelipetls]

It looks like this issue has been resolved? I couldn't reproduce them.

Fragment is highlighted normally in the OP's website:

The second reported issue doesn't seem to occur using Hugo v101 (not sure which chroma version is being used)