Error caused by patched XMLHttpRequest

[devoto13]

We're using Angular with Zone.js 0.7.7 in the WebView in our mobile application. The problem is that quite often we get following error:

Error: macroTask 'XMLHttpRequest.send': can not transition to 'running', expecting state 'scheduled', was 'notScheduled'.

Real application is complex, but we managed to come up with a minimal reproduction. Basically it's mobile application, which does following sequence of actions in the infinite loop with 1s delay:

1. Native code calls function in the WebView using stringByEvaluatingJavaScript function.
2. This function sends HTTP request using XMLHttpRequest.

Once I scroll page up/down for 2-3 seconds, mentioned error occurs.

• Error doesn't happen, when there is no scrolling done. So it seems to be related to some events happening in browser.
• Error doesn't happen if we call function using setInterval() inside WebView instead of calling from native code. So it seems to be related to how WebView executes code from outside.
• Error doesn't happen, when I add small synchronous computation in the ZoneTask._transitionTo() (O.o). Tried to log unique IDs for every task using approach described here. See commented code. This one looks like a complete magic to me.

I understand that this is still pretty complex reproduction, but I have no idea how to reduce it further. Do you have any ideas why it can happen and how can I debug it further? I can also provide any extra details if needed.

Project can be found here. To reproduce you need to open project with XCode, run it on device, connect with Safari remote debugging and scroll up/down for 2-3 seconds. Error is usually reproducible after couple of seconds of scrolling.

[JiaLiPassion]

@devoto13 , thank you for posting the issue and the steps to reproduce.
I just debug it, find out sometimes the XMLHttpRequest.onreadystatechange will be fired multiple times with readyState=4.
Even I remove zone.js, and just add a simple event listener

xhr.onreadystatechange = function() {
                    if (xhr.readyState === 4) {
                        if (xhr['ok']) {
                            console.log('error duplicate done');
                        }
                        xhr['ok'] = true;
                    }
                }

it can still be reproduced.

So I made a PR to add check to prevent that in zone.js. And I test it with your repo, the error is gone.

[devoto13]

Thank you @JiaLiPassion for a quick fix! I tried Zone.js with your fix in the test application and it seems to work well. I'll try it in the real application as well on Monday and will get back.

Do you think we should report this issue with onreadystatechange being called multiple times to the WebKit/Safari developers as well?

[JiaLiPassion]

@devoto13, it seems that the issue has already been reported, but their cases are hard to reproduce, your case is very easy to reproduce, so I think it will be helpful to report your case to them:)

[devoto13]

Okey, thanks! Will take care about it next week as well.