Close #41522 `zone.js` patches event listeners and run all event listeners together, if one event handler throws error, the listeners afterward may not be invoked. Reproduction: ``` export class AppComponent implements AfterViewInit { @ViewChild('btn') btn: ElementRef; title = 'event-error'; constructor(private ngZone: NgZone) {} ngAfterViewInit() { this.ngZone.runOutsideAngular(() => { this.btn.nativeElement.addEventListener('click', () => { throw new Error('test1'); }); this.btn.nativeElement.addEventListener('click', () => { console.log('add eventlistener click'); }); }); } } ``` Until now no Angular users report this issue becuase in the `ngZone`, all error will be caught and will not rethrow, so the event listeners afterward will still continue to execute, but if the event handlers are outside of `ngZone`, the error will break the execution. This commit catch all errors, and after all event listeners finished invocation, rethrow the errors in seperate `microTasks`, the reason I am using `microTask` here is to handle multiple errors case. PR Close #41562
40 lines
1.3 KiB
TypeScript
40 lines
1.3 KiB
TypeScript
/**
|
|
* @license
|
|
* Copyright Google LLC All Rights Reserved.
|
|
*
|
|
* Use of this source code is governed by an MIT-style license that can be
|
|
* found in the LICENSE file at https://angular.io/license
|
|
*/
|
|
|
|
export function eventTargetPatch(_global: any, api: _ZonePrivate) {
|
|
if ((Zone as any)[api.symbol('patchEventTarget')]) {
|
|
// EventTarget is already patched.
|
|
return;
|
|
}
|
|
const {eventNames, zoneSymbolEventNames, TRUE_STR, FALSE_STR, ZONE_SYMBOL_PREFIX} =
|
|
api.getGlobalObjects()!;
|
|
// predefine all __zone_symbol__ + eventName + true/false string
|
|
for (let i = 0; i < eventNames.length; i++) {
|
|
const eventName = eventNames[i];
|
|
const falseEventName = eventName + FALSE_STR;
|
|
const trueEventName = eventName + TRUE_STR;
|
|
const symbol = ZONE_SYMBOL_PREFIX + falseEventName;
|
|
const symbolCapture = ZONE_SYMBOL_PREFIX + trueEventName;
|
|
zoneSymbolEventNames[eventName] = {};
|
|
zoneSymbolEventNames[eventName][FALSE_STR] = symbol;
|
|
zoneSymbolEventNames[eventName][TRUE_STR] = symbolCapture;
|
|
}
|
|
|
|
const EVENT_TARGET = _global['EventTarget'];
|
|
if (!EVENT_TARGET || !EVENT_TARGET.prototype) {
|
|
return;
|
|
}
|
|
api.patchEventTarget(_global, api, [EVENT_TARGET && EVENT_TARGET.prototype]);
|
|
|
|
return true;
|
|
}
|
|
|
|
export function patchEvent(global: any, api: _ZonePrivate) {
|
|
api.patchEventPrototype(global, api);
|
|
}
|