msRequestFullscreen not working in case keydown event (IE 11)

Question

I`m working with fullscreen api.

I`ve added this polyfill:

let doc = document as any;
if (!doc.requestFullscreen) {
  document.body.requestFullscreen = doc.body.mozRequestFullScreen || 
    doc.body.webkitRequestFullscreen || doc.body.msRequestFullscreen;
  document.exitFullscreen = doc.mozCancelFullScreen || doc.webkitExitFullscreen || 
    doc.msExitFullscreen;
}

I have UI button for enabling fullscreen mode and all works fine (chrome IE 11, edge, opera, firefox)

Also I have keydown handler:

if (args.keyCode === 70) {
  args.preventDefault();
  if (!this.isInFullScreen) {
    document.body.requestFullscreen();
  } 
  else {
    document.exitFullscreen();
  }
  this.InFullScreen = !this.isInFullScreen;
}

But enabling/disabling fullcreen mode by pressing F doesn`t work in IE 11. msRequestFullscreen function simply do nothing. There are no console errors or smth. In other browsers works fine.
How can I solve this issue?

Answer 1

I can reproduce the issue. msRequestFullscreen works in IE 11 but it just doesn't work in keyCode event.

As a workaround, I suggest that you can use ActiveXObject to SendKeys F11. It can make it full screen in IE 11. You can add the following code:

if ("ActiveXObject" in window) {
   var wscript = new ActiveXObject("Wscript.shell");
   wscript.SendKeys("{F11}");
}