Driver.js

A dimmed page with a cut-out around one element

Driver.js darkens the page, leaves the target element uncovered and opens a popover beside it with a title, some text and buttons. highlight() does this for a single element; drive() runs a list of steps as a product tour. Two optional modules reuse the same popover: hints, which are pulsing beacons placed on the page, and a getting-started checklist. The library is written in TypeScript and has no dependencies.

Click-to-advance steps, pulsing hints and a setup checklist

• A step can wait for the user. With advanceOnClick, clicking the highlighted element moves the tour on, and waitForElement gives an element rendered on demand, such as one inside a modal the previous step opened, up to N milliseconds to show up.
• skipMissingElement skips a step whose element is missing from the DOM instead of falling back to a centered popover.
• The destroy hooks receive a reason that tells apart a finished tour, a close through the button, Escape or an overlay click, a takeover by another instance, and a stop called from code.
• Arrow keys and Escape drive the tour unless the matching button is hidden or disabled. Button labels and the close button's aria-label (closeBtnLabel) are configurable, so a tour can be translated.
• Hints open on click, in any order, with no overlay by default, and the page stays usable. Hints and tours coexist without extra code: the beacons step aside while a tour runs and return when it ends.
• The checklist is a widget pinned to a corner of the screen. Each item starts a tour, follows a link, runs a function, or ticks itself once its completeWhen function returns true.
• Hints and the checklist are imported from driver.js/hints and driver.js/checklist, each with its own stylesheet, so a site that only runs tours never loads them.

Steps in code, with storage and analytics left to the host app

Tours are written in JavaScript. Each step is an object that points at its element with a CSS selector, and the docs describe no other way to build one. The library is meant for whoever owns the front-end code. Usertour, a platform you can self-host with Docker, keeps its flows in its own account instead, with a change history and completion rates for each flow.

Nothing carries over from one visit to the next. A dismissed hint stays dismissed for the current session only, and the checklist stores nothing at all. Its progress comes in through the completed option and goes out through onProgress; saving it to localStorage, an API or the user record is up to the app. Checklist events reach onEvent the same way, ready to be forwarded to whatever analytics tool the app already uses.

The README rejects the "yet another tour library" label. Tours, it says, are only one use of an overlay on the page, next to contextual help while someone fills in a form, the "turn off the lights" effect of video players, or a plain modal. It also puts the library at about 5 kB gzipped, against 12 kB or more for other libraries it does not name.

Version 1.10.2, released on October 18, 2026, is the eighth release since June. Nothing shipped between 1.4.0 in November 2025 and 1.5.0 on June 23, 2026. Hints landed in 1.8.0 in July and checklists in 1.10.0 on October 15. A minor version can break existing code: 1.6.0, flagged "Breaking" in its notes, stopped styling custom buttons added to the popover footer. The CDN link in the installation guide points at @latest, which follows every release, breaking ones included.