/TypeScript/Property 'mozRequestFullScreen' does not exist on type 'HTMLElement'. Did you mean 'requestFullscreen'?

Property 'mozRequestFullScreen' does not exist on type 'HTMLElement'. Did you mean 'requestFullscreen'?

//service to toggle fullscreen

import { Injectable } from '@angular/core';

@Injectable({
  providedIn: "root",
})

export class FullscreenService {
  private doc = <FullScreenDocument>document;

  enter() {
    const el = this.doc.documentElement;
    if (el.requestFullscreen) el.requestFullscreen();
    else if (el.msRequestFullscreen) el.msRequestFullscreen();
    else if (el.mozRequestFullScreen) el.mozRequestFullScreen();
    else if (el.webkitRequestFullscreen) el.webkitRequestFullscreen();
  }

  leave() {
    if (this.doc.exitFullscreen) this.doc.exitFullscreen();
    else if (this.doc.msExitFullscreen) this.doc.msExitFullscreen();
    else if (this.doc.mozCancelFullScreen) this.doc.mozCancelFullScreen();
    else if (this.doc.webkitExitFullscreen) this.doc.webkitExitFullscreen();
  }

  toggle() {
    if (this.enabled) this.leave();
    else this.enter();
  }

  get enabled() {
    return !!(
      this.doc.fullscreenElement ||
      this.doc.mozFullScreenElement ||
      this.doc.webkitFullscreenElement ||
      this.doc.msFullscreenElement
    );
  }
}

interface FullScreenDocument extends Document {
  documentElement: FullScreenDocumentElement;
  mozFullScreenElement?: Element;
  msFullscreenElement?: Element;
  webkitFullscreenElement?: Element;
  msExitFullscreen?: () => void;
  mozCancelFullScreen?: () => void;
  webkitExitFullscreen?: () => void;
}

interface FullScreenDocumentElement extends HTMLElement {
  msRequestFullscreen?: () => void;
  mozRequestFullScreen?: () => void;
  webkitRequestFullscreen?: () => void;
}

//usage
@Component()
export class SomeComponent {
  constructor(private fullscreenService: FullscreenService) {}

  onToggleFullscreen() {
    this.fullscreenService.toggle();
  }
}

Similar codes

0 vote134 views1 answer
How to validate if all characters enetred in a string are alphabets and then reprompt user
TypeScript
0 vote129 views1 answer
Curl send 100 requests parallel
TypeScript
0 vote188 views1 answer
Angular bind colspan to ts variable
TypeScript
2 votes128 views1 answer
What type of radiation is 5g
TypeScript
-1 vote94 views1 answer
> could not find method kapt() for arguments [androidx.room:room-compiler:2.4.1] on object of type org.gradle.api.internal.artifacts.dsl.dependencies.defaultdependencyhandler.
TypeScript
18 votes121 views3 answers
Typescript sort array of objects
TypeScript
1 vote128 views1 answer
Nuxt @use "sass:math";
TypeScript
0 vote163 views1 answer
How to pass data to another page in ionic 3
TypeScript
1 vote109 views1 answer
Prevent row click event when button is clicked angular html
TypeScript
3 votes124 views1 answer
Results of 1812
TypeScript