Транспортир: тестирование Angular приложения в iframe

У меня здесь интересная настройка.

У меня есть приложение Angular, которое загружает другое приложение Angular внутри iframe. Я заинтересован в тестировании приложения iframed-in Angular с помощью Protractor.

Транспортир ожидает загрузки первого приложения Angular, но когда я переключаю iframe с

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

Я вижу, что Protractor не ждет приложения iframed Angular, прежде чем делать утверждения. Я попытался добавить

ptor.waitForAngular();

После переключения на iframe без везения. У кого-нибудь есть идеи, что здесь происходит?

Спасибо!

Если это помогает, я запускаю свои тесты через туннель Saucelabs ssh в Chrome. Я могу сказать, что туннелирование работает, потому что я вижу ресурсы для запрошенного и загружаемого приложения iframed.

Ответ 1

Тестирование iframes с транспортиром немного сложнее. Мне потребовалось время и много терпения, чтобы понять, что происходит. Надеюсь, это поможет!

Protrator построен на WebdriverJS, поэтому вы можете использовать весь пакет для тестирования iframes. Когда вы начинаете тестирование с помощью транспортира, первое, что вы делаете, это получить экземпляр транспортира:

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

  });

});

Ответ 2

С транспортиром 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();