Soundcloud: Detect missing localStorage support and inform the user

Question

Recently, I had trouble accessing the Next Soundcloud. No matter which url I tried, the general error page appeared, telling me something went wrong and recommending modern browsers.

The browser console said that the app failed when accessing window.localStorage:

TypeError: localStorage is null

Indeed, I had dom.storage globally disabled in my Firefox config. There may be other users out there who are using a modern browser but have dom.storage disabled and thus may feel left alone with this generic error page.

I'd appreciate something like an alert box that informs the users about missing support for that particular feature. Try this fiddle with dom.storage disabled/enabled. It's implemented in a few minutes but makes the user experience way better, I think.

So, are there already some kind of specific error pages being planned for Soundcloud?

Answer 1

From reading your question, it's not entirely clear to me if you want to check for localStorage support, or specificity check if someone has the dom.storage setting enabled/disabled in Firefox.

Checking for localStorage support is fairly easy:

function hasLocalStorage() {
    return window.localStorage && !!window.localStorage.getItem
}

Modernizr is a fairly popular library which contains a bunch of tests, and some polyfills.

As for checking dom.storage, no, that will never be possible. It would be a serious security/privacy problem if a website would be able to read settings from the browser. The last few years browsers have moved to providing less information to servers, not more.
See this page for example.

The best you can do is check for localStorage support, and if it's not available, display a help page with instructions for all the browsers.