Test the maximum nesting depth in IndexedDB objects
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html> | |
<head> | |
<title>Test deeply-nested objects in IndexedDB</title> | |
<style> | |
body { | |
margin: 40px auto; | |
max-width: 800px; | |
} | |
html { | |
font-family: Arial, Helvetica, sans-serif; | |
} | |
</style> | |
</head> | |
<body> | |
<h1>Test deeply-nested objects in IndexedDB</h1> | |
<p>Choose a depth, and then try to put an object into IndexedDB that's nested to that depth.</p> | |
<form id="form"> | |
<label for="depth_input">Depth:</label> | |
<input id="depth_input" type="number"></input> | |
<input type="submit" value="Go!" id="submit"> | |
</form> | |
<pre id="output"></pre> | |
<script> | |
(function () { | |
var DEFAULT_DEPTH = 500; | |
var output = document.getElementById('output'); | |
var form = document.getElementById('form'); | |
var submit = document.getElementById('submit'); | |
var depthInput = document.getElementById('depth_input'); | |
form.onsubmit = function (e) { | |
e.preventDefault(); | |
} | |
submit.onclick = function (e) { | |
testIt(); | |
e.preventDefault(); | |
} | |
depthInput.value = DEFAULT_DEPTH; | |
function log(msg) { | |
output.innerHTML = output.innerHTML || ''; | |
output.innerHTML += "\n" + (msg || ''); | |
} | |
function createDeeplyNestedObject(depth) { | |
var obj = {id: 'foo'}; | |
var key = obj; | |
for (var i = 0; i < depth; i++) { | |
key = key[i] = {}; | |
} | |
return obj; | |
} | |
function testIt() { | |
log(); | |
var req = indexedDB.open('test', 1); | |
req.onupgradeneeded = function (e) { | |
var db = e.target.result; | |
if (db.objectStoreNames.contains('test')) { | |
db.deleteObjectStore('test'); | |
}; | |
db.createObjectStore('test', {keyPath: 'id'}); | |
} | |
req.onsuccess = function (e) { | |
var db = e.target.result; | |
var depth = parseInt(depthInput.value, 10); | |
log('Building a deeply-nested object of depth ' + depth + '...'); | |
var obj = createDeeplyNestedObject(depth); | |
log('Built a deeply-nested object.'); | |
var txn = db.transaction(['test'], 'readwrite'); | |
log('Trying to insert deeply-nested object...'); | |
var putReq = txn.objectStore('test').put(obj); | |
putReq.onsuccess = function() { | |
log('Successfully inserted deeply-nested object'); | |
var getReq = txn.objectStore('test').get('foo'); | |
getReq.onsuccess = function () { | |
log('Successfully retrieved deeply-nested object'); | |
} | |
getReq.onerror = log; | |
} | |
putReq.onerror = log; | |
txn.oncomplete = function () { | |
log('Transaction finished'); | |
}; | |
txn.onerror = log; | |
}; | |
req.onerror = log; | |
} | |
testIt(); | |
})(); | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment