JSFiddle - React, Tailwind, and code Playground
HTML
<h1>
OneSignal Web Storage Tests
</h1>
Is Local Storage Supported: <span id='localstorage-test-result' class='result'>Running test...</span><br>
Is Indexed DB Supported: <span id='indexeddb-test-result' class='result'>Running test...</span><br>
Errors: <br><div id='errors'></div>
CSS
html {
font-family: sans-serif;
}
.error {
font-family: Monospace;
color: red;
}
.result {
font-weight: 600;
}
JavaScript
var errors = [];
function testLocalStorageSupport() {
if (!window.localStorage)
return false;
try {
localStorage['aCustomKey'] = 'value';
return localStorage['aCustomKey'] === 'value';
} catch (e) {
errors.push('Local Storage Error:' + JSON.stringify(e));
return false;
}
}
function testIndexedDbSupport() {
return new Promise(function (resolve, reject) {
try {
let request = indexedDB.open("test_indexeddb_support", 1);
request.onsuccess = (event) => {
resolve(true);
};
request.onerror = (event) => {
errors.push('Unable to open IndexedDB.' + event.target.error.name + ': ' + event.target.error.message);
reject(false);
};
}
catch (e) {
errors.push('Unable to open IndexedDB.' + event.target.error.name + ': ' + event.target.error.message);
reject(false);
}
});
}
function runLocalStorageTest() {
var isLocalStorageSupported = testLocalStorageSupport();
document.querySelector('#localstorage-test-result').innerHTML = isLocalStorageSupported;
window.errors = errors;
errors.forEach(function(error) {
document.getElementById('errors').insertAdjacentHTML('beforeend', '<p class="error">' + error + '</p>');
});
}
testIndexedDbSupport()
.then(function(isIndexedDbSupported) {
document.querySelector('#indexeddb-test-result').innerHTML = isIndexedDbSupported;
runLocalStorageTest();
})
.catch(function(error) {
document.querySelector('#indexeddb-test-result').innerHTML = 'error';
runLocalStorageTest();
});