16

ここに興味深い設定があります。

iframe 内に別の Angular アプリをロードする Angular アプリがあります。分度器を使用して、iframe 内の Angular アプリをテストすることに興味があります。

分度器は最初のAngularアプリが読み込まれるのを待っていますが、iframeを切り替えると

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

分度器は、アサーションを行う前に iframe の Angular アプリを待っていないことがわかります。追加してみました

ptor.waitForAngular();

運がないiframeに切り替えた後。ここで何が起こっているのか、誰にも考えがありますか？

ありがとう！

それが役立つ場合は、Chrome の Saucelabs ssh トンネルを介してテストを実行しています。トンネリングが機能していることは、iframe アプリのリソースが要求されてダウンロードされていることがわかります。

4

3 に答える 3

22

分度器で iframe をテストするのは少しトリッキーです。何が起こっているのかを理解するのにしばらく時間がかかり、かなりの忍耐が必要でした。これが役立つことを願っています！

Protrator は WebdriverJS に基づいて構築されているため、パッケージ全体を使用して iframe をテストできます。分度器でテストを開始するとき、最初に行うことは、分度器のインスタンスを取得することです。

var ptor = protractor.getInstance();

ただし、iframe 内にあるものをテストするには、ptor ではなく ptor.driver が必要です。

var driver = ptor.driver;

次に、テストの作成を開始すると、iframe が見つかり、それに切り替えて、「driver」でテストし、最初のフレームに戻ります。

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 に答える