2016-06-29 17 views
5

Używamy Selenium WebDriver do automatyzacji testów opartych na interfejsie użytkownika. Jednym z naszych wyzwań jest wykrycie, kiedy strona ładuje się naprawdę, a Angular 1 również stanowił wyzwanie w tym zakresie. Skończyło się wykonując ten kawałek kodu specjalnie do wykrywania jeśli kątowa 1 odbywa się:Wykrywanie, że Angular 2 jest już uruchomiony

if(typeof window.angular !== \"undefined\") 
{ 
    var injector = window.angular.element(\"*[ng-app]\").eq(0).injector(); 

    if(injector) 
    { 
    var $rootScope = injector.get(\"$rootScope\"); 
    var $http = injector.get(\"$http\"); 

    if($rootScope.$$phase === \"$apply\" || $rootScope.$$phase === \"$digest\" || $http.pendingRequests.length !== 0) 
    { 
     return false; 
    } 
    } 
} 

Aplikacja że testujemy niedawno przełączane używać kątowa 2. Fragment kodu powyżej nie czekać na Kątowymi 2 do wykończenia . Jakieś sugestie?

+0

Istnieje ten sam temat: http://stackoverflow.com/questions/34731869/wait-for-angular-2-to-load-resolve-model-before-rendering-view-template Najlepszą odpowiedzią było http: //stackoverflow.com/a/38212664/4019586 –

+0

Czy możesz podać mi przykład użycia tego kodu dla AngularJS 1? – yuva

Odpowiedz

8

W przypadku kątowej 2, należy poczekać na stableness z "testabilities" wszystkich aplikacjach kątowe 2:

functions.waitForAllAngular2 = function(callback) { 
    try { 
    var testabilities = window.getAllAngularTestabilities(); 
    var count = testabilities.length; 
    var decrement = function() { 
     count--; 
     if (count === 0) { 
     callback(); 
     } 
    }; 
    testabilities.forEach(function(testability) { 
     testability.whenStable(decrement); 
    }); 
    } catch (err) { 
    callback(err.message); 
    } 
}; 

Taken from Protractor source code. Protractor jest opakowaniem wokół wiązań selenowych javascript w WebDriverJS; przeznaczony do testowania aplikacji AngularJS (nie tylko, ale najlepiej pasujący do).

0

ja emitują zdarzenie od wewnątrz ngAfterViewInit() w składniku głównym

@Component({ 
    selector: 'my-app', 
    ... 
}) 
export class AppComponent { 
    constructor(private renderer:Renderer, private elementRef:ElementRef){} 
    ngAfterViewInit() { 
    this.renderer.invokeElementMethod(this.elementRef.nativeElement, 
     'dispatchEvent', 
     [new CustomEvent('angular2-loaded', { bubbles: true })]); 
    } 
} 

i słuchanie w tym przypadku za pomocą WebDriver.

+0

W powyższym przykładzie występuje literówka: w parametrach konstruktora drugi parametr to elementRef, ale w ngAfterViewInit() używasz elRef. W każdym razie, próbowaliśmy dodać to do aplikacji w ramach głównego komponentu testowego NG2. Następnie w konsoli Chrome zarejestrowaliśmy się, aby nasłuchiwać zdarzeń obciążonych kątami2, przekazując proste wywołanie zwrotne w celu ostrzeżenia. Załadowano testowaną aplikację i ... nic się nie stało. – user1801355

+0

@ user1801355 Dzięki za podpowiedź. Jakoś przegapiłem twój komentarz - naprawiony. –

1

Naprawiłem to pisząc klasę działań, w których czekałem na kątowa przed przeprowadzeniem działań (kliknij, wypełnić, sprawdzić itd.) Za pomocą Paul Hammants ngWebDriver:

import com.paulhammant.ngwebdriver.NgWebDriver; 

public class ActionsWithWaits { 

private NgWebDriver ngdriver; 
private JavascriptExecutor js; 

public ActionsWithWaits(){ 
    WebDriver driver = getDriver(); 
    js = (JavascriptExecutor) driver; 
    driver.manage().timeouts().setScriptTimeout(9, TimeUnit.SECONDS); 
    ngdriver = new NgWebDriver(js); 
} 


public void waitForAngular(){ 
    ngdriver.waitForAngularRequestsToFinish(); 
} 

public void waitAndClick(WebElementFacade button){ 
    waitForAngular(); 
    button.click(); 
} 

public void waitAndFillIn(String text, WebElementFacade field){ 
    waitForAngular(); 
    field.type(text); 
} 

etc.. 

Teraz możesz po prostu użyć tych działań zamiast standardowych działań selenu i nie trzeba się martwić o nic (=

1

Korzystanie odpowiedź @alecxe skończyło się z następujących javascript jedną wkładkę aby sprawdzić, czy wszystkie kątowe Testabilities są stabilne

window.getAllAngularTestabilities().findIndex(x=>!x.isStable()) === -1