TypeScript: ResizeObserver API declarations missing

Time to add it, it has shipped to Safari last month. This means literally all browsers support it.

Up

This should re-open; I’m of the opinion the reason it’s closed is questionable.

The premise of not adding interface for ResizeObserver API is obsolete and needs an update.

/cc @weswigham

@weswigham MDN no longer lists this API as experimental. Currently getting “Cannot find name ‘ResizeObserver’” when trying to use the API with TypeScript 3.7.2

Still marked as experimental on mdn, so no. When the spec is moved out of draft state and accepted, it’s associated IDL should get pulled in by TS and automatically included, but that hasn’t happened yet.

I think it is intentional that the standard type definitions don’t come with experimental APIs, especially if browser support is nearly not existing.

that’s one of the more bizarre issues I encountered. i’ve heard way much about this API the past year for it to be unfamiliar by typescript

Any updates here?

@weswigham This seemingly should be revisited these days?

All major browsers support it with the evergreen model in mind: Firefox (68-69), Safari (Tech Preview for availability in next Safari to launch alongside MacOS Catalina without a doubt), Chrome, Edge w/ Chromium, & so on.

There’s also updated CaniUse data on the matter now, IIRC: https://caniuse.com/#search=ResizeObserver

While the typings aren’t merged into typescript yet, you can use a package from npm with ResizeObserver typings: https://www.npmjs.com/package/@types/resize-observer-browser

According to MDN it’s still only part of an Editor’s Draft, and not all major browsers support it.

To add to @denexapp’s response:

1. install https://www.npmjs.com/package/@types/resize-observer-browser
2. /// <reference types="resize-observer-browser" /> at the top of the file where you need to use it.

This issue should be reopened as it is no longer experimental and all major browsers support it.

Almost to 80% https://caniuse.com/#search=ResizeObserver

@MartinJohns Yeah, after upgrading to 4.2.3, it works perfectly, thanks!

To me, the solution is:

1. install @types/resize-observer-browser.
2. add @types/resize-observer-browser to types field in tsconfig.json file.

Just like:

{
  "compilerOptions": {
    "types": ["@types/resize-observer-browser"],
    ...
  },
  ...
}

Still marked as experimental on mdn, so no. When the spec is moved out of draft state and accepted, it’s associated IDL should get pulled in by TS and automatically included, but that hasn’t happened yet.

Why does not just ResizeObserver | undefined type?