Video does not expand to full screen in Extjs window

Question

Video does not expand to full screen in Extjs window

Plateform: Ext JS 4.2.1

Browser: Chrome: version 46.0.2490.86 m Firefox 40.0.3 IE10, IE11

Requirements:

I am using the HTML video tag in the HTML file of the EXTJS window. I use custom buttons instead of the video control attribute.

When using the default control attribute, I can’t see the Maximize Full Screen icon in the control panel. I added my custom buttons instead of the standard controls. The Play, Pause, and Volume buttons work fine, as expected, but the full-screen mode doesn't work, even I added the correct listener to the full-screen button, as shown below.

// Event listener for the full-screen button

fullScreenButton.addEventListener("click", function() {
    if (video.requestFullscreen) {

        video.requestFullscreen();

    } 
   else if (video.mozRequestFullScreen) {
        video.mozRequestFullScreen(); // Firefox
    }
    else if (video.webkitRequestFullscreen) 
   {
        console.log('fullScreenButton clicked');

        video.webkitRequestFullscreen(); // Chrome and Safari

        console.log('Executed webkitRequestFullscreen()');
    }
    else if (video.msRequestFullscreen) {

        video.msRequestFullscreen(); // Internet Explorer

    }
});