EQM: What happens when I refresh?

[nucleogenesis]

Summary

Makes some changes to improve behavior on page refresh, such that:

• If you enter the route onto the "replace questions" route and didn't come from quiz creation, then you'll be redirected to the quiz root page. This is because when the page loads you don't have any replacements in your pool so it'd always be empty anyway.
• Listens to the beforeunload event and uses the close confirmation message in it. I tried to inject our modal but the beforeunload event doesn't really allow for that so I used our message there.

References

Fixes #12390

Reviewer guidance

Try refreshing the page in various places.

If the quiz is one you've saved before, then you should reload to the place you were at, but without your changes having been saved.

• Add sections, then refresh, they should be gone
• Delete sections, then refresh, they should return
• etc

But! When you refresh on the replacements page, you should see the page load up with the side panel having been closed.

a11y

• Can you use the confirmation window that pops up on page refresh with keyboard nav?
• Does it announce as you'd expect, the message that is in the window on a screen reader?

[github-actions]

Build Artifacts

Asset type	Download link
PEX file	kolibri-.pex
Windows Installer (EXE)	kolibri-0.17.0a0.dev0+git.250.g513be8d0-windows-setup-unsigned.exe
Debian Package	kolibri_0.17.0a0.dev0+git.250.g513be8d0-0ubuntu1_all.deb
Mac Installer (DMG)	kolibri-0.17.0a0.dev0+git.250.g513be8d0-0.4.2.dmg
Android Package (APK)	kolibri-0.17.0a0.dev0+git.250.g513be8d0-0.1.3-debug.apk
TAR file	kolibri-0.17.0a0.dev0+git.250.g513be8d0.tar.gz
WHL file	kolibri-0.17.0a0.dev0+git.250.g513be8d0-py2.py3-none-any.whl

[rtibbles]

Code changes make sense - if @radinamatic signs off, this is good to go!

[radinamatic]

This still needs some work: refreshing the page always (after adding or deleting sections) gives me the TypeError: activeSection.value is undefined error, blank sidebar, and an empty space under the first section in the main window.

refresh.mp4

As I expected, the default browser alert popup/modal, is fully keyboard navigable 🙂
Tested on both Firefox and Chrome in Ubuntu 20.04
DB-logs.zip

[nucleogenesis]

@radinamatic thank you!

I've updated the PR to account for the case you ran into! Should now be the case that if you ever are on a section which doesn't exist in the URL parameters, then we redirect you to the first section, which should always exist by the nature of how the useQuizCreation module works.

[rtibbles]

Have verified the updates since @radinamatic's review. All working with no errors in the console, and properly redirecting to an existent section on refresh!