🐞 - [md-menu] nextOnAnchorClick not working with closeOnOutsideClick

[EliotRagueneau]

Which ngx-ui-tour-* package is the source of the bug?

md-menu

Please provide a link to a minimal reproduction of the bug

https://stackblitz.com/edit/angular-wau2z8?file=src%2Fapp%2Fui-tour-demo.component.ts

Description

When a step is having both nextOnAnchorClick and closeOnOutsideClick, clicking on the anchor is closing the tour instead of going to the next step.

I found a way to fix this issue from the user side, which also enhance a bit the backdrop, by adding a div color-backdrop when the tour is present, with the following scss:

.color-backdrop {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  pointer-events: auto;
  background: rgba(black, 0.5);
  opacity: 1 !important;
  z-index: 998;
}

And having the following scss on active anchor, though it requires to add clickable on the anchors having closeOnOutsideClick

.touranchor--is-active {
  position: relative;
  z-index: 999;
  &[clickable] {
    z-index: 1003;
  }
}

Maybe you could to try to include that fix natively, or maybe another solution which could potentially work on all situations, since mine is quite specific to Material Design😄

Angular version

16.2.6

Ngx UI Tour version

11.0.4

Which browsers have you used?

• Chrome
• Firefox
• Safari
• Edge

Which operating systems have you used?

• macOS
• Windows
• Linux
• iOS
• Android

[hakimio]

I don't have any better solutions, but, if you can figure out a simple way to fix this from the library side, feel free to submit a PR.