feature(linux) add mousewheel bindings for zoom functions (#12912)

* add mousewheel bindings commonly used for zooming

* add change file

* update docs

* fmt

---------

Co-authored-by: Lucas Nogueira <lucas@tauri.app>

Author: Daedaluz

.changes/mousewheel-zoom.md

@@ -0,0 +1,5 @@
+---
+"tauri": patch:feat
+---
+
+Change webview zoom on mousewheel when the `zoom_hotkeys_enabled` configuration is set to `true`.

crates/tauri/src/webview/mod.rs

@@ -778,13 +778,13 @@ fn main() {
     self
   }
 
-  /// Whether page zooming by hotkeys is enabled
+  /// Whether page zooming by hotkeys and mousewheel should be enabled or not.
   ///
   /// ## Platform-specific:
   ///
   /// - **Windows**: Controls WebView2's [`IsZoomControlEnabled`](https://learn.microsoft.com/en-us/microsoft-edge/webview2/reference/winrt/microsoft_web_webview2_core/corewebview2settings?view=webview2-winrt-1.0.2420.47#iszoomcontrolenabled) setting.
-  /// - **MacOS / Linux**: Injects a polyfill that zooms in and out with `ctrl/command` + `-/=`,
-  ///   20% in each step, ranging from 20% to 1000%. Requires `webview:allow-set-webview-zoom` permission
+  /// - **MacOS / Linux**: Injects a polyfill that zooms in and out with `Ctrl/Cmd + [- = +]` hotkeys or mousewheel events,
+  ///   20% in each step, ranging from 20% to 1000%. Requires `core:webview:allow-set-webview-zoom` permission
   ///
   /// - **Android / iOS**: Unsupported.
   #[must_use]

crates/tauri/src/webview/scripts/zoom-hotkey.js

@@ -26,3 +26,18 @@ window.addEventListener('keydown', (event) => {
     })
   }
 })
+
+window.addEventListener('mousewheel', (event) => {
+  if (event.ctrlKey) {
+    event.preventDefault()
+    if (event.deltaY < 0) {
+      zoomLevel += 0.2
+    } else {
+      zoomLevel -= 0.2
+    }
+    zoomLevel = Math.min(Math.max(zoomLevel, MIN_ZOOM_LEVEL), MAX_ZOOM_LEVEL)
+    window.__TAURI_INTERNALS__.invoke('plugin:webview|set_webview_zoom', {
+      value: zoomLevel
+    })
+  }
+})

crates/tauri/src/webview/webview_window.rs

@@ -890,13 +890,13 @@ impl<R: Runtime, M: Manager<R>> WebviewWindowBuilder<'_, R, M> {
     self
   }
 
-  /// Whether page zooming by hotkeys is enabled
+  /// Whether page zooming by hotkeys and mousewheel should be enabled or not.
   ///
   /// ## Platform-specific:
   ///
   /// - **Windows**: Controls WebView2's [`IsZoomControlEnabled`](https://learn.microsoft.com/en-us/microsoft-edge/webview2/reference/winrt/microsoft_web_webview2_core/corewebview2settings?view=webview2-winrt-1.0.2420.47#iszoomcontrolenabled) setting.
-  /// - **MacOS / Linux**: Injects a polyfill that zooms in and out with `ctrl/command` + `-/=`,
-  ///   20% in each step, ranging from 20% to 1000%. Requires `webview:allow-set-webview-zoom` permission
+  /// - **MacOS / Linux**: Injects a polyfill that zooms in and out with `Ctrl/Cmd + [- = +]` hotkeys or mousewheel events,
+  ///   20% in each step, ranging from 20% to 1000%. Requires `core:webview:allow-set-webview-zoom` permission
   ///
   /// - **Android / iOS**: Unsupported.
   #[must_use]