Targeting an element that appears as a result of state change in callback

[justin-hackin]

In my tour callback, I trigger a state change which exposes a button to be targeted next in the tour. I can't seem to do this; even though the action is not async, I think there's more than one render tick involved. I tried putting the state change in the EVENTS.STEP_BEFORE but that didn't work so I tried moving it to the previous EVENTS.STEP_AFTER to no avail. I was able to work around this issue by adding 12 steps with a target not in the DOM in between but that's feels pretty dirty. It would be awesome if, in the callback, one could return a Promise that would be awaited before the stage was advanced. That might warrant the use of an optional spinner in the tooltip though and this aim might be complicated by the custom component feature. Am I overlooking another viable possibility to achieve this or is there a better solution than what I've proposed?

[gilbarbara]

hey @justin-hackin
The controlled way (using stepIndex) exists exactly for these cases.
Check the docs and the demo for more information.

[justin-hackin]

Whoops, thanks for the courteous nudge, makes perfect sense 👍