foxglove/create-foxglove-extension

Add "lib": ["DOM"] to the extension template project's tsconfig.json

f-o-w-l opened this issue · 0 comments

Description
Without adding "lib": ["DOM"], to your tsconfig.json, you get TypeScript compilation errors when using some HTML elements in your extension.

  • Version: 1.12.1
  • OS: PopOS 20.04 LTS 64-bit
  • Data source (e.g. bag file, mcap file, rosbridge, ROS 1/2 native): N/A
  • ROS distro (if applicable): N/A

Steps To Reproduce
Render something like a file input with an onChange handler function:

<input type="file" onChange={handleNewFile} />
const handleNewFile = useCallback((event: React.ChangeEvent<HTMLInputElement>) => {
  const { files } = event.target;

  if (files && files?.length > 0) {
    ...
  }
}, []);

Expected Behavior
No TS errors.

Actual Behavior
TS errors, eg. for the handleNewFile callback above: Property 'files' does not exist on type 'EventTarget & HTMLInputElement'.