Profile Wizard

A simple multi-step form — Basic Info, Preferences, Review, Complete — with data that persists across steps and an unsaved-changes prompt if you try to leave early. The gentlest scenario to start with.

How this works

· Each step's inputs are written into a single cookie-backed draft object as you go, so moving Basic Info → Preferences → Review shows data you already entered, not a blank form.
· Trying to leave mid-wizard (closing the tab, navigating away) triggers a real browser beforeunload confirmation — not just a visual warning banner you can ignore.
· Completing the wizard clears the draft. The wizard-seed endpoint can jump you straight to any step — e.g. completed:true lands directly on Complete without filling anything in.

What you'll practice

Data entered on one step is still there if you go back to a previous step — real server-backed state, not a fresh form each time
A confirm dialog if you try to leave a step with unsaved changes (window.beforeunload)
A review step showing everything you entered before final submission
The simplest possible multi-page flow — a good one to start with if scenarios are new to you

1 Basic Info →
2 Preferences →
3 Review →
4 Complete

Start the scenario