Angularjs，使用 angular-recaptcha 进行 e2e 测试

2022-01-16 00:00:00 selenium angularjs protractor javascript

我实际上是在尝试对我的简单应用程序进行 e2e 测试，但在处理 angular-recaptcha 时遇到了一些麻烦(https://github.com/VividCortex/angular-recaptcha).

I'm actually trying to e2e test my simple application and I m having some troubles dealing with angular-recaptcha (https://github.com/VividCortex/angular-recaptcha).

这是我的测试:

  it('should redirect on another page', function() {

    browser.get('http://127.0.0.1:3000/#/');
    var userName = element(by.model('auth.loginInfos.username'));
    userName.sendKeys('consumer1@eco.com');

    var password = element(by.model('auth.loginInfos.password'));
    password.sendKeys('consumer1');



    var recapt = element(by.id('recaptcha'));
    recapt.sendKeys();/* How can I put the recaptcha value to true ? */

    var btn = element(by.className('btn'));
    btn.click();
    /**
     * Assertions etc...
     */

  });

所以，您可以看到我正在尝试填写 recaptcha 值，但我不知道如何继续.

So, you can see that I m trying to fill the recaptcha value and I don't know how to proceed.

你能帮帮我吗?

注意:我正在使用量角器

感谢您的帮助

推荐答案

验证码加载在一个iframe中，需要先切换到它再尝试检查:

The captcha is loaded in an iframe, you need to switch to it before trying to check:

browser.switchTo().frame(0);

其中 0 是帧索引.您可以使用框架名称、ID 或以前找到的框架元素.

where 0 is a frame index. You can use a frame name, id or a previously found frame element.

使用 recaptcha 演示页面的示例测试:

Sample test that uses the recaptcha demo page:

"use strict";

describe("Recaptcha", function () {
    beforeEach(function () {
        browser.ignoreSynchronization = true;
        browser.get("http://vividcortex.github.io/angular-recaptcha/");
    });

    it("should click the captcha", function () {
        browser.switchTo().frame(0).then(function () {
            var checkbox = $(".recaptcha-checkbox-checkmark");

            // first hover the checkbox
            browser.actions().mouseMove(checkbox).perform();

            // hardcoded delay
            browser.sleep(500);

            // okat, now click - TODO: may be we should click with browser.actions().click() and provide the x, y coordinates for where to click
            checkbox.click();
        });

        // expectations
    });
});

请注意，在我的情况下，单击后，它会要求选择某些图像，这些图像完全可以完成不让我的 selenium 自动化机器人通过测试的工作.如果你想真正通过验证码，根据 新的 Google reCAPTCHA 是如何工作的? 页面以及有关此验证码如何工作的已知信息，我会尝试以下操作:

Note that in my case, after the click, it asks to select certain images that would exactly do the job of not letting my selenium automation bot pass the test. If you want to actually pass the captcha, according to the How does new Google reCAPTCHA work? page and the known information about how this captcha works, I would try the following things:

  • 使用您以前使用过的预加载配置文件打开浏览器(至少有浏览历史记录)
  • 在启动测试的浏览器中登录谷歌帐户
  • 不要像普通人那样通过 click() 点击复选框并使用偏移量点击它
  • 玩弄浏览器操作之间的延迟
  • open the browser with a pre-loaded profile that you've used before (that has the browsing history, at least)
  • be logged into google account in the browser fired up for testing
  • don't click the checkbox via click() and click it with an offset as a regular human would do
  • play around with a delays between browser actions

另一点是，您无需对验证码的工作方式进行 e2e 测试 - 它超出了应用程序端到端测试的范围.找到一种方法来为测试用户禁用/关闭验证码，或者为您将针对其运行测试的特定构建.

Another point is that, you don't need to e2e test how the captcha works - it is out of scope of the end-to-end testing of your application. Find a way to disable/turn the captcha off for the testing users, or for a specific build that you will be running tests against.

相关文章