[Web API type definition issue] incorrect type definition for `getElementById()`

Open
#2,020 4 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Assessment

Difficulty
2/5
Estimated time
1-3 hours
Newbie friendliness
45/100
Issue type
Bug
Clarity
Mostly clear
Activity status
Stale
Tech stack
typescript
Domain
tooling

Research direction

Start with the generated lib.dom definitions for Document and DocumentFragment and trace how their getElementById signatures are produced. Confirm the Web API behavior shown in the issue, update both return types to Element | null, and verify the generated definitions or relevant checks reflect the corrected signatures.

Written by the indexing model from the issue text.

Description

lib.d.ts bug
Summary

incorrect type definition for document.getElementById() and shadowRoot.getElementById()

Expected vs. Actual Behavior

The type definition in lib.dom shows the signature as:

interface Document extends Node, DocumentOrShadowRoot, FontFaceSource, GlobalEventHandlers, NonElementParentNode, ParentNode, XPathEvaluatorBase {
    // ... omitted ...
    getElementById(elementId: string): HTMLElement | null;
    // ... omitted ...
}

The signature should be

interface Document extends Node, DocumentOrShadowRoot, FontFaceSource, GlobalEventHandlers, NonElementParentNode, ParentNode, XPathEvaluatorBase {
    // ... omitted ...
    getElementById(elementId: string): Element | null;
    // ... omitted ...
}
Playground Link

https://www.typescriptlang.org/play/?#code/CYewxgrgtgpgdgFwHQCMTAJ5IJZzjAJwAkAVAWQBkACAXioHIAeAZwDcBzAPkfau2BoAiAGYgQg7gHoujSWy70AUIrAg4zBFV51QkWIlToMAQiTDsBDQFEANjH0IAwgAtsN4KfOWEt+-Ceu7lQAhsxUAMoAagDi0b4OyqrqIHZINiDsABS8uBrBcGAwIMIRMXF2DgCUVJKSVAgEEDBUiWoaWgBMtFS60P5I7DA+Ff4AQhgAksCZ9KIg9NWhpbHx-q3JqelZ7F25CPmFxcvlfojVtVQabjb1jTBAA

Browser Support
  • This API is supported in at least two major browser engines (not two Chromium-based browsers).
Have Tried The Latest Releases
  • This issue applies to the latest release of TypeScript.
  • This issue applies to the latest release of @types/web.
Additional Context

Proof:

// Run this in your console:

document.body.innerHTML = '<svg><g id="foo"></g></svg>'

const g = document.body!.firstElementChild!.firstElementChild

console.log(g instanceof SVGGElement) // true

const g2 = document.getElementById('foo')

console.log(g2 instanceof SVGGElement) // still true (getElementById did not return HTMLElement | null)

The type is also wrong for other types of documents:

interface DocumentFragment extends Node, NonElementParentNode, ParentNode {
    readonly ownerDocument: Document;
    getElementById(elementId: string): HTMLElement | null;
}
Dominant language
TypeScript
Stars
740
Forks
474
Avg merge
2d 8h
Merged PRs (30d)
15

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from microsoft/TypeScript-DOM-lib-generator

All issues in microsoft/TypeScript-DOM-lib-generator

Similar issues

More TypeScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.