For some reason the mask and highlighting is not working.

[bharadwaj031]

Using @reactour/tour@3.8.0

We are integrating in the host of a micro-front end application. Below is the basic TourProvider config I did.

const steps = [
    {
      selector: '[data-tour="space-selector"]',
      content: `Welcome to ${applicationName}!`,
    }
  ]

<TourProvider steps={steps}>
   {children}
</TourProvider>

I followed the exact steps from the https://docs.react.tours/tour/examples

I have tried adding maskWrapper, maskClassName props to the provider. None worked.

Below are the errors I get in the console.

Error: <rect> attribute width: Expected length, "NaN".
Error: <rect> attribute height: Expected length, "NaN".
Error: <polygon> attribute points: Expected number, "0 0, 0 NaN, NaN NaN, Na…".
Error: <svg> attribute width: Expected length, "NaN".

Also, to add more details, the HTML reference for the mask element has NaN properties being rendered.

<div class="reactour__mask" style="opacity: 0.7; left: 0px; top: 0px; position: fixed; z-index: 99999; pointer-events: none; color: rgb(0, 0, 0);"><svg width="NaN" height="NaN" xmlns="http://www.w3.org/2000/svg" style="top: 0px; position: fixed;"><defs><mask id="mask__7g10pnaiwlt"><rect x="0" y="0" width="NaN" height="NaN" fill="white"></rect><rect style="y: 67px; fill: black; rx: 0px;"></rect></mask><clipPath id="clip__3ixc0mm6dpu"><polygon points="0 0, 0 NaN, NaN NaN, NaN 67, NaN 67, NaN NaN, NaN NaN, NaN NaN, NaN NaN, NaN 0"></polygon></clipPath></defs><rect style="x: 0px; y: 0px; fill: currentcolor; mask: url(&quot;#mask__7g10pnaiwlt&quot;);"></rect><rect style="x: 0px; y: 0px; fill: currentcolor; pointer-events: auto; clip-path: url(&quot;#clip__3ixc0mm6dpu&quot;);"></rect><rect style="y: 67px; pointer-events: auto; fill: transparent; display: none;"></rect></svg></div>

are there any prop(s) or settings required for this svg element to render those width and height values??? Any help on this is greatly appreciated.

@elrumordelaluz

Not able to share the screenshot due to org policies.