Czekaj na element, aby zmienić jego wartość (tekst)

Question

Jestem na moim trzecim dniu pracy z Kątomierzem i ciągle uderzam w ściany bric w odniesieniu do oczekiwania na strony do załadowania i elementów do wyświetlenia. Ten przypadek testowy w szczególności stał się nieprzyjemny i chciałbym rozwiązać te problemy, nie musząc polegać na snach.

Jestem obecnie „na zewnątrz z ziemi angularjs”

it('it should reflect in both the field and the title when the personnel name is changed', function() { 
    var inputField, personnelHeader, personnelName; 
    personnelName = element(By.css(".overlay.editnameoverlay")).click(); 
    personnelHeader = element(By.id("personnel_name_header")); 
    inputField = element(By.css("input[name='newvalue']")); 
    inputField.clear(); 
    inputField.sendKeys("Test 123"); 
    element(By.css("input[name='ok_button']")).click(); 
    // browser.driver.sleep(2000); This test only works with this sleep added 
    browser.wait(function() { 
    console.log("Waiting for header to change..."); 
    return personnelHeader.getText().then(function(text) { 
     return text === "Test 123"; 
    }); 
    }, 5000); 
    return expect(personnelHeader.getText()).toBe(personnelName.getText()); 
}); 

Więc test tutaj zmienia nazwę w polu wejściowym. przesyła go i czeka, aż zmiany znajdą odzwierciedlenie w nagłówku modalu. Problem polega na tym, że bez browser.driver.sleep (2000) pojawia się błąd mówiący

Stacktrace: 
    StaleElementReferenceError: stale element reference: element is not attached to the page document 

Jak mogę iść o rozwiązywaniu to w tym konkretnym przypadku?

Answer 1

Podczas korzystania z kątomierza w celu przetestowania nieprostokątnych stron jesteś sam, czekając, aż elementy będą gotowe do interakcji.

StaleElementReferenceError jest prawdopodobnie najbardziej bezużyteczny błąd selen, zdarza się, gdy element został usunięty z DOM, ale nadal jest buforowane jakoś, ja też suffered ten problem, kiedy rozpoczęła się Kątomierz i nawet tried to convince należy automatycznie ponowiona Kątomierz siebie.

Rozwiązaniem dla mnie jest zawsze wyraźnie czekać na element, aby pojawić się na stronie za pomocą custom functionwaitReady() że browser.wait dla elementów gotowych, tj czeka na elemencie być gotowe do interakcji:

expect($('#login_field').waitReady()).toBeTruthy(); 

najpierw zintegrować ten fragment w kodzie: https://gist.github.com/elgalu/2939aad2b2e31418c1bb

Nie tylko niestandardowe waitReady() czeka na elemencie ale także połyka niepowiązanych bezużyteczny błąd webdriver jak StaleElementReferenceError i po prostu ponownie aż znalezieniu element lub upłynie limit czasu.

Więc waitReady() każdy element przed interakcji, tj przed clear() lub sendKeys() lub click() ...

// TODO: Move to Page Objects module 
var personnelNameElm = $(".overlay.editnameoverlay"); 
var personnelHeaderElm = $("#personnel_name_header"); 
var inputFieldElm = $("input[name='newvalue']"); 
var okBtnElm = $("input[name='ok_button']"); 

it('it should reflect in both the field and the title when the ' + 
    'personnel name is changed', function() { 

    expect(personnelNameElm.waitReady()).toBeTruthy(); 
    personnelNameElm.click(); 
    expect(inputFieldElm.waitReady()).toBeTruthy(); 
    inputFieldElm.clear().sendKeys("Test 123"); 
    expect(okBtnElm.waitReady()).toBeTruthy(); 
    okBtnElm.click(); 

    browser.wait(function() { 
    console.log("Waiting for header to change..."); 
    // Using waitReady() before getText() avoids Stale element errors 
    return personnelHeaderElm.waitReady().then(function() { 
     return personnelHeaderElm.getText().then(function(text) { 
     return text === "Test 123"; 
     }); 
    }); 
    }, 5000); 

    expect(personnelHeaderElm.getText()).toEqual(personnelNameElm.getText()); 
}); 

Answer 2

Z dokumentacji dla Expect Conditions:

var EC = protractor.ExpectedConditions; 
// Waits for the element with id 'abc' to contain the text 'foo'. 
browser.wait(EC.textToBePresentInElement($('#abc'), 'foo'), 5000);