使用 Microsoft Edge WebDriver 自动执行和测试 WebView2 应用

项目
05/27/2023

本文介绍如何使用用于浏览器测试自动化的 Selenium 框架，使用 Microsoft Edge WebDriver 自动执行和测试 WebView2 应用。

本文提供有关使用 Selenium 框架和 C# 的说明，但你可以使用支持 WebDriver 的任何库、框架和编程语言。若要使用 Selenium 以外的 WebDriver 测试框架完成相同的任务，请参阅所选框架的官方文档。

若要为 WebView2 应用创建模拟用户交互的自动测试，可以使用 Microsoft Edge WebDriver。 Microsoft Edge WebDriver 是 Microsoft 实现 W3C WebDriver 协议。 W3C WebDriver 协议允许程序控制 Web 浏览器的行为。

测试作者编写使用 WebDriver 命令来告知浏览器执行特定操作的测试。 Microsoft Edge WebDriver 接收这些命令，然后要求浏览器执行请求的操作。 Microsoft Edge WebDriver 支持自动执行 Microsoft Edge 浏览器和 WebView2 应用。

有关 WebDriver 协议、作为该协议实现的 Microsoft Edge WebDriver 与 Selenium 测试框架之间的关系，请参阅 WebDriver 概述。

步骤 1：下载 WebView2API 示例

如果没有现有的 WebView2 项目，请克隆 WebView2Samples 存储库，以便下载 WebView2API 示例应用。较大存储库中的该特定示例是最新 WebView2 SDK 的综合示例。请确保满足 WebView2API 示例应用的先决条件。

克隆存储库后，请在 Visual Studio 中生成项目。它应如下图所示。

WebView2API 示例应用

步骤 2：安装 Microsoft Edge WebDriver

按照说明安装 Microsoft Edge WebDriver。 Microsoft Edge WebDriver 是 Selenium 自动执行和测试 WebView2 所需的特定于浏览器的驱动程序。

确保 Microsoft Edge WebDriver 的版本与应用使用的 WebView2 运行时版本匹配。若要使 WebView2API 示例正常工作，请确保 WebView2 运行时的版本大于或等于最新 WebView2 SDK 版本的受支持版本。

若要查找最新的 WebView2 SDK 版本，请参阅 WebView2 SDK 的发行说明。
若要了解当前拥有的 WebView2 运行时版本，请转到 edge://settings/help。

步骤 3：将 Selenium 添加到 WebView2API 示例

至此，你已安装 WebView2 运行时，生成了 WebView2 项目，并安装了 Microsoft Edge WebDriver。接下来，开始使用 Selenium，如下所示。

首先，在 Visual Studio 中创建新的 C# .NET Framework 项目。选择右下角的“ 下一步 ”以继续。
为项目指定项目名称，将其保存到首选位置，然后选择“Create”。

将创建一个新项目，其中所有代码都放置在文件中 Program.cs 。
接下来，将 Selenium 添加到项目;使用 Selenium.WebDriver NuGet 包安装 Selenium，如下所示。若要下载 Selenium.WebDriver NuGet 包，请在 Visual Studio 中选择“项目管理>NuGet 包”。
选择“ 浏览 ”选项卡。将显示以下屏幕。
在 “包源 ”下拉列表中，选择“ nuget.org”。
选中 “包括预发行版 ”复选框。
在搜索栏中键入Selenium.WebDriver，然后从结果中选择“Selenium.WebDriver”。
在右侧的详细信息窗口中，确保“ 版本 ”设置为 4.0.0 或更高版本，然后选择“ 安装”。 NuGet 将 Selenium 下载到计算机。

若要详细了解 Selenium.WebDriver NuGet 包，请参阅 Selenium.WebDriver。

通过在文件 Program.cs的开头添加语句using OpenQA.Selenium.Edge;来使用 OpenQA.Selenium.Edge ：

using OpenQA.Selenium.Edge;

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

现在，你已设置一个适用于 Selenium 测试的空 Visual Studio 项目。接下来，使用“启动”方法或“附加”方法将 Selenium 配置为驱动 WebView2。

步骤 4：选择 Microsoft Edge WebDriver 是应启动应用还是附加到应用

决定是使用“启动”还是“附加”方法将 Selenium 配置为驱动 WebView2。

“启动”方法：在某些情况下，最好让 Microsoft Edge WebDriver 处理 WebView2 应用的启动。 Microsoft Edge WebDriver 启动 WebView2 应用，并自动附加到应用创建的第一个可用 WebView2 实例。
“附加”方法：在其他方案中，适合将 Microsoft Edge WebDriver 附加到正在运行的 WebView2 实例。在 Microsoft Edge WebDriver 外部启动应用，然后将 Microsoft Edge WebDriver 附加到正在运行的 WebView2 实例。此“附加”方法适用于与“启动”方法不兼容的 WebView2 应用。

方法 1：让 Microsoft Edge WebDriver 启动 WebView2 应用

如果你有一个创建单个 WebView2 实例的简单应用，并且该实例在启动时立即处于活动状态，则可以使用“启动”方法;使用步骤 4a：让 Microsoft Edge WebDriver 启动 WebView2 应用。

在此方案中，有一个 WebView2 实例，它在启动时可用，无需浏览任何本机 UI。

方法 2：将 Microsoft Edge WebDriver 附加到正在运行的 WebView2 应用

如果有任何情况不适合上述“启动”方案，则应将 Microsoft Edge WebDriver 附加到正在运行的 WebView2 实例 (而不是让 Microsoft Edge WebDriver 处理 WebView2 启动) ;使用步骤 4b：将 Microsoft Edge WebDriver 附加到正在运行的 WebView2 应用。

不适合“启动”方案的一些示例包括：

在创建 WebView2 实例之前，需要浏览一些本机 UI。
你的应用会创建多个 WebView2 实例，并且你想要附加到特定实例。

在这种情况下，我们建议附加到 WebView2 的特定实例，因为让 Microsoft Edge WebDriver 启动 WebView2 应用仅适用于相对简单的方案。当 Microsoft Edge WebDriver 启动应用时，它会自动附加到创建的第一个 WebView2 实例，如果未找到 WebView2 实例，它将失败。

无论使用“启动”还是“附加”方法，都必须下载 Microsoft Edge WebDriver，并确保版本与应用使用的 WebView2 运行时版本匹配。配置 WebDriver 框架 (（例如 Selenium) ）的初始步骤会因“启动”与“附加”方法而异。

完成启动应用或附加到 WebView2 实例的初始步骤后，你将能够使用任何受支持的 WebDriver 命令与该 WebView2 实例交互。

步骤 4a：让 Microsoft Edge WebDriver 启动 WebView2 应用

如果你有一个创建单个 WebView2 实例且该实例在启动时立即处于活动状态的简单应用，请使用此“启动”方法。在此方案中，有一个 WebView2 实例，它在启动时可用，无需浏览任何本机 UI。

若要使用 Selenium 和 Microsoft Edge WebDriver 驱动 WebView2，请执行以下操作：

通过复制并粘贴以下代码来CreateEdgeOptions对象：
```
static void Main(string[] args)
{
   EdgeOptions eo = new EdgeOptions();
```
接下来，我们将添加执行以下操作的代码：
- 通过将 EdgeOptions 选项设置为 UseWebView ，将实例配置为 true使用 WebView2。
- 设置为 eo.BinaryLocation WebView2 应用二进制文件的文件路径。
- 使用 EdgeOptions 实例CreateEdgeDriver对象。

复制以下代码并将其粘贴到声明行下方 eo ：

//Set the EdgeOptions instance to use WebView2
eo.UseWebView = true;

//Set the BinaryLocation to the filepath of the WebView2API Sample runtime
eo.BinaryLocation = @"C:\path\to\your\webview2\project.exe";
EdgeDriver e = new EdgeDriver(eo);

在上面的代码中，指定项目运行时的正确文件路径和计算机上的 Microsoft Edge WebDriver 运行时。

EdgeDriver 现已配置为在项目中驱动 WebView2。例如，如果使用 WebView2API 示例，则现在可以通过运行 e.Url = @"https://www.microsoft.com"; 命令转到https://microsoft.com代码，如下一个代码列表所示。

验证 Selenium 是否可以驱动 WebView2。为此，请在行 e.Url = @"https://www.microsoft.com";上设置断点，然后运行项目。

   //Navigate the WebView2API Sample from bing.com to microsoft.com
   e.Url = @"https://www.microsoft.com";

   //Exit Microsoft Edge WebDriver
   e.Quit();
}

运行 WebView2 的 Selenium

祝贺你！你已根据“启动”方法，使用 Selenium 和 Microsoft Edge WebDriver 成功自动化 WebView2 项目并驱动 WebView2。

如果使用的是“启动”方法，则这是本文的结尾。

步骤 4b：将 Microsoft Edge WebDriver 附加到正在运行的 WebView2 应用

本部分介绍如何将 Microsoft Edge WebDriver 附加到已运行的 WebView2 实例。如果只有一个 WebView2 实例，或者 WebView2 实例需要浏览某些本机 UI，请使用此部分和方法。

一个问题是，若要自动执行基于 WebView2 的应用，有时首先需要在本机 GUI 中执行一些操作才能启动 WebView2 控件。作为一种解决方案，你需要在 Microsoft Edge WebDriver 外部导航本机 UI，并按某种方式确保显示 WebView2 实例，如下所示。

在此方案中，你有一些本机 UI 进行导航，请使用 Microsoft Edge WebDriver 以外的方法（如命令行脚本）或单独的工具（如 WinAppDriver）启动应用。启动应用进程后，触发 WebView2 实例化，然后将 Microsoft Edge WebDriver 附加到正在运行的 WebView2 实例。

Microsoft Edge WebDriver 不会处理本机 UI 自动化，但下面是一些其他方法，用于导航本机 UI 并显示要自动化的 WebView2 实例：

Windows 应用程序驱动程序 (WinAppDriver) 是一项支持 Windows 应用程序中类似 Selenium 的 UI 测试自动化的服务。此服务支持在Windows 10电脑上测试通用 Windows 平台 (UWP) 、Windows 窗体 (WinForms) 、Windows Presentation Foundation (WPF) 和经典 Windows (Win32) 应用。
直接使用 Microsoft Native UI 自动化。 Microsoft UI 自动化框架允许自动测试脚本与 UI 交互。 Microsoft UI 自动化使 Windows 应用程序能够提供有关用户界面 (UI) 的编程信息。它提供对桌面上大多数 UI 元素的编程访问。它使辅助技术产品（如屏幕阅读器）能够向最终用户提供有关 UI 的信息，并通过标准输入和标准输入以外的方式操作 UI。
使用命令行参数或环境变量等标志来指示应用直接启动到 WebView2 实例，以避免需要导航本机 UI。根据你的方案，这可以使用步骤 4a：让 Microsoft Edge WebDriver 启动 WebView2 应用中所述的“启动”方法。

除了确保 WebView2 实例已激活外，还需要设置其 --remote-debugging-port 命令行参数。我们将在以下步骤中执行此操作。 Microsoft Edge WebDriver 将使用此远程调试端口连接到 WebView2 实例。

启动启用了远程调试的 WebView2 应用

对应用进行编码时，将执行下一步。在实例化 WebView2 控件时，需要提供此额外的命令行参数。启用远程调试，如下所示。

使用 WebView2 Win32 C++ 参考中的全局建议方法之一，使用--remote-debugging-port=<port>其他命令行参数配置 WebView2 实例。为此参数选择可用的端口号。
启动应用。如何启动应用取决于你使用的其他本机 UI 测试工具。

此时，应用正在运行，并且 --remote-debugging-port 其命令行参数已设置。接下来，我们将 Microsoft Edge WebDriver 附加到已启动的 WebView2 应用。

将 Microsoft Edge WebDriver 附加到启动的 WebView2 应用

EdgeOptions.DebuggerAddress使用属性指示 Microsoft Edge WebDriver 连接到之前指定的远程调试端口，而不是启动新应用程序：

EdgeOptions eo = new EdgeOptions();
eo.UseWebView = true;
eo.DebuggerAddress = "localhost:9222";
EdgeDriver e = new EdgeDriver(eo);

在 localhost:9222 上述位置，此行上提供的端口号应与在上述设置 --remote-debugging-port 时选择的端口号匹配。

有关对象的 DebuggerAddress 属性 EdgeOptions 的详细信息，请参阅 EdgeOptions 对象。

对于 UWP 应用，请使用远程工具将 Microsoft Edge WebDriver 附加到 WebView2

执行使用 Microsoft Edge 远程工具远程调试 UWP 应用中的步骤。

此 WebView2 功能目前仅在 Microsoft Edge 的 Canary 预览频道中受支持。设置环境变量 WEBVIEW2_RELEASE_CHANNEL_PREFERENCE=1，以确保 WebView2 版本为 Canary。有关详细信息，请参阅测试即将推出的 API 和功能中的如何设置环境变量。
启动 UWP WebView2 应用后，请转到 http://<Device Portal URL>/msedge。例如，以下屏幕截图显示 localhost:50080/msedge：
browserProcessId请注意要将 Microsoft Edge WebDriver 附加到的 WebView2 进程的。例如，上面的屏幕截图显示 browserProcessId 为 47860。

在代码中，使用 wdpAddress 和 wdpProcessId 属性告知 Microsoft Edge WebDriver 连接到 Microsoft Edge 远程工具以及特定的 WebView2 进程。

wdpAddress 定义为设备门户 URL。
wdpProcessId 定义为在 browserProcessId 上一步中记录的值：

EdgeOptions eo = new EdgeOptions();
eo.AddAdditionalEdgeOption("wdpAddress", "localhost:50080");
eo.AddAdditionalEdgeOption("wdpProcessId", 47860);
// Optional user name and password to use when connecting to a Windows Device Portal
// server.  Required if the server has authentication enabled.
// eo.AddAdditionalEdgeOption("wdpUsername", "username");
// eo.AddAdditionalEdgeOption("wdpPassword", "password");
EdgeDriver e = new EdgeDriver(eo);

有关使用远程工具启动 WebView2 UWP 应用的详细信息，请参阅使用 Microsoft Edge 远程工具远程调试 UWP 应用。

祝贺你！已成功将 Microsoft Edge WebDriver 附加到正在运行的 WebView2 应用。

UWP 项目和调试

若要在启动时配置调试设置，必须使用注册表在启动时为所有 WebView2 进程启用调试。由于 UWP 项目的启动方式，WebDriver2 控件无法在启动时自动配置调试设置。请注意，设置此注册表项可在配置此环境变量时启用对所有启动的 WebView2 进程的调试支持。

可以通过WEBVIEW2_ADDITIONAL_BROWSER_ARGUMENTS注册表项中指定的值替代参数。有关WEBVIEW2_ADDITIONAL_BROWSER_ARGUMENTS注册表项 (和等效环境变量) 的信息，请参阅 CreateCoreWebView2EnvironmentWithOptions in Globals。 WEBVIEW2_ADDITIONAL_BROWSER_ARGUMENTS注册表项 (也是一个环境变量名称，) 允许将添加到命令行参数，这些参数将在启动时传递给 WebView2 运行时浏览器进程。

另请参阅

Selenium 上的 WebDriver 文档 - API Selenium 如何驱动 WebView2 或 Microsoft Edge。
Microsoft Edge WebView2 简介 - 如何使用 WebView2 控件在本机应用中嵌入 Web 内容。
使用 WebDriver 进行测试自动化 - 自动执行 Microsoft Edge。

通过