kendo-popup -> OnPush -> not aligned correctly on first run

[meriturva]

Just see: https://stackblitz.com/edit/angular-he4vwr

it is an example with OnPush change detection strategy, nothing else. On the first run, you see popup not well aligned (see image attached). After one click or window resize you could see that popup restores his correct position.

[mbechev]

As a workaround, you can use markForCheck to explicitly marks the view as changed in ngAfterViewInit hook: https://stackblitz.com/edit/angular-vl63ck-cazyu3?file=app/app.component.ts

Note that the issue is not reproduced in Angular 9.

[meriturva]

In my case is still present on angular 9 and it is related to animation. If I disable animate property on popup everything works great. I will wait for this fix and then I will try to reproduce more accurately issue, Reproduce issue with our complex layout is really difficult in that case. Again thanks.

[mbechev]

Hi @meriturva, Please find the attached Angular 9 project and check the Popup behavior: test-popup.zip Extract the zipped file and use the following commands to run the application:

• npm install
• ng serve

[gregservera]

This bug continue to occur using @progress/[email protected]. It's a real issue for us.

Do you plan to resolve it?

[arsenlol]

There is an Output called positionChange, and it happened so that when I assign a handler to it, then it will notice alignAnchor value and render in proper place initially. I was not using onPush, but you can try to put markForCheck or detectChanges there.

<kendo-popup
    ...
    (positionChange)="test($event)"
    ...

test(event) {
    console.log(event);
    // this.cdr.markForCheck()
}

[stnikolova]

The issue is no longer reproducible using the latest (v13) @progress/kendo-angular-popup version https://stackblitz.com/edit/angular-8tuhvr