Error when using `inert` attribute with Typescript

Viewed 130

I have created a vanilla create-react-app using the Typescript template.
I have added the line:

<dialog inert></dialog>

And the app won't even run because typescript is throwing an error saying:

ERROR in src/App.tsx:9:15 TS2322: Type '{ children: never[]; inert: true; }' is not assignable to type 'DetailedHTMLProps<DialogHTMLAttributes, HTMLDialogElement>'. Property 'inert' does not exist on type 'DetailedHTMLProps<DialogHTMLAttributes, HTMLDialogElement>'.

I would like to fix it instead of ignore it, but even ignoring doesn't seem to work.

// @ts-ignore
return (<dialog inert></dialog>);
1 Answers

The type hasn't been added yet to the React TypeScript definitions. There is a draft PR here in the works, so if that get's merged should work.

Related