From dcfcf222e2683df4ee5c526a74aaaeac00862238 Mon Sep 17 00:00:00 2001
From: Nekzuris <48560751+Nekzuris@users.noreply.github.com>
Date: Fri, 13 Dec 2024 19:47:40 +0100
Subject: [PATCH] Dynamic epsilon for specific pixel ratios on Chrome

---
 css/80_app.css                 |  4 ++--
 modules/renderer/tile_layer.js | 25 ++++++++++++++++++++++++-
 2 files changed, 26 insertions(+), 3 deletions(-)

diff --git a/css/80_app.css b/css/80_app.css
index 5113a8fb2..5671caa89 100644
--- a/css/80_app.css
+++ b/css/80_app.css
@@ -4369,9 +4369,9 @@ img.tile {
 }
 
 /* Workaround to remove visible grid around tile borders on Chrome */
-/* with 3 exceptions for 110%, 80% and 67% browser zoom */
+/* with exceptions for 110%, 90%, 80% and 67% browser zoom */
 /* https://issues.chromium.org/issues/40084005  https://github.com/Leaflet/Leaflet/pull/8891  https://github.com/openstreetmap/iD/pull/10594 */
-@media not ((1.09 < -webkit-device-pixel-ratio < 1.11) or (0.79 < -webkit-device-pixel-ratio < 0.81) or (0.66 < -webkit-device-pixel-ratio < 0.68)) {
+@media not ((1.09 < -webkit-device-pixel-ratio < 1.11) or (0.89 < -webkit-device-pixel-ratio < 0.91) or (0.79 < -webkit-device-pixel-ratio < 0.81) or (0.66 < -webkit-device-pixel-ratio < 0.68)) {
     .layer-background img.tile {
         mix-blend-mode: plus-lighter;
     }
diff --git a/modules/renderer/tile_layer.js b/modules/renderer/tile_layer.js
index 5f98c0ea1..727fcea6e 100644
--- a/modules/renderer/tile_layer.js
+++ b/modules/renderer/tile_layer.js
@@ -15,10 +15,33 @@ export function rendererTileLayer(context) {
     var _tileOrigin;
     var _zoom;
     var _source;
+    var _epsilon = 0;
 
+    // Workaround to remove visible grid around tile borders on Chrome with dynamic epsilon for specific browser zoom levels
+    // Should be removed when https://issues.chromium.org/issues/40084005 is resolved, https://github.com/openstreetmap/iD/pull/10594
+    if (window.chrome) {
+        updateEpsilon();
+        window.addEventListener('resize', updateEpsilon);
+    }
+    function updateEpsilon() {
+        switch (Math.round(window.devicePixelRatio * 100)) {
+            case 110:
+                _epsilon = 0.002;
+                break;
+            case 90:
+                _epsilon = 0.005;
+                break;
+            case 80:
+            case 67:
+                _epsilon = 0.003;
+                break;
+            default:
+                _epsilon = 0;
+        }
+    }
 
     function tileSizeAtZoom(d, z) {
-        return ((d.tileSize * Math.pow(2, z - d[2])) / d.tileSize);
+        return ((d.tileSize * Math.pow(2, z - d[2])) / d.tileSize) + _epsilon;
     }