ng-matero / extensions

Angular Material Extensions Library.
https://ng-matero.github.io/extensions/
MIT License
388 stars 48 forks source link

[mtxPopover] ERROR TypeError: Cannot read properties of undefined (reading 'listen') #291

Closed InYourHead closed 3 weeks ago

InYourHead commented 1 month ago

I found issue, when mtxPopover is on link used to redirect to another page.

I creaded full example with cypress tests.

How to reproduce it?

  1. clone repository:

https://github.com/InYourHead/mtx-popover-error-example/tree/master

  1. Install node 16+

  2. Run npm install

  3. Run npm run start to start sample application

  4. In another terminal run npx cypress open

  5. Start E2E Testing and select chrome and follow given steps:

Zrzut ekranu z 2024-03-22 10-39-16

Zrzut ekranu z 2024-03-22 10-39-50

Zrzut ekranu z 2024-03-22 10-41-13

7. After executing tests in console you can see given error:

Zrzut ekranu z 2024-03-22 10-41-57

VM144:1 ERROR TypeError: Cannot read properties of undefined (reading 'listen')
    at TransitionAnimationEngine.listen (browser.mjs:3428:20)
    at InjectableAnimationEngine.listen (browser.mjs:4353:39)
    at AnimationRenderer.listen (animations.mjs:342:32)
    at listenerInternal (core.mjs:15641:40)
    at ɵɵlistener (core.mjs:15522:5)
    at MtxPopover_ng_template_0_Template (mtxPopover.mjs:461:1318)
    at executeTemplate (core.mjs:12126:9)
    at renderView (core.mjs:11948:13)
    at TemplateRef.createEmbeddedView (core.mjs:23041:9)
    at ViewContainerRef.createEmbeddedView (core.mjs:23159:37)

It propably indicates, that animation cannot be execute after view change. It is problematic, when your application has global error handling.

Affected version: @ng-matero/extensions:14.8.2

InYourHead commented 4 weeks ago

Any updates on current progress? I can try to fix it, but this code is quite complex.

nzbin commented 4 weeks ago

Sorry for late reply.

https://github.com/InYourHead/mtx-popover-error-example/blob/master/src/app/simple-button/simple-button.component.html

Please remove the routerLink and test again, the error will be gone.

InYourHead commented 3 weeks ago

Is it possible to use it with routerLink? I need to navigate users after click.

nzbin commented 3 weeks ago

Is it possible to use it with routerLink? I need to navigate users after click.

I'm sorry, the error only can be found with e2e test and I don't know what happened. I haven't enough time to explore the cypress.