When I use the requestFullScreen Api on a video element that is being used for screen share (getUserDisplayMedia) the pixels of video turn blue in fullscreen mode

This is what happens

I also have fullscreen option on a normal video element and that works fine,I have no clue what might be causing this.

const handleFullScreen = () => {
    if (screenShareRef.current) {
        const elem = screenShareRef.current.querySelector(
            'video'
        ) as HTMLVideoElement;

        if (elem) {
            if (elem.requestFullscreen) {
                elem.requestFullscreen();
                // @ts-ignore
            } else if (elem.mozRequestFullScreen) {
                // @ts-ignore
                elem.mozRequestFullScreen();
                // @ts-ignore
            } else if (elem.webkitRequestFullscreen) {
                // @ts-ignore
                elem.webkitRequestFullscreen();
                // @ts-ignore
            } else if (elem.msRequestFullscreen) {
                // @ts-ignore
                elem.msRequestFullscreen();
            }
        }
    }
};

This is the fullscreen handler function.