Search code examples
angulartypescriptinternet-explorer-11angular5

Detect IE11 in Angular 5 and suppress "property doesn't exist" warnings


I'm working on custom directive which requires scroll position. I found all major browsers support window.scrollY while IE11 needs document.documentElement.scrollTop

so I'm trying to determine if current browser is IE11 here:

  ngOnInit(){
    this.isIE11 = !!window.MSInputMethodContext && !!document.documentMode;// tslint:disable-line
    this.checkScrollPosition();
  }

where I'm getting ts errors property MSInputMethodContext doesnt exist on type Window and property documentMode doesnt exist on type Document, though the code works fine in all browsers where I tested (chorme, safari, ie11)

1) am I right thinking this will work fine since TS will be translated to the pure JS where these properties will be accessible?

2) should I suppress this warning (how?) or should I try different browser detection approach?

I tried adding this, but no luck as of now:

//tslint:disable-line
//noinspection TypeScriptUnresolvedProperty

Solution

  • It looks like you can use pageYOffset instead of scrollY. pageYOffset is an alias of scrollY but has better support : https://developer.mozilla.org/it/docs/Web/API/Window/pageYOffset

    If you want to persist with your solution :

    1) yes, you are right to assume that.

    2) You can suppress the warning with a simple dummy cast:

    !!(window as any).MSInputMethodContext && !!(document as any).documentMode;