Document types in fireEvent

[balloob]

I was studying TypeScript tonight and I realized that the way how we register our HTML elements, we can also register events for fireEvent. That gives us this:

Here are some mwah things about this:

• We have a lot of events that we use no detail for. We can define it as undefined but TypeScript would still force us to pass in undefined as 3rd arg, which is lame. So I made detail optional, but that's obviously not always true.
• Not all files that declare an event (by listening for it) are in TypeScript, so they can't define the events. Added a new file polymer-types.ts.
• fireEvent takes detail of an event. However, since that's part of CustomEvent, we can't do some typing magic by registering our events in the generic event type map (HTMLElementEventMap). That means that if you want to get the right types going when you type addEventListener(…), you need to specify your event a 2nd time.

Example:

interface RegisterDialogParams {
  dialogShowEvent: keyof HASSDomEvents;
  dialogTag: keyof HTMLElementTagNameMap;
  dialogImport: () => Promise<void>;
}

declare global {
  // for fire event
  interface HASSDomEvents {
    "register-dialog": RegisterDialogParams;
  }
  // for add event listener
  interface HTMLElementEventMap {
    "register-dialog": HASSDomEvent<RegisterDialogParams>;
  }
}

[balloob]

@bramkragten my fireEvent work found this bug because it verifies that the dialog tag that you try to register is a known element 👍

[bramkragten]

edit-card is better than edit-config I think, but good thing you found it.