This PR revamps e2e tests, while adding a new one for the interactive
demo guide:
- Bumps Cypress from `9.7.0` to `12.11.0`;
- Bumps Cypress GH action from `v2` to `v5`;
- Makes any adjustments needed;
- Fixes a lot of issues identified with existing tests;
- Adds new `demo.spec.ts` e2e test that covers the entire demo guide
flow;
**Note:** Currently does not include `demo.spec.ts` in the GH action, as
it
[fails](https://github.com/Unleash/unleash/actions/runs/4896839575/jobs/8744137231?pr=3656)
on step 2.13 (last step of "user-specific" topic). It runs perfectly
fine locally, though.
Might be placebo, but in general tests seem less flaky now and they may
even be faster (especially when not adding the `demo` one, which would
always take a long time).
https://linear.app/unleash/issue/2-986/feedback-from-sebastian
Implements the items mentioned in the task:
- Refactors logic to track completion separately;
- When finishing a topic, jumps to the next unfinished topic it can
find;
- Shows the finish dialog when finishing a topic, as long as completion
is 100%;
- Changes the guide overlay behavior and implements the necessary
changes to adapt to light and dark mode;
- Fixes an issue where some guide dialogs would close when clicking
outside;
- Added a final "toggle" step for each topic (still needs alignment,
different task);
- Improve navigation logic to hopefully fix the feature toggle name
sorting;
Relates to [roadmap](https://github.com/orgs/Unleash/projects/10) item:
#3537
https://linear.app/unleash/issue/2-946/explore-and-implement-options-for-user-tracking
Adds user tracking to the interactive demo, so we can measure how users
are using this feature and improve it in the feature.
## Events
- **start** - When the user starts the demo by clicking on the "Try
Unleash Demo" button;
- **finish** - When the user finishes the demo by seeing the "You
finished the demo" dialog;
- **restart** - When the user decides to restart the demo on the "You
finished the demo" dialog;
- **close** - When the user closes a demo dialog;
- **topic** - In what topic this happened (topic title, can also be
`start` if user closes on the start dialog);
- **step** - In what step this happened (step number, `1` would mean
first step);
- **start_topic** - When the user decides to start a specific topic by
clicking it in the list;
- **topic** - What topic was clicked (topic title);
- **ask_questions** - When the user decides to ask questions by clicking
the appropriate option in the top banner;
- **see_plans** - When the user decides to see the plans by clicking the
appropriate option in the top banner;
- **plan** - What plan was clicked (one of: `open_source`, `pro`,
`enterprise` or `compare_plans`);
- **open_demo_web** - User decided to open the demo website using the
link on the start dialog;
- **view_demo_link** - User decided to open the start dialog again on
the bottom of the topics list;
Relates to [roadmap](https://github.com/orgs/Unleash/projects/10) item:
#3537
