量角器：在的iframe测量角应用 [英] Protractor: Testing Angular App in an Iframe

问题描述

我有一个有趣的设置在这里。

I've got an interesting setup here.

我有一个加载另一个角度应用在iframe内角应用。我感兴趣的是用量角器测试的iframe，在角应用程序。

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.

量角器正在等待第一角应用加载，但是当我切换了iframe以

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

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

我可以看到量角器没有作出断言之前等待的iframe角应用。我曾尝试添加

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

ptor.waitForAngular();

没有运气切换到IFRAME后。任何人有任何想法是怎么回事？

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

谢谢！

如果有帮助，我通过运行在Chrome上Saucelabs SSH隧道我的测试。我可以告诉大家，隧道工作，因为我看到的资源被请求的的iFrame应用程序和下载。

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.

推荐答案

测试与内部框架是量角器有点棘手。我花了一段时间，很大的耐心来排序的理解发生了什么事情。我希望这有助于！

Testing iframes with protractor is a little bit tricky. It took me a while and a lot of patience to sort of understand what was going on. I hope this helps!

Protrator是建立在WebdriverJS建成，所以你可以使用全包，以测试内部框架。当你开始用量角器测试时，你要做的第一件事就是让量角器的一个实例：

Protrator is built upon WebdriverJS, so you can use the whole package to test iframes. When you start testing with protractor, the first thing you do is get an instance of protractor:

var ptor = protractor.getInstance();

不过来测试你有什么的iframe里面，你会ptor.driver需要，而不是ptor！

But to test what you have inside the iframe you will need ptor.driver instead of ptor!

var driver = ptor.driver;

然后，当你开始写测试，你发现的iframe，切换到它，你与'司机'测试它，你切换回初始帧。

Then, when you start writing the test, you find the iframe, you switch to it, you test it with 'driver' and you switch back to the initial frame.

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();

这是如下code是什么，我上面提到的一般示例：

The code that follows is a general example of what I mentioned above:

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');

  });

});

这篇关于量角器：在的iframe测量角应用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！