🚀 Migration Guide: Intro.js v8

This guide will help you migrate from Intro.js v7 to v8, covering breaking changes, deprecations, and new features.

What’s New in v8

• Fully modular architecture (with tour() and hint() separated)
• New tooltipRenderAsHtml option for tour tooltips (default: true)
• Better accessibility and customization
• Cleaner lifecycle handling

Breaking Changes

1. introJs() is deprecated

❗ introJs() is deprecated in v8.
Use introJs.tour() or introJs.hint() instead.

Before (v7):

introJs().start();

Now (v8):

introJs.tour().start();
// or for hints
introJs.hint().addHints([...]).showHints();

2. tooltipRenderAsHtml (New option in Tour)

Tour tooltips now render HTML by default. If your intro content contains HTML, it will be rendered as HTML automatically.

Default: true

To disable HTML rendering and show content as plain text:

introJs.tour().setOptions({
  tooltipRenderAsHtml: false,
  steps: [
    { intro: "<b>This will be shown as plain text</b>" }
  ]
});
 

🛡 Use caution when injecting user-generated HTML to avoid XSS vulnerabilities.

Removed or Deprecated

• Deprecated: introJs()
• Removed legacy internal APIs
• Removed automatic HTML rendering assumption in older steps

Updated API Design

Migration Steps

1. Replace introJs() with introJs.tour() or introJs.hint()
2. Use tooltipRenderAsHtml: false if you want plain text in tooltips
3. Review any customized tooltip or hint behavior
4. Test onboarding flows thoroughly

Need Help?

Open an issue or start a discussion on GitHub:
👉 https://github.com/usablica/intro.js (opens in a new tab)

Happy onboarding with v8! 🎉