FormidableLabs/react-live

Editor crashes on syntax error in useEffect cleanup function

zheeeng opened this issue · 1 comments

Is there an existing issue for this?

  • I have searched the existing issues

Code of Conduct

  • I agree to follow this project's Code of Conduct

Code Sandbox link

No response

Bug report

Try the official demo, add useEffect and try modify its dispose code:

type Props = {
  label: string;
}
const Counter = (props: Props) => {
  const [count, setCount] =
    React.useState<number>(0)

  React.useEffect(
     () => {
        // Modify this line cause crash:
        return () => {aa
        }
     },
     [],
  )

  return (
    <div>
      <h3 style={{
        background: 'darkslateblue',
        color: 'white',
        padding: 8,
        borderRadius: 4
      }}>
        {props.label}: {count} 🧮
      </h3>
      <button
        onClick={() =>
          setCount(c => c + 1)
        }>
        Increment
      </button>
    </div>
  )
}
render(<Counter label="Counter" />)

Released in 4.1.8