From 2255af1c457c56e4c297545d89a74cd7056c202c Mon Sep 17 00:00:00 2001
From: abichinger <andreas.bichinger@gmail.com>
Date: Thu, 2 May 2024 13:48:50 +0200
Subject: [PATCH] [v3] Add `port` flag to dev command (#3429)

* Add `port` flag to dev command, ...

Add support for environment variable WAILS_VITE_PORT

* Check if port is already in use

* Update changelog

---------

Co-authored-by: Lea Anthony <lea.anthony@gmail.com>
---
 mkdocs-website/docs/en/changelog.md           |  1 +
 v3/internal/commands/dev.go                   | 53 +++++++++++++++++++
 v3/internal/commands/task_wrapper.go          |  7 +--
 .../templates/_common/Taskfile.tmpl.yml       |  8 ++-
 4 files changed, 59 insertions(+), 10 deletions(-)
 create mode 100644 v3/internal/commands/dev.go

diff --git a/mkdocs-website/docs/en/changelog.md b/mkdocs-website/docs/en/changelog.md
index a69beb7b8..77377d292 100644
--- a/mkdocs-website/docs/en/changelog.md
+++ b/mkdocs-website/docs/en/changelog.md
@@ -32,6 +32,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Add ESM exports from the bundled JS runtime script by [@fbbdev](https://github.com/fbbdev) in [#3295](https://github.com/wailsapp/wails/pull/3295)
 - Add binding generator flag for using the bundled JS runtime script instead of the npm package by [@fbbdev](https://github.com/fbbdev) in [#3334](https://github.com/wailsapp/wails/pull/3334)
 - Implement `setIcon` on linux by [@abichinger](https://github.com/abichinger) in [#3354](https://github.com/wailsapp/wails/pull/3354)
+- Add flag `-port` to dev command and support environment variable `WAILS_VITE_PORT` by [@abichinger](https://github.com/abichinger) in [#3429](https://github.com/wailsapp/wails/pull/3429)
 - Add tests for bound method calls by [@abichinger](https://github.com/abichinger) in [#3431](https://github.com/wailsapp/wails/pull/3431)
 
 ### Fixed
diff --git a/v3/internal/commands/dev.go b/v3/internal/commands/dev.go
new file mode 100644
index 000000000..a6920b2f1
--- /dev/null
+++ b/v3/internal/commands/dev.go
@@ -0,0 +1,53 @@
+package commands
+
+import (
+	"fmt"
+	"net"
+	"os"
+	"strconv"
+
+	"github.com/wailsapp/wails/v3/internal/flags"
+)
+
+const defaultVitePort = 9245
+const wailsVitePort = "WAILS_VITE_PORT"
+
+type DevOptions struct {
+	flags.Common
+
+	Config   string `description:"The config file including path" default:"./build/devmode.config.toml"`
+	VitePort int    `name:"port" description:"Specify the vite dev server port"`
+}
+
+func Dev(options *DevOptions) error {
+	host := "localhost"
+
+	// flag takes precedence over environment variable
+	var port int
+	if options.VitePort != 0 {
+		port = options.VitePort
+	} else if p, err := strconv.Atoi(os.Getenv(wailsVitePort)); err == nil {
+		port = p
+	} else {
+		port = defaultVitePort
+	}
+
+	// check if port is already in use
+	l, err := net.Listen("tcp", fmt.Sprintf("%s:%d", host, port))
+	if err != nil {
+		return err
+	}
+	if err = l.Close(); err != nil {
+		return err
+	}
+
+	// Set environment variable for the dev:frontend task
+	os.Setenv(wailsVitePort, strconv.Itoa(port))
+
+	// Set url of frontend dev server
+	os.Setenv("FRONTEND_DEVSERVER_URL", fmt.Sprintf("http://%s:%d", host, port))
+
+	return Watcher(&WatcherOptions{
+		Config: options.Config,
+	})
+}
diff --git a/v3/internal/commands/task_wrapper.go b/v3/internal/commands/task_wrapper.go
index 56b4a131e..896be3550 100644
--- a/v3/internal/commands/task_wrapper.go
+++ b/v3/internal/commands/task_wrapper.go
@@ -1,19 +1,16 @@
 package commands
 
 import (
+	"os"
+
 	"github.com/pterm/pterm"
 	"github.com/wailsapp/wails/v3/internal/flags"
-	"os"
 )
 
 func Build(_ *flags.Build) error {
 	return wrapTask("build")
 }
 
-func Dev(_ *flags.Dev) error {
-	return wrapTask("dev")
-}
-
 func Package(_ *flags.Package) error {
 	return wrapTask("package")
 }
diff --git a/v3/internal/templates/_common/Taskfile.tmpl.yml b/v3/internal/templates/_common/Taskfile.tmpl.yml
index 5ef58f388..8d476fe3d 100644
--- a/v3/internal/templates/_common/Taskfile.tmpl.yml
+++ b/v3/internal/templates/_common/Taskfile.tmpl.yml
@@ -3,6 +3,7 @@ version: '3'
 vars:
   APP_NAME: "{{.ProjectName}}"
   BIN_DIR: "bin"
+  VITE_PORT: {{ "'{{.WAILS_VITE_PORT | default 9245}}'" }}
 
 tasks:
 
@@ -431,15 +432,12 @@ tasks:
     deps:
       - task: install:frontend:deps
     cmds:
-      - npm run dev
+      - npm run dev -- --port {{ "{{.VITE_PORT}}" }} --strictPort
 
   dev:
     summary: Runs the application in development mode
     cmds:
-      - wails3 tool watcher -config ./build/devmode.config.toml
-    env:
-      # This is the default vite dev server port
-      FRONTEND_DEVSERVER_URL: 'http://localhost:5173'
+      - wails3 dev -config ./build/devmode.config.toml -port {{ "{{.VITE_PORT}}" }}
 
   dev:reload:
     summary: Reloads the application