Microsoft/TypeScript

HTMLFormControlsCollection namedItem should return only form input elements

Open

#39,003 opened on Jun 10, 2020

View on GitHub
 (3 comments) (7 reactions) (0 assignees)TypeScript (48,455 stars) (6,726 forks)batch import
BugDomain: lib.d.tsHelp Wanted

Description

TypeScript Version: 3.9.2

Search Terms: HTMLFormControlsCollection RadioNodeList namedItem

Code

declare const form: HTMLFormElement;

const element = form.elements.namedItem('foo')

if (element && !(element instanceof RadioNodeList)) {
  console.log('eee', element.value) // <<< Property 'value' does not exist on type 'Element'
}

Expected behavior: According to MDN, namedItem() on a HTMLFormControlsCollection only returns a specific set of element types.

  • HTMLFormControlsCollection should extend HTMLCollectionOf<HTMLButtonElement | HTMLFieldSetElement | HTMLInputElement | HTMLObjectElement | HTMLOutputElement | HTMLSelectElement | HTMLTextAreaElement>
  • HTMLFormControlsCollection.namedItem() should return RadioNodeList | HTMLButtonElement | HTMLFieldSetElement | HTMLInputElement | HTMLObjectElement | HTMLOutputElement | HTMLSelectElement | HTMLTextAreaElement | null
  • RadioNodeList should extend NodeListOf<HTMLButtonElement | HTMLFieldSetElement | HTMLInputElement | HTMLObjectElement | HTMLOutputElement | HTMLSelectElement | HTMLTextAreaElement>

Actual behavior: HTMLFormControlsCollection.namedItem() return type is not specific enough (Element).

Playground Link: https://www.typescriptlang.org/play/?ssl=7&ssc=2&pln=1&pc=1#code/CYUwxgNghgTiAEYD2A7AzgF3gMyTAtgFzwASAKgLIAyAYnvgKIQj4goYDcAUF8uliGat28ALw56AOkEs2GNJJRRWwAJIYWACgDkuJNoCUPAJbZ4mmcKwAya-ACEFoXPjH+UFGBBIzAJSjAxkgAckigVMaYBgbwAN5c8IioaEjMkhBIAOY6ILnaADTwlnKSAG5QEACuIEYAvlxAA

Related Issues: #19437

Contributor guide

HTMLFormControlsCollection namedItem should return only form input elements · Microsoft/TypeScript#39003 | Good First Issue