设置
此示例应用程序仅关注向现有项目添加 WebDriver 测试。为了在下面的两个部分中有项目可测试,我们将设置一个极小的 Tauri 应用程序用于我们的测试。我们不会使用 Tauri CLI,任何前端依赖或构建步骤,也不会在之后捆绑应用程序。这是为了展示如何向现有应用程序添加 WebDriver 测试的的最小方案。
如果您只想查看本示例指南中将展示的完整示例项目,则可以查看 https://github.com/chippers/hello_tauri。
初始化 Cargo 项目
我们想创建一个新的二进制 Cargo 项目来存放此示例应用程序。我们可以使用命令行中的 cargo new hello-tauri-webdriver --bin
来轻松完成此操作,这将为我们的应用程序生成一个最小二进制 Cargo 项目。此目录将作为本指南剩余部分的开发目录,所以请确保您运行的所有命令都位于此新的 hello-tauri-webdriver/
目录中。
创建最小前端
我们将创建一个极小的 HTML 文件作为我们示例应用程序的前端。在我们执行 WebDriver 测试的过程中,我们还将使用一些来自前端的元素。
首先,让我们创建我们的 Tauri distDir
,这是我们将在构建应用程序的 Tauri 部分时需要的。使用 mkdir dist
命令应该会在当前目录下创建一个名为 dist/
的新目录,我们将在此目录中放置下面的 index.html
文件。
dist/index.html
:
<!doctype html><html lang="en"> <head> <meta charset="UTF-8" /> <title>Hello Tauri!</title> <style> body { /* Add a nice colorscheme */ background-color: #222831; color: #ececec;
/* Make the body the exact size of the window */ margin: 0; height: 100vh; width: 100vw;
/* Vertically and horizontally center children of the body tag */ display: flex; justify-content: center; align-items: center; } </style> </head> <body> <h1>Hello, Tauri!</h1> </body></html>
将 Tauri 添加到 Cargo 项目
接下来,我们将需要添加必要的条目,将我们的 Cargo 项目转变为 Tauri 项目。首先是向 Cargo 清单文件 (Cargo.toml
) 添加依赖项,以便 Cargo 在构建时知道要拉入我们的依赖项。
Cargo.toml
:
[package]name = "hello-tauri-webdriver"version = "0.1.0"edition = "2021"rust-version = "1.56"
# Needed to set up some things for Tauri at build time[build-dependencies]tauri-build = "1"
# The actual Tauri dependency, along with `custom-protocol` to serve the pages.[dependencies]tauri = { version = "1", features = ["custom-protocol"] }
# Make --release build a binary that is small (opt-level = "s") and fast (lto = true).# This is completely optional, but shows that testing the application as close to the# typical release settings is possible. Note: this will slow down compilation.[profile.release]incremental = falsecodegen-units = 1panic = "abort"opt-level = "s"lto = true
如您所见,我们添加了一个 [build-dependency]
。为了使用此构建依赖项,我们必须从一个构建脚本中使用它。我们正在初始化一个我们现在位于 build.rs
。
build.rs
:
fn main() { // Only watch the `dist/` directory for recompiling, preventing unnecessary // changes when we change files in other project subdirectories. println!("cargo:rerun-if-changed=dist");
// Run the Tauri build-time helpers tauri_build::build()}
我们的货运项目现在已经知道如何拉入和构建我们的 Tauri 依赖项,以及所有这些设置。让我们通过在实际项目代码中设置 Tauri 来使这个最小示例成为一个 Tauri 应用程序。我们将编辑 src/main.rs
文件以添加这个 Tauri 功能。
src/main.rs
:
fn main() { tauri::Builder::default() .run(tauri::generate_context!()) .expect("unable to run Tauri application");}
很简单,对吧?
Tauri 配置
要成功构建应用程序,我们需要两样东西。首先,我们需要一个图标文件。您可以为此部分使用任何 PNG 并将其复制到 icon.png
。通常,当您使用 Tauri CLI 创建项目时,这将作为结构化部分提供。要获取默认的 Tauri 图标,我们可以使用命令 curl -L "https://github.com/chippers/hello_tauri/raw/main/icon.png" --output icon.png
下载 Hello Tauri 示例存储库中使用的图标。
我们还需要一个 tauri.conf.json
来设置一些重要的 Tauri 配置值。同样,这通常来自 tauri init
结构化命令,但我们将在这里创建自己的最小配置。
tauri.conf.json
:
{ "build": { "distDir": "dist" }, "tauri": { "bundle": { "identifier": "studio.tauri.hello_tauri_webdriver", "icon": ["icon.png"] }, "allowlist": { "all": false }, "windows": [ { "width": 800, "height": 600, "resizable": true, "fullscreen": false } ] }}
我将介绍一下这些配置。您可以看到,我们之前创建的 dist/
目录被指定为 distDir
属性。我们设置了一个捆绑标识符,以便构建的应用程序具有唯一的 ID,并将 icon.png
设置为唯一的图标。我们不使用任何 Tauri API 或功能,因此在 allowlist
中将其禁用,设置 "all": false
。窗口值仅设置一个具有一些合理默认值的单一窗口。
到目前为止,我们有一个基本的 Hello World 应用程序,在运行时应显示一个简单的问候。
运行示例应用程序
为了确保我们设置正确,让我们构建这个应用程序!我们将以 --release
应用程序的形式运行它,因为我们还将使用发布配置运行我们的 WebDriver 测试。运行 cargo run --release
,在编译一段时间后,我们应该看到以下应用程序弹出。

注意:如果您正在修改应用程序并想使用 Devtools,那么无需 --release
运行它,在右键菜单中应可获得“检查元素”选项。
我们现在应该准备好使用一些 WebDriver 框架开始测试这个应用程序。本指南将按顺序介绍 WebdriverIO 和 Selenium。
© 2025 Tauri 贡献者. CC-BY / MIT