From: Raphaël Jakse <raphael.trivabble@jakse.fr>
Date: Mon, 27 Oct 2025 07:07:20 +0000 (+0100)
Subject: Disable auto-zoom on WebKit
X-Git-Url: https://secure.softndesign.org/git/?a=commitdiff_plain;h=b9104741730c2c278394aae9659c6a1d44f5d462;p=trivabble.git

Disable auto-zoom on WebKit

Our usage of CSS zoom messes up D&D on WebKit because of:

  https://bugs.webkit.org/show_bug.cgi?id=77998

As zoom is more a nice to have, let's just disable it for WebKit and enable it
for more recent versions when it gets fixed.
---

diff --git a/public/trivabble.js b/public/trivabble.js
index 545892d..247681e 100644
--- a/public/trivabble.js
+++ b/public/trivabble.js
@@ -2734,6 +2734,15 @@
         startGame(getSetting("GameNumber"));
     }
 
+    // https://rnwest.engineer/detect-webkit/
+    function isWebKit() {
+        const ua = navigator.userAgent;
+        // As far as I can tell, Chromium-based desktop browsers are the only browsers
+        // that pretend to be WebKit-based but aren't.
+        return (/AppleWebKit/.test(ua) && !/Chrome/.test(ua)) ||
+                /\b(iPad|iPhone|iPod)\b/.test(ua);
+    }
+
     function initBoard() {
         const letters = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz";
         const def = BoardList[getSetting("BoardLabel")];
@@ -2813,7 +2822,10 @@
         }
 
         setCellCaptions(getSetting("CELL_CAPTIONS"));
-        if (window.CSS && CSS.supports && CSS.supports("zoom: 1.5")) {
+        if (window.CSS && CSS.supports && CSS.supports("zoom: 1.5") && !isWebKit()) {
+            // We zoom the window so the board is as big as possible
+            // Except on WebKit because we are affected by the following bug,
+            // which fucks up d&d: https://bugs.webkit.org/show_bug.cgi?id=77998
             resize();
             window.removeEventListener("resize", resize);
             window.addEventListener("resize", resize);