Annotations and Assertions 12 exercises
Problem

Provide Additional Information to TypeScript

This handleFormData function that accepts an argument e, which is typed as SubmitEvent. SubmitEvent is a global type from the DOM typings, emitted when a form is submitted.

Within the function we use the method e.preventDefault(), available on SubmitEvent, to stop the form from its defa

Loading exercise

Transcript

00:00 In this exercise, we have a function called HandleFormData and HandleFormData has an E on it, which is called SubmitEvent or being typed as SubmitEvent. This SubmitEvent is actually a globally available type that comes from the DOM typings.

00:14 So this is something that a form might submit and it would emit a SubmitEvent, emit a submit. And now what we're doing is we're saying E.preventDefault, which is a function available on that, and we're then saying const Data equals new FormData E.target.

00:30 Now this works at runtime, but it doesn't seem to be working on the type level. There is an error here saying argument of event target or null is not assignable to parameter of type HTML form elements or undefined. Your job is to try to work out why this is happening.

00:46 And really, we actually only want to change this line of code, the const Data equals new FormData E.target. And I think what we're going to need to do here is give TypeScript more information, annotate with intention, making sure that we're actually saying, OK, this target, it's not what you think it is.

01:04 We actually want to force it to be something else. And we're going to use a new keyword called as. Good luck.