driver.js icon indicating copy to clipboard operation
driver.js copied to clipboard

dynamic steps

Open mewalig opened this issue 4 years ago • 1 comments

First, thank you for the awesome library! I'm enjoying testing it out and am hopeful that I will be using it a lot!

I have a question re making a dynamic tour. Basically, I'd like to create a series of steps that are dynamic based on user choices, and that may require some async events to occur between steps. For example, a step might present a choice to click red pill or blue pill (and maybe another choice as well e.g. green pill), and next step would depend on which they chose. In addition, for any choice a user makes, I might want to display some new container element (such as a drop-down menu) that was not previously displayed, and use an element from that new container (such as a menu choice) as the focus of the next step.

It appears that defineSteps() expects a static list of steps, and the elements for those steps must already exist, so that does not seem to be a feasible solution to this.

One simple way to do this might be, if I could add my own button(s), or some other controls, to the popover, to reflect the choices, along with my own callback actions. That way, I could just make any callback open the related new container, define the next step with the new container's element to be focused on, then clear the current driver popover and create a new one with the new step. A drawback of this is that it would only work if there are very few choices, but it would suffice for my immediate requirements.

Another possible and more flexible approach would be for the Step interface to support a getNextStep(callback) function which generates the object used for the next step and then executes a callback on it (or returns a promise). That way, I could add HTML elements to the popover which present the choices, and getNextStep() could query those to determine how to build the next step, then execute any necessary actions (such as opening a new menu) to do so.

Would it be possible to add either of these features (custom buttons, or getNextStep(cb)), and/or, would you have any suggestions as to how otherwise I could create a dynamic tour as described above? Happy to contribute to the work if helpful

mewalig avatar Feb 26 '21 19:02 mewalig

+1

liquidaty avatar Jan 31 '22 07:01 liquidaty

#334

zcf0508 avatar Oct 14 '22 02:10 zcf0508

We just released v1.0 of driver.js which has been rewritten from the ground up. This has a better support for dynamic/asynchronous steps. Please have a look at the docs and do let me know if you face any issues.

kamranahmedse avatar Jul 05 '23 16:07 kamranahmedse