Added support for tauriserial

Author: haslinghuis

eslint.config.js

@@ -47,13 +47,26 @@ export default defineConfig([
                 },
             ],
         },
-        ignores: ["dist/", "*.json", "*.html", "*.less", "*.css", "package.json"],
+        ignores: [
+            "dist/",
+            "src/dist/",
+            "**/dist/**",
+            "**/src/dist/**",
+            "*.json",
+            "*.html",
+            "*.less",
+            "*.css",
+            "package.json",
+        ],
     },
     {
         files: ["**/*.vue"],
         languageOptions: {
             parser: vueParser,
         },
+        plugins: {
+            vue: vuePlugin,
+        },
         processor: "vue/vue",
     },
 ]);

package.json

@@ -70,7 +70,7 @@
     "@capacitor/core": "^7.0.1",
     "@fortawesome/fontawesome-free": "^6.5.2",
     "@tauri-apps/api": "^2.5.0",
-    "@tauri-apps/cli": "^2.5.0",
+  "@tauri-apps/cli": "^2.5.0",
     "@vitejs/plugin-vue": "^6.0.1",
     "crypto-es": "^2.1.0",
     "d3": "^7.9.0",

src-tauri/Cargo.lock

@@ -18,6 +18,7 @@ tauri-build = { version = "2.5", features = [] }
 [dependencies]
 tauri = { version = "2.5", features = [] }
 tauri-plugin-shell = "2.3"
+tauri-plugin-serialplugin = "2.11"
 serde = { version = "1.0", features = ["derive"] }
 serde_json = "1.0"
 

src-tauri/Cargo.toml

@@ -5,6 +5,7 @@
   "windows": ["*"],
   "permissions": [
     "core:default",
-    "shell:allow-open"
+    "shell:allow-open",
+    "serialplugin:default"
   ]
 }

src-tauri/capabilities/default.json

@@ -3,6 +3,7 @@
 fn mobile_entry() {
     tauri::Builder::default()
         .plugin(tauri_plugin_shell::init())
+    .plugin(tauri_plugin_serialplugin::init())
         .run(tauri::generate_context!())
         .expect("error while running tauri application");
 }

src-tauri/src/lib.rs

@@ -6,6 +6,7 @@
 fn main() {
     tauri::Builder::default()
         .plugin(tauri_plugin_shell::init())
+    .plugin(tauri_plugin_serialplugin::init())
         .run(tauri::generate_context!())
         .expect("error while running tauri application");
 }

src-tauri/src/main.rs

@@ -3,6 +3,7 @@ import { EventBus } from "../components/eventBus";
 import { serial } from "./serial.js";
 import WEBUSBDFU from "./protocols/webusbdfu";
 import { reactive } from "vue";
+import { isTauri } from "@tauri-apps/api/core";
 import {
     checkBrowserCompatibility,
     checkWebBluetoothSupport,
@@ -37,7 +38,8 @@ const PortHandler = new (function () {
     checkBrowserCompatibility();
 
     this.showBluetoothOption = checkWebBluetoothSupport();
-    this.showSerialOption = checkWebSerialSupport();
+    // In Tauri, native serial is available via plugin even if Web Serial API isn't.
+    this.showSerialOption = checkWebSerialSupport() || isTauri();
     this.showUsbOption = checkWebUSBSupport();
 
     console.log(`${this.logHead} Bluetooth available: ${this.showBluetoothOption}`);
@@ -47,23 +49,30 @@ const PortHandler = new (function () {
     this.showVirtualMode = getConfig("showVirtualMode", false).showVirtualMode;
     this.showManualMode = getConfig("showManualMode", false).showManualMode;
     this.showAllSerialDevices = getConfig("showAllSerialDevices", false).showAllSerialDevices;
+    // Decide which serial protocol to prefer at runtime
+    this.serialProtocol = isTauri() ? "tauriserial" : "webserial";
+    console.log(`${this.logHead} ### Using serial protocol: ${this.serialProtocol}`);
 })();
 
 PortHandler.initialize = function () {
     EventBus.$on("ports-input:request-permission-bluetooth", () => this.requestDevicePermission("webbluetooth"));
-    EventBus.$on("ports-input:request-permission-serial", () => this.requestDevicePermission("webserial"));
+    EventBus.$on("ports-input:request-permission-serial", () => this.requestDevicePermission(this.serialProtocol));
     EventBus.$on("ports-input:request-permission-usb", () => this.requestDevicePermission("usb"));
     EventBus.$on("ports-input:change", this.onChangeSelectedPort.bind(this));
 
     // Use serial for all protocol events
     serial.addEventListener("addedDevice", (event) => {
         const detail = event.detail;
+        const proto = (detail?.protocolType || "").toLowerCase();
 
-        if (detail?.path?.startsWith("bluetooth")) {
+        if (detail?.path?.startsWith("bluetooth") || proto === "webbluetooth") {
             this.handleDeviceAdded(detail, "webbluetooth");
+        } else if (proto === "tauriserial") {
+            this.handleDeviceAdded(detail, "tauriserial");
         } else {
             this.handleDeviceAdded(detail, "webserial");
         }
+        console.log(`${this.logHead} #### Device addition event received:`, event.detail, proto);
     });
 
     serial.addEventListener("removedDevice", (event) => {
@@ -81,7 +90,7 @@ PortHandler.initialize = function () {
 PortHandler.refreshAllDeviceLists = async function () {
     // Update all device lists in parallel
     return Promise.all([
-        this.updateDeviceList("webserial"),
+        this.updateDeviceList(this.serialProtocol),
         this.updateDeviceList("webbluetooth"),
         this.updateDeviceList("usb"),
     ]).then(() => {
@@ -108,11 +117,12 @@ PortHandler.removedSerialDevice = function (device) {
 
     // Get device path safely
     const devicePath = device?.path || (typeof device === "string" ? device : null);
+    const proto = (device?.protocolType || "").toLowerCase();
 
     if (!devicePath) {
         console.warn(`${this.logHead} Device removal event missing path information`, device);
         // Still update ports, but don't try to use the undefined path
-        this.updateDeviceList("webserial").then(() => {
+        this.updateDeviceList(this.serialProtocol).then(() => {
             this.selectActivePort();
         });
         return;
@@ -121,7 +131,7 @@ PortHandler.removedSerialDevice = function (device) {
     // Update the appropriate ports list based on the device type
     const updatePromise = devicePath.startsWith("bluetooth")
         ? this.updateDeviceList("webbluetooth")
-        : this.updateDeviceList("webserial");
+        : this.updateDeviceList(proto === "tauriserial" ? "tauriserial" : "webserial");
 
     const wasSelectedPort = this.portPicker.selectedPort === devicePath;
 
@@ -274,7 +284,9 @@ PortHandler.handleDeviceAdded = function (device, deviceType) {
 
     // Update the appropriate device list
     const updatePromise =
-        deviceType === "webbluetooth" ? this.updateDeviceList("webbluetooth") : this.updateDeviceList("webserial");
+        deviceType === "webbluetooth"
+            ? this.updateDeviceList("webbluetooth")
+            : this.updateDeviceList(deviceType === "tauriserial" ? "tauriserial" : "webserial");
 
     updatePromise.then(() => {
         const selectedPort = this.selectActivePort(device);
@@ -310,6 +322,11 @@ PortHandler.updateDeviceList = async function (deviceType) {
                     ports = await serial.getDevices("webserial");
                 }
                 break;
+            case "tauriserial":
+                if (this.showSerialOption) {
+                    ports = await serial.getDevices("tauriserial");
+                }
+                break;
             default:
                 console.warn(`${this.logHead} Unknown device type: ${deviceType}`);
                 return [];
@@ -331,6 +348,7 @@ PortHandler.updateDeviceList = async function (deviceType) {
                 console.log(`${this.logHead} Found DFU port(s)`, orderedPorts);
                 break;
             case "webserial":
+            case "tauriserial":
                 this.portAvailable = orderedPorts.length > 0;
                 this.currentSerialPorts = [...orderedPorts];
                 console.log(`${this.logHead} Found serial port(s)`, orderedPorts);