From 99d978350b2d49e3c885edd21f86b11d06b4eb7c Mon Sep 17 00:00:00 2001
From: Tobias Taschner <TcT2k@users.noreply.github.com>
Date: Thu, 21 Jul 2022 13:08:42 +0000
Subject: [PATCH 1/2] macOS: wxWebView Remove fullscreen without prefix

The previous implementation included the fullscreen API with and without
the webkit prefix. Safari itself only provides the prefixed version.
This improves compatiblity at least with popular JS library video.js
and should also improve the situation in general as it closer to native
safari functionality (which is not available through WKWebView).
---
 src/osx/webview_webkit.mm | 15 +++++++--------
 1 file changed, 7 insertions(+), 8 deletions(-)

diff --git a/src/osx/webview_webkit.mm b/src/osx/webview_webkit.mm
index 8f4558c591..25fae95fa8 100644
--- a/src/osx/webview_webkit.mm
+++ b/src/osx/webview_webkit.mm
@@ -169,16 +169,15 @@ bool wxWebViewWebKit::Create(wxWindow *parent,
     // Implement javascript fullscreen interface with user script and message handler
     AddUserScript("\
         document.__wxToggleFullscreen = function (elem) { \
-            document.fullscreenElement = elem; \
+            document.webkitFullscreenElement = elem; \
             window.webkit.messageHandlers.__wxfullscreen.postMessage((elem) ? 1: 0); \
-            document.dispatchEvent(new Event('fullscreenchange')); \
+            document.dispatchEvent(new Event('webkitfullscreenchange')); \
+            if (document.onwebkitfullscreenchange) document.onwebkitfullscreenchange(); \
         }; \
-        Element.prototype.requestFullscreen = function() {document.__wxToggleFullscreen(this);}; \
-        Element.prototype.webkitRequestFullscreen = Element.prototype.requestFullscreen; \
-        document.exitFullscreen = function() {document.__wxToggleFullscreen(undefined);}; \
-        document.webkitExitFullscreen = document.exitFullscreen; \
-        document.onfullscreenchange = null; \
-        document.fullscreenEnabled = true; \
+        Element.prototype.webkitRequestFullscreen = function() {document.__wxToggleFullscreen(this);}; \
+        document.webkitExitFullscreen = function() {document.__wxToggleFullscreen(undefined);}; \
+        document.onwebkitfullscreenchange = null; \
+        document.webkitFullscreenEnabled = true; \
     ");
     [m_webView.configuration.userContentController addScriptMessageHandler:
         [[WebViewScriptMessageHandler alloc] initWithWxWindow:this] name:@"__wxfullscreen"];

From bfce3d2b87adad4a0dd073d090f9a5c1de2d629b Mon Sep 17 00:00:00 2001
From: Tobias Taschner <TcT2k@users.noreply.github.com>
Date: Thu, 21 Jul 2022 15:23:24 +0200
Subject: [PATCH 2/2] macOS: wxWebView expand fullscreen element

Expand the fullscreen element via CSS styles to
enhance the emulation of native safari behaviour.
---
 src/osx/webview_webkit.mm | 20 ++++++++++++++++++++
 1 file changed, 20 insertions(+)

diff --git a/src/osx/webview_webkit.mm b/src/osx/webview_webkit.mm
index 25fae95fa8..64b67381ab 100644
--- a/src/osx/webview_webkit.mm
+++ b/src/osx/webview_webkit.mm
@@ -169,6 +169,26 @@ bool wxWebViewWebKit::Create(wxWindow *parent,
     // Implement javascript fullscreen interface with user script and message handler
     AddUserScript("\
         document.__wxToggleFullscreen = function (elem) { \
+            if (!document.__wxStylesAdded) { \
+                function createClass(name,rules) { \
+                    var style= document.createElement('style'); style.type = 'text/css'; \
+                    document.getElementsByTagName('head')[0].appendChild(style); \
+                    style.sheet.addRule(name, rules); \
+                } \
+                createClass(\"body.wxfullscreen\", \"padding: 0; margin: 0; height: 100%;\"); \
+                createClass(\".wxfullscreen\", \"position: fixed; overflow: hidden; z-index: 1000; left: 0; top: 0; bottom: 0; right: 0;\"); \
+                createClass(\".wxfullscreenelem\", \"width: 100% !important; height: 100% !important; padding-top: 0 !important;\"); \
+                document.__wxStylesAdded = true; \
+            } \
+            if (elem) { \
+                elem.classList.add(\"wxfullscreen\"); \
+                elem.classList.add(\"wxfullscreenelem\"); \
+                document.body.classList.add(\"wxfullscreen\"); \
+            } else if (document.webkitFullscreenElement) { \
+                document.webkitFullscreenElement.classList.remove(\"wxfullscreen\"); \
+                document.webkitFullscreenElement.classList.remove(\"wxfullscreenelem\"); \
+                document.body.classList.remove(\"wxfullscreen\"); \
+            } \
             document.webkitFullscreenElement = elem; \
             window.webkit.messageHandlers.__wxfullscreen.postMessage((elem) ? 1: 0); \
             document.dispatchEvent(new Event('webkitfullscreenchange')); \