在无头浏览器中测试
通过环境变量配置
默认情况下,测试在 Node.js 上运行。要以浏览器为目标,可以使用 WASM_BINDGEN_USE_BROWSER
环境变量
WASM_BINDGEN_USE_BROWSER=1 cargo test --target wasm32-unknown-unknown
以下配置可用
WASM_BINDGEN_USE_DEDICATED_WORKER
:用于专用 workerWASM_BINDGEN_USE_SHARED_WORKER
:用于共享 workerWASM_BINDGEN_USE_SERVICE_WORKER
:用于服务 workerWASM_BINDGEN_USE_DENO
:用于 DenoWASM_BINDGEN_USE_NODE_EXPERIMENTAL
:用于 Node.js,但作为 ES 模块
强制配置
也可以使用 wasm_bindgen_test_configure!
宏强制测试在特定环境中运行
# #![allow(unused_variables)] #fn main() { use wasm_bindgen_test::wasm_bindgen_test_configure; // Run in a browser. wasm_bindgen_test_configure!(run_in_browser); // Or run in a dedicated worker. wasm_bindgen_test_configure!(run_in_dedicated_worker); // Or run in a shared worker. wasm_bindgen_test_configure!(run_in_shared_worker); // Or run in a service worker. wasm_bindgen_test_configure!(run_in_service_worker); // Or run in Node.js but as an ES module. wasm_bindgen_test_configure!(run_in_node_experimental); #}
请注意,这将忽略任何设置的环境变量。
配置使用哪个浏览器
要控制用于无头测试的浏览器,请使用 wasm-pack test
的相应标志
-
wasm-pack test --chrome
— 在 Chrome 中运行测试。此机器必须安装 Chrome。 -
wasm-pack test --firefox
— 在 Firefox 中运行测试。此机器必须安装 Firefox。 -
wasm-pack test --safari
— 在 Safari 中运行测试。此机器必须安装 Safari。
如果传递了多个浏览器标志,则将在每个浏览器下运行测试。
在无头浏览器中运行测试
一旦配置为在无头浏览器中运行测试,只需使用适当的浏览器标志和 --headless
运行 wasm-pack test
wasm-pack test --headless --chrome --firefox --safari
配置无头浏览器功能
将文件 webdriver.json
添加到你的 crate 的根目录。每个浏览器都有自己的功能部分。例如
{
"moz:firefoxOptions": {
"prefs": {
"media.navigator.streams.fake": true,
"media.navigator.permission.disabled": true
},
"args": []
},
"goog:chromeOptions": {
"args": [
"--use-fake-device-for-media-stream",
"--use-fake-ui-for-media-stream"
]
}
}
可以找到完整的支持功能列表
请注意,对于这两个浏览器,headless
参数始终处于启用状态。
调试无头浏览器测试
省略 --headless
标志将禁用无头模式,并允许你在浏览器的开发工具中调试失败的测试。
附录:在没有 wasm-pack
的情况下在无头浏览器中测试
⚠️ 使用 wasm-bindgen-test
的推荐方法是使用 wasm-pack
,因为它将处理安装测试运行器、为你的浏览器安装 WebDriver 客户端,并通知 cargo
如何使用自定义测试运行器。 但是,如果你愿意,你也可以自己管理这些任务。
配置使用哪个浏览器
如果设置了以下环境变量之一,则将使用相应的 WebDriver 和浏览器。如果没有设置这些环境变量,则会在 $PATH
中搜索合适的 WebDriver 实现。
GECKODRIVER=path/to/geckodriver
使用 Firefox 进行无头浏览器测试,并使用 geckodriver
作为其 WebDriver。
firefox
二进制文件必须在你的 $PATH
中。
CHROMEDRIVER=path/to/chromedriver
使用 Chrome 进行无头浏览器测试,并使用 chromedriver
作为其 WebDriver。
chrome
二进制文件必须在你的 $PATH
中。
SAFARIDRIVER=path/to/safaridriver
使用 Safari 进行无头浏览器测试,并使用 safaridriver
作为其 WebDriver。
默认情况下,此驱动程序安装在 Mac OS 上。它应该能够默认找到你的 Safari 安装。
在远程无头浏览器中运行测试
测试可以在远程 webdriver 上运行。为此,上述环境变量必须设置为远程 webdriver 的 URL。例如
CHROMEDRIVER_REMOTE=http://remote.host/
在无头浏览器中运行测试
一旦配置为在无头浏览器中运行测试并设置了适当的环境变量,执行无头浏览器的测试与执行 Node.js 的测试相同
cargo test --target wasm32-unknown-unknown
调试无头浏览器测试
设置 NO_HEADLESS=1
环境变量,浏览器测试将不会以无头模式运行。相反,测试将启动一个本地服务器,你可以在你选择的 Web 浏览器中访问该服务器,不应使用无头测试。然后,你可以使用浏览器的开发工具进行调试。