0

I would like to find out, what is causing Change Detection cycles in my Angular (version 8 - I can't upgrade now) application. I would like to patch or intercept ZoneJS so I can see what has triggered the CD cycle.

(For example: that tick() has been started by HTML input keyup event listener.)

This is my main.ts file:

platformBrowserDynamic().bootstrapModule(AppModule).then(moduleRef => {
  const applicationRef = moduleRef.injector.get(ApplicationRef);
  const componentRef = applicationRef.components[0];
  enableDebugTools(componentRef);
}).catch(err => console.error(err));

And this is monkey patched tick() function to see application ticks.

export class AppModule {
  constructor(
    private readonly translate: TranslateService,
    applicationRef: ApplicationRef
  ) {
    translate.setDefaultLang('cz');

    const originalTick = applicationRef.tick;
    applicationRef.tick = function(): any {
      console.log('TICK');

      return originalTick.apply(this, arguments);
    };
  }
}

With this setup, I can see two ticks for every keyboard input in an input text with [(ngModel)] (and four template checks using {{test()}} / console.log('Template Check') in Component). I would expect only single tick and two template checks.

I found I can use TaskTrackingZoneSpec here but I can't make it work.

Felix
  • 3,999
  • 3
  • 42
  • 66

1 Answers1

0

Keydown and keypressed events are firing - thus 2 checks as change detection cycle is invoked on user input envets (and xhr requests)

Antoniossss
  • 31,590
  • 6
  • 57
  • 99
  • Please see here for a quick showcase: https://stackblitz.com/github/felikf/a12-test/tree/test/change-detection open console (right bottom click on console link) and edit the text area, see one TICK for each keyprees. That is for a clean A12 repo. In my work repo with Angular 8, there are two ticks for each keypress, what is I need to understand where is the difference:) – Felix Feb 04 '22 at 09:02
  • Try the same on your your version of angular. Maybe it will be the same. Something might have changed - its 4 major versions after all. – Antoniossss Feb 04 '22 at 09:13