Typescript: MutationObserver API declarations missing

Created on 2 Oct 2016  路  9Comments  路  Source: microsoft/TypeScript

The MutationObserver related declarations are missing from the lib.d.ts file. Since this API is not browser specific I would expect the declarations to exist (as it happens with FileReader for example).

TypeScript Version: 2.0.3

Code

if( window && window.MutationObserver  )
{
   ...
}

Expected behavior:

To not arise an error.

Actual behavior:

Error : Property MutationObserver does not exist on type Window

I "solved" it by using the window["MutationObserver"] syntax. If that is an actual bug/issue I can provide a PR.

Question

Most helpful comment

@AvraamMavridis,

@kpreisser what you described is "feature detection" and has nothing to do with Typescript and the issue above (missing declarations)

That's correct. However in your original example, you used if( window && window.MutationObserver) to check for window.MutationObserver, which would not throw a ReferenceError when it is not defined (and running in strict mode) because you are accessing a property on the window object here.

But as @kitsonk noted, you should use the global MutationObserver variable instead of window.MutationObserver because that one has declarations in TypeScript. But trying to use that variable in if (MutationObserver) can throw a ReferenceError when it is not defined and running in strict mode.

To correctly feature-detect it, you can use if (typeof MutationObserver != "undefined") instead of if (MutationServer) as the former will not throw a ReferenceError when it is not defined. That's what I wanted to note.

All 9 comments

I'm almost positive that the proposal for mutation observers was dropped from ECMAScript. I don't have a reference handy but I believe that's the case

@aluanhaddad This has nothing to do with Object.observe or ECMAScript. It is part of the window object, same as FileReader or Geolocation that are not part of ECMAScript but they are supported by Typescript.

@AvraamMavridis thanks for correcting me.

@AvraamMavridis changes to the DOM part of the lib.d.ts come via TSJS-lib-generator.

They do appear to be declared though in the global interfaces and all the examples on MDN demonstrate it that way.

So your detection might be better if you just did something like this:

if (window && MutationObserver) {
  const mo = new MutationObserver();
}

You will find that they are properly typed that way.

@kitsonk Thx a lot. I will give it a try later and if works I will close the issue.

Hi,

if (window && MutationObserver) {
  const mo = new MutationObserver();
}

note that this can throw a ReferenceError when running in strict mode and MutationObserver (or window) is not defined. I think you might need to use the typeof operator:

if (typeof MutationObserver != "undefined") {
  const mo = new MutationObserver();
}

@kpreisser what you described is "feature detection" and has nothing to do with Typescript and the issue above (missing declarations), and it will probably throw Error even in a non strict mode.

@AvraamMavridis,

@kpreisser what you described is "feature detection" and has nothing to do with Typescript and the issue above (missing declarations)

That's correct. However in your original example, you used if( window && window.MutationObserver) to check for window.MutationObserver, which would not throw a ReferenceError when it is not defined (and running in strict mode) because you are accessing a property on the window object here.

But as @kitsonk noted, you should use the global MutationObserver variable instead of window.MutationObserver because that one has declarations in TypeScript. But trying to use that variable in if (MutationObserver) can throw a ReferenceError when it is not defined and running in strict mode.

To correctly feature-detect it, you can use if (typeof MutationObserver != "undefined") instead of if (MutationServer) as the former will not throw a ReferenceError when it is not defined. That's what I wanted to note.

thanks @kpreisser

Was this page helpful?
0 / 5 - 0 ratings