Framework: Trigger event when Aurelia is fully loaded

[zewa666]

I'd like to integrate E2E tests with Protractor for Aurelia. So far everything fine, but I somehow need to wait for the page to finish loading. So far a browser.sleep would help but it feels dirty.

So in the end it would be nice if Aurelia could trigger some kind of dom event to notify protractor that its done loading.

As a test I put following attached code into the app.js of the Skeleton App:

attached() {
    var evt = document.createEvent('Event');
    evt.initEvent('AureliaLoaded', true, true);

    setTimeout(
      () => { document.dispatchEvent(evt); },
      2000);
}

and my protractor test now looks like this:

describe('aurelia skeleton app', function() {
  beforeEach( function() {
    browser.ignoreSynchronization = true;
    browser.get('http://localhost:9000/app');

    browser.executeAsyncScript(
      'var cb = arguments[arguments.length - 1];' +
      'document.addEventListener("AureliaLoaded", function (e) {' +
      '  cb("SPA fully loaded")' +
      '}, false);'
    ).then(function(result){
        console.log(result);
    });
  });

  it('should load the page', function() {
    expect(browser.getTitle()).toBe('Welcome | Aurelia');
  });
});

As you can see the beforeEach will now execute an AsyncScript to wait for the custom Event and thus preventing the tests from starting before Aurelia is done.

So maybe the automated bootstrapper could now issue such an event and we are good to go.

[EisenbergEffect]

Excellent. We will get it in there.

[Alxandr]

Is AureliaLoaded enough? With Angular, they basically test that the messagepump is empty.

[EisenbergEffect]

Do they do that inside Angular? Or inside protractor?

On Wed, Jan 28, 2015 at 11:03 AM, Alxandr [email protected] wrote:

Is AureliaLoaded enough? With Angular, they basically test that the
messagepump is empty.

—
Reply to this email directly or view it on GitHub
https://github.com/aurelia/framework/issues/12#issuecomment-71860390.

Rob Eisenberg,
President - Blue Spire
www.durandaljs.com

[Alxandr]

Inside of protractor. They have a clientscript (haven't been able to find that one yet). It runs before any webdriver actions.

[Alxandr]

https://github.com/angular/protractor/blob/9bc1c53e40161521b0c125a810f86235c974f100/lib/protractor.js#L271

[Alxandr]

Ah, here is the actual client-side implementation: https://github.com/angular/protractor/blob/9bc1c53e40161521b0c125a810f86235c974f100/lib/clientsidescripts.js#L29

[zewa666]

Yeah we could look into that, essentially the guys are also verifying that there are no outstanding HTTP calls. So once http-client can track those we can include it as well.
For now thou having this issue solved I could prepare a PR for the Skeleton App, including a protractor.config file, example test and all wired up through gulp with a separate task.

So maybe we should keep track of the other stuff in another issue

[EisenbergEffect]

Fixed in feed2a3a05fe8cd9f5463a84ddb692aba4912193

[djensen47]

Is there documentation on how to use this? If not, then, please, how do I use this. Thanks.

[zewa666]

@djensen47 this Event is used as part of the Aurelia protractor Plugin. https://github.com/aurelia/protractor-plugin

You can find a guide in the official Aurelia docs

[ricardograca]

This event is called aurelia-started for those that are wondering, so to use it just:

document.addEventListener('aurelia-started', doStuff)