Edited at

Protractor でブラウザのウインドウの制御をする

More than 3 years have passed since last update.


Protractor でブラウザのウインドウの制御をする


目的

Protractor を使って UI のテスト時に、ブラウザのウインドウの制御をしたい。


ケース例

あるリンクボタンを押したら、別ウインドウを開く。その時、その開かれたタブ画面の URL とコンテンツの確認をする。確認が終わったらウインドウを閉じる。


書き方

describe('テスト', function() {

it('リンクボタンをクリックしたら別タブを開くよ', function() {
// given
browser.get('http://localhost:5000/#/hoge');
browser.waitForAngular();

// when
element(by.id('sample-link')).click();

// then
browser.getAllWindowHandles().then(function (handles) {
var newWindowHandle = handles[1];
// 開いた別ウインドウに移動
browser.switchTo().window(newWindowHandle).then(function () {
// 開いたウインドウの URL チェック
expect(browser.driver.getCurrentUrl()).toBe('http://testtest.com');
// 開いたウインドウ内のアサーションとか
element(by.id('testdayo')).getText().then(function(data) {
expect(data).toEqual('わっしょい');
});
// テストが終わったら別ウインドウを閉じて、もとのウインドウに戻る
browser.driver.close().then(function () {
browser.switchTo().window(handles[0]);
});
});
});


新規にタブを開く

describe('テスト', function() {

it('新規にタブを開くよ', function() {
// given
browser.get('http://localhost:5000/#/hoge');
browser.waitForAngular();

// when
browser.actions()
.sendKeys(protractor.Key.chord(protractor.Key.CONTROL, protractor.Key.SHIFT ,"n"))
.perform();

// then
browser.getAllWindowHandles().then(function (handles) {
var newWindowHandle = handles[1];
// 開いた別ウインドウに移動
browser.switchTo().window(newWindowHandle).then(function () {
// URL を指定して開く
browser.get('http://testtest.com');
// 開いたウインドウの URL チェック
expect(browser.driver.getCurrentUrl()).toBe('http://testtest.com');
// 開いたウインドウ内のアサーションとか
element(by.id('testdayo')).getText().then(function(data) {
expect(data).toEqual('わっしょい');
});
// テストが終わったら別ウインドウを閉じて、もとのウインドウに戻る
browser.driver.close().then(function () {
browser.switchTo().window(handles[0]);
});
});
});