Skip to content

async test zone: fixture.whenStable supports click + onreadystatechange but not click + onload #17192

@taavo

Description

@taavo

Summary
In an async test zone, when a component triggers an XmlHttpRequest through a click, fixture.whenStable works as expected with the XmlHttpRequest#onreadystatechange event but not XmlHttpRequest#onload event.

Notably this means that HttpModule doesn't work as expected with async test zones.

See plnkr: http://plnkr.co/edit/9l8LwcFIovV5JONv0M7d?p=preview

Current behavior
With onreadystatechange, the event indicating that the response has been received is fired before fixture.whenStable, so I'm then able to make assertions based on the behavior of the event handler.

With onload, the event indicating that the response has been received is fired after fixture.whenStable, so I'm unable to make assertions based on the behavior of the event handler.

This is most obvious when looking at the console.log statements in the plnkr. We see 1. click, 3. whenStable, 2. xhr event handler, instead of 1. click, 2. xhr eventhandler, 3. whenStable.

Expected behavior
I expect the XmlHttpRequest onload behavior to be the same as onreadystatechange; fixture.whenStable should let me make assertions around the behavior of the event handler.

Minimal reproduction of the problem with instructions
Steps to reproduce: http://plnkr.co/edit/9l8LwcFIovV5JONv0M7d?p=preview

Note that it's apparently relevant that the XmlHttpRequest is triggered by a click. If the XmlHttpRequest fires as part of the constructor the correct behavior is observed. I can also produce the correct behavior by triggering the click inside a separate async test zone in a beforeEach, but I don't know zonejs well enough to know if that means anything..

What is the motivation / use case for changing the behavior?
I want to use the HttpModule to occasionally make real requests during component testing.

Please tell us about your environment:
Tested on a Mac using Chrome 58.

  • Angular version: 4.0.0 and 4.1.3.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions