continuous-integration - 如何通过 Auth0 Lock 界面以编程方式登录？

Question

我正在尝试编写一个WebPageTest 自定义脚本，该脚本涉及以编程方式登录到我的 Web 应用程序的Auth0 Lock 界面作为第一步，但无法使其正常工作。

我设置了一个私有 WebPageTest 服务器来仔细查看发生了什么，并且从服务器日志看来，WebPageTest 脚本正在设置用户名/密码字段的值并使用 vanilla DOM 操作（即querySelector，click等）单击提交.) 但在提交表单时，Auth0 Lock 无法识别这些字段中已填写任何内容。单击提交时，错误提示这些字段不能为空。

我已将本地WebPageTest 节点代理与我的私人服务器一起使用，以通过 Lock 小部件成功登录，但不知道如何使用该方法获取性能日志（进入测试结果页面后没有结果显示）。这种登录方法似乎有效，因为进入输入字段的值通过 WebDriversendKeys函数以编程方式“输入”。

我在 Auth0 论坛上看到了这篇相关的帖子，但不知道如何将那里推荐的内容整合到 WebPageTest 脚本的上下文中。

您可以通过转到此页面顶部的 Auth0 Lock 示例并在您的 devtools 控制台中运行以下代码来重现我遇到的问题：

document.querySelector('.auth0-lock-input[name=email]').value = '[e-mail]';
document.querySelector('.auth0-lock-input[name=password]').value = 'testing';
setTimeout(() => document.querySelector('.auth0-lock-submit').click(), 1000)

我希望能够以编程方式输入输入字段信息并通过 Auth0 Lock 小部件提交，但无法这样做。有人对此有解决方案吗？

标签： continuous-integrationautomated-testsauth0auth0-lockwebpagetest

Answer 1

登录页面使用 javascript/ajax 创建登录表单及其输入元素。您只是做得太快了，没有等待首先创建元素，以便填充和提交它们。只需等待表单及其输入元素变为可用/可见，然后继续您的登录过程。

此外，避免使用 Sleep() / setTimeout() 方法来解决等待问题。这是错误的，一旦您更改代码运行的环境，它就会等待自己实现。使用测试框架中的正确等待方法，并正确等待这些元素变为可用。