本教程旨在解决laravel Dusk自动化测试中遇到的浏览器权限问题，特别是涉及剪贴板等需要用户授权的场景。文章将详细介绍如何利用`chromeDevToolsDriver`在Dusk测试运行时动态授予特定浏览器权限，从而确保测试流程的顺畅执行，并提供可复用的代码示例，帮助开发者高效地管理和配置测试环境中的权限设置。
引言：Laravel Dusk测试中的浏览器权限挑战
Laravel Dusk作为一款强大的浏览器自动化测试工具，旨在模拟真实用户与web应用程序的交互。然而，在模拟过程中，当Web应用程序尝试访问某些敏感的浏览器功能（如剪贴板、地理位置、通知等）时，真实的浏览器通常会弹出权限请求对话框，询问用户是否允许。在自动化测试环境中，这些权限弹窗无法通过人工点击来处理，从而导致测试流程中断或失败，使得依赖这些功能的应用部分难以进行有效的端到端测试。
以剪贴板访问为例，当测试一个“复制链接”功能时，如果浏览器没有被授予剪贴板读写权限，测试将无法验证内容是否成功复制，或者会因权限不足而抛出错误。传统的Dusk配置方式通常不直接提供管理这些细粒度浏览器权限的接口。
解决方案核心：利用chrome devtools Protocol
解决Dusk测试中浏览器权限问题的关键在于利用Chrome DevTools Protocol (CDP)。CDP是Chrome浏览器提供的一套API，允许开发者工具或其他客户端与浏览器进行深入交互，控制浏览器的各种行为，包括但不限于网络请求、dom操作、调试以及，最重要的是，管理浏览器权限。
Laravel Dusk底层使用WebDriver（通常是ChromeDriver）来驱动Chrome浏览器。facebookWebDriverChromeChromeDevToolsDriver是WebDriver库提供的一个扩展，它允许我们通过WebDriver实例来执行CDP命令。通过这种方式，我们可以在Dusk测试运行时，向浏览器发送命令，动态地授予或撤销特定权限。
实现权限授予功能
为了在Dusk测试中方便地授予权限，我们可以在项目的tests/DuskTestCase.php文件中添加一个辅助方法。这个方法将封装通过ChromeDevToolsDriver执行CDP命令的逻辑。
首先，确保你的DuskTestCase类中引入了必要的命名空间：
<?php namespace Tests; use FacebookWebDriverChromeChromeDevToolsDriver; use LaravelDuskBrowser; use FacebookWebDriverRemoteRemoteWebDriver; // 引入RemoteWebDriver abstract class DuskTestCase extends BaseTestCase { // ... 其他DuskTestCase内容 ... /** * 授予浏览器特定权限。 * * @param Browser $browser 当前的Dusk浏览器实例。 * @param array $permissions 要授予的权限数组，例如 ["clipboardReadWrite", "geolocation"]。 * @param string|null $origin 权限作用域的源URL，如果为null则默认为当前页面源。 * @return array|null CDP命令执行结果，或在失败时返回null。 */ protected function grantPermission(Browser $browser, array $permissions, ?string $origin = null): ?array { try { /** @var RemoteWebDriver $driver */ $driver = $browser->driver; $devtools = new ChromeDevToolsDriver($driver); // 如果未指定origin，尝试获取当前URL作为origin if ($origin === null) { try { $currentUrl = $driver->getCurrentURL(); $parsedUrl = parse_url($currentUrl); if (isset($parsedUrl['scheme']) && isset($parsedUrl['host'])) { $origin = $parsedUrl['scheme'] . '://' . $parsedUrl['host']; if (isset($parsedUrl['port'])) { $origin .= ':' . $parsedUrl['port']; } } else { // 如果无法解析当前URL，则不设置origin参数，让CDP使用默认行为 $origin = ''; // 设置为空字符串，表示不明确指定origin，CDP会根据上下文处理 } } catch (Exception $e) { // 捕获获取当前URL时的异常，例如页面未加载 error_log("Failed to get current URL for origin: " . $e->getMessage()); $origin = ''; } } $params = [ "permissions" => $permissions, ]; // 只有当origin有效时才添加到参数中 if (!empty($origin)) { $params["origin"] = $origin; } // 执行Browser.grantPermissions命令 $result = $devtools->execute('Browser.grantPermissions', $params); return $result; } catch (Exception $e) { // 捕获异常，例如权限名称错误、DevTools协议通信失败或WebDriver错误 error_log("Failed to grant permissions: " . $e->getMessage()); return null; } } }代码解析：
- $browser->driver: 获取当前Dusk浏览器实例底层的RemoteWebDriver对象。这是与Chrome浏览器进行实际通信的接口。
- new ChromeDevToolsDriver($driver): 使用RemoteWebDriver实例创建一个ChromeDevToolsDriver对象。这个对象提供了执行CDP命令的方法。
- $devtools->execute(‘Browser.grantPermissions’, $params): 这是核心操作。它调用CDP的Browser.grantPermissions命令。
- “permissions”: 这是一个数组，包含你希望授予的权限字符串。例如，”clipboardReadWrite”用于剪贴板读写，”clipboardSanitizedWrite”用于安全的剪贴板写入。其他常见权限包括”geolocation”（地理位置）、”notifications”（通知）、”camera”（摄像头）、”microphone”（麦克风）等。
- “origin”: 这是一个可选参数，用于指定权限生效的Web源（例如 https://example.com）。明确指定origin可以确保权限仅在预期域下生效，提高测试的精确性。如果未指定，代码会尝试从当前URL解析，或留空让CDP自行处理。
- try-catch块：用于捕获执行CDP命令时可能发生的异常，例如权限名称不正确或与DevTools协议通信失败。
在测试用例中使用权限授予功能
一旦grantPermission方法被添加到DuskTestCase中，你就可以在任何Dusk测试用例中调用它，以便在执行需要特定权限的操作之前授予权限。
以下是一个测试剪贴板功能的示例：
<?php namespace TestsBrowser; use LaravelDuskBrowser; use TestsDuskTestCase; // 确保引用了你的DuskTestCase class ClipboardTest extends DuskTestCase { /** * 测试Web应用中的剪贴板复制功能。 * * @return void */ public function testClipboardCopyFunctionality() { $this->browse(function (Browser $browser) { // 1. 在执行需要剪贴板权限的操作之前，授予剪贴板读写权限。 // 我们可以同时授予多个权限，例如： $this->grantPermission($browser, ["clipboardReadWrite", "clipboardSanitizedWrite"]); // 2. 导航到包含复制按钮的页面。 $browser->visit('/copy-feature') ->waitForText('Copy Link Feature'); // 等待页面加载完成 // 3. 点击复制按钮。假设页面上有一个带有data-dusk="copy-button"的按钮。 $browser->click('@copy-button'); // 4. 验证剪贴板内容。 // 直接从浏览器会话读取剪贴板内容通常需要更复杂的DevTools命令或javaScript注入。 // 一种常见的做法是，如果前端js在复制后将内容存储在一个隐藏的输入框或某个可访问的JS变量中， // 我们可以尝试通过Dusk的script方法来获取。 // 假设你的前端JS在复制成功后，会将内容设置到一个id为"clipboard-output"的隐藏input中： $clipboardContent = $browser->script('return document.getElementById("clipboard-output").value;')[0]; $this->assertEquals('https://example.com/some-link-to-copy', $clipboardContent); // 5. 也可以验证ui上的反馈，例如显示“已复制”提示。 $browser->assertSee('Link copied to clipboard!'); }); } /** * 测试另一个需要地理位置权限的功能。 * * @return void */ public function testGeolocationFeature() { $this->browse(function (Browser $browser) { // 授予地理位置权限 $this->grantPermission($browser, ["geolocation"]); $browser->visit('/map-feature') ->waitForText('Your Location'); // 模拟用户点击允许地理位置，或者等待地理位置API自动获取 // 进一步的断言取决于你的应用如何处理地理位置数据 $browser->assertSee('Displaying map based on your location'); }); } }使用说明：
- 在$this->browse(function (Browser $browser) { … });闭包内部，在执行任何需要特定权限的操作之前调用$this->grantPermission(…)方法。
- $permissions数组应包含所需的CDP权限字符串。
- $origin参数可以精确控制权限生效的域。在多域测试中这尤其有用。
注意事项与最佳实践
- 权限作用域： 授予的权限通常仅对当前浏览器会话和指定的origin有效。每次测试运行或浏览器实例启动时，可能需要重新授予。
- 可用权限列表： 查阅Chrome DevTools Protocol文档（特别是Browser域）以获取所有可用的权限字符串。这些字符串是CDP规范的一部分，例如geolocation、notifications、camera、microphone、clipboardReadWrite、clipboardSanitizedWrite等。
- 测试隔离： 确保权限授予操作不会影响其他不相关的测试用例。由于权限是针对当前浏览器实例授予的，通常在每个测试方法开始时重新授予是安全的做法。
- 异常处理： grantPermission方法中的try-catch有助于捕获DevTools通信错误。在生产级测试套件中，你可能需要更细致的错误报告或日志记录机制。
- 替代方案： 对于某些权限，可能也可以通过Chrome启动参数（–enable-features或–disable-features）来配置，但DevTools协议提供了更细粒度和动态的控制，尤其适用于需要在测试过程中动态切换权限的场景。
- 验证剪贴板内容： 直接从浏览器会话读取剪贴板内容比授予权限本身更复杂。上述示例中通过前端JS将内容写入DOM元素再读取是一种常见且有效的方法。如果无法修改前端代码，可能需要深入研究CDP的Clipboard域命令，或者依赖间接的UI反馈进行验证。
总结
通过集成ChromeDevToolsDriver并利用Chrome DevTools Protocol的Browser.grantPermissions命令，Laravel Dusk能够克服浏览器权限限制，实现对需要特殊权限（如剪贴板访问、地理位置等）功能的全面自动化测试。这种方法提高了测试覆盖率和可靠性，使Dusk成为更强大的端到端测试工具，帮助开发者构建和维护高质量的Web应用程序。掌握这一技巧，将使你的Dusk测试更加灵活和强大。