16

I've got an interesting setup here.

I have an Angular App that loads another Angular App inside an iframe. I'm interested in testing the iframed-in Angular app with Protractor.

Protractor is waiting for the first Angular app to load, but when I switch the iframe with

ptor.switchTo().frame('experience');

I can see that Protractor is not waiting for the iframed Angular app before making assertions. I have tried adding

ptor.waitForAngular();

After switching to the iframe with no luck. Anybody have any ideas what is going on here?

Thanks!

If it helps, I'm running my tests through the Saucelabs ssh tunnel on Chrome. I can tell that the tunneling is working because I see the resources for the iframed app being requested and downloading.

4

3 回答 3

22

使用量角器测试 iframe 有点棘手。我花了一段时间和很大的耐心才弄明白发生了什么。我希望这有帮助!

Protrator 是基于 WebdriverJS 构建的,因此您可以使用整个包来测试 iframe。当您开始使用量角器进行测试时,您要做的第一件事就是获取量角器的实例:

var ptor = protractor.getInstance();

但是要测试你在 iframe 中的内容,你需要 ptor.driver 而不是 ptor!

var driver = ptor.driver;

然后,当您开始编写测试时,您会找到 iframe,然后切换到它,使用“驱动程序”对其进行测试,然后切换回初始帧。

ptor.switchTo().frame(driver.findElement(protractor.By.xpath('xpath-to-iframe')));

// Test iframe with driver
driver.findElement(protractor.By.xpath('some-sort-of-input')).sendKeys('username');
driver.findElement(protractor.By.xpath('other-sort-of-input')).sendKeys('password');
driver.findElement(protractor.By.xpath('other-sort-of-button')).click();

// Switch back to Default Content
ptor.switchTo().defaultContent();

// And WAIT for angular!!
ptor.waitForAngular();

下面的代码是我上面提到的一般示例:

describe('Protractor iframe Test', function(){

  var ptor, driver;

  beforeEach(function(){
    ptor = protractor.getInstance();
    driver = ptor.driver;
  });

  it('should test the iframe', function(){

    ptor.switchTo().frame(driver.findElement(protractor.By.xpath('xpath-to-iframe')));

    // Test iframe with driver
    driver.findElement(protractor.By.xpath('some-sort-of-input')).sendKeys('username');
    driver.findElement(protractor.By.xpath('other-sort-of-input')).sendKeys('password');
    driver.findElement(protractor.By.xpath('other-sort-of-button')).click();

    // At this point, you can expect() things to happen to the iframe app

    // Switch back to Default Content
    ptor.switchTo().defaultContent();

    // And WAIT for angular!!
    ptor.waitForAngular();

    // Then you can keep testing (or expecting something!)
    expect('this answer').toBe('useful');

  });

});
于 2014-01-13T15:54:39.280 回答
19

对于量角器 2.5.1,@lthilon 的回答是给出“无效定位器”错误。

以下语法解决了这个问题:

    var driver = browser.driver;
    var loc = by.tagName('iframe');
    var el = driver.findElement(loc);
    browser.switchTo().frame(el);

    driver.findElement(by.tagName('body')).sendKeys('my test string');

    browser.switchTo().defaultContent();
    browser.waitForAngular();
于 2016-01-08T00:09:51.823 回答
1

根据最新的量角器 API 文档 5.4.1,切换到 iframe 非常简单:

await browser.switchTo().frame(element(by.xpath('//iframe')).getWebElement());

上下文切换到指定的 iframe,现在您运行的每个命令都将在 iframe 上执行。现在您甚至可以切换到嵌套 iframe。要切换回父 iframe:

 driver.switchTo().parentFrame();
于 2019-04-01T08:30:39.410 回答