Using the Zone.js RxJS polyfill causes recursion issues

[nickjillings]

There is a problem running the tours in apps with the Zone.js Rxjs polyfill included.

Here is a repo
(and stack blitz ).

It seems when the polyfill line import 'zone.js/dist/zone-patch-rxjs'; is included this then throws all kinds of problems, mostly with it recursively calling across the two zones ( and angular). I've tried with both ng-bootstrap and ngx-bootstrap. Haven't used Material as our app uses bootstrap.

In the ngx-bootstrap it seems the directive being included causes the most issues. And in ng-bootstrap it's only when start is called that it throws the error.

[hakimio]

And without the tour all the ng-bootstrap/ngx-bootstrap components/directives used here work as they should? The popover directive itself is not causing those issues?

[hakimio]

To be honest, I would likely blame ng-bootstrap and the polyfill itself for this issue. Don't have the time or will to investigate it more at the moment.
If you find a simple fix, feel free to open a PR.

More info about the ng-bootstrap issue

EDIT: most likely the issue is coming from this ng-bootstrap code.

[hakimio]

Closing since I don't think this is an issue with the ngx-ui-tour itself but 3rd party library (ng-bootstrap).
Possible solutions/workarounds:

• Don't use the polyfill
• Create a bug report in ng-bootstrap library to see if they care
• Use another UI implementation

EDIT: ng-bootstrap has no plans to fix the issue.