Validate the ability to create an idb store #417
Merged
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
The prior checks (line 1437 currently) test whether or not the browser supports the necessary features, but it doesn't actually exercise whether or not we're allowed to create a store here. Some browsers (such as Safari) have additional restrictions in e.g. cross-origin iframes that preclude us from successfully opening an idb store. This check ensures that we can actually create a store, or fails fast if not.
The error caused issues whether or not idb was ultimately used as the store for learnr state.
Without this, Safari is throwing the following error:
Testing/Validation
This one's a doozy..
This PR better handles scenario where a feature we use to track the state of the user's learnr lesson called "IndexedDB" (IDB) is not supported. Previously, if a browser didn't support IDB we would silently fail and just throw away the user's learnr state at the end of the lesson. That's acceptable if the browser isn't able to store anything.
Unfortunately there's a bug in which learnr thought that IDB was supported in certain conditions but then when the browser goes to use it we only then see a failure. learnr didn't handle that gracefully. This PR fixes that.
There's a 2x2 matrix of scenarios that we care about:
Prior to this PR, if IDB was not available you'd just get an error in the console and various features didn't work at all (e.g. multiple choice questions didn't render). As of this PR, the top right box should now work just fine. And the lower right box should work with the noted caveat that results aren't going to be saved.
(Note that the test app I setup for custom storage just uses a single file to store everyone's state. So if you had multiple users active on the app at the same time, they'd just be overwriting each other's state which would be confusing.)
The easiest way to simulate an environment where IDB is not available currently is to use Safari where the learnr doc is hosted inside a cross-origin iframe.
I went ahead and deployed a few of these for testing:
In a browser like Firefox or Chrome, IDB is always available even with cross-origin iframes. But if you use Safari on those links, you'll have an environment where IDB fails.
custom-9006
, you should see state preserved across refreshes (and even in between browsers). Withidb-9006
, all of the features should work except when you refresh the page, you'll start over at a blank app. Because we have no way to store learnr state so we silently gracefully fail.All that to say:
custom-9005
oridb-9005
on Safari and a JS error. The multiple choice question doesn't load properly. (Click the "Sample Learnr Widgets" section)custom-9006
works and preserves state across refreshesidb-9006
works other than starting over every time you refresh (no state storage)custom-9006
and onidb-9006
-- including preserving state across refreshes on both.