3rd party packages can cause console.log() to trigger change detection

[ibedard16]

🐞 bug report

Affected Package

The issue is caused by package @angular/core.

Is this a regression?

No.

Description

If a 3rd party library adds behavior to the console.log() function, zone.js will erroneously trigger change detection. If the console.log() statement is in a function bound to the view model, change detection can recursively run.

An easy way to prevent the problem would be to wrap the console.log statement to run outside of angular. However, this is very unwieldy and not-obvious to a developer adding console.log statements to debug their program (aka me).

I recognize that this likely could be considered an issue with the 3rd party package. However, I'm not entirely certain that there is anything that can be done from that package, as it is meant to be a generic package used in a variety of projects, and not just Angular projects.

The 3rd party package, in this case, is Sentry, which overwrites the console.log function in order to record breadcrumbs for error logging. I'm opening an issue both here and against Sentry's repo, because I'm very uncertain which project can/should ultimately fix this issue.

Edit: getsentry/sentry-javascript#1883

🔬 Minimal Reproduction

Reproduction repo that uses Sentry to reproduce the problem: https://github.com/ibedard16/sentry-recursion-demo

Instructions to reproduce are in the readme.

🌍 Your Environment

Angular Version:

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/


Angular CLI: 7.3.1
Node: 8.11.3
OS: win32 x64
Angular: 7.2.4
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.11.4
@angular-devkit/build-angular     0.11.4
@angular-devkit/build-optimizer   0.11.4
@angular-devkit/build-webpack     0.11.4
@angular-devkit/core              7.1.4
@angular-devkit/schematics        7.3.1
@angular/cli                      7.3.1
@ngtools/webpack                  7.1.4
@schematics/angular               7.3.1
@schematics/update                0.13.1
rxjs                              6.4.0
typescript                        3.2.4
webpack                           4.23.1

Anything else relevant?
Using @sentry/browser @4.5.4

[ibedard16]

Update: leaving the demo running for long enough crashed Chrome.
I don't mean it caused the tab to crash, I mean Chrome itself - every tab and window I had opened - crashed.
That's not a good thing.

[mhevery]

Zone does not patch console.log so it does not matter from which zone you write to. It seems that Sentry adds something which is async into console.log which than triggers zone.js. This seems like a strange interaction between Zone.js and sentry, and I don't think either of the two libraries can do much to mitigate this.

I don't think there is a feasible fix for either side, so I am closing as won't fix.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}