Phonegap IndexedDb not commiting data in Windows Phone 10 on larger databases

Question

I have a phonegap app that pulls data from a (CORS) web service and stores it locally in IndexedDB.

This all works fine on Android, iOS (using a shimm), and Windows Phone 8.1 but on Windows Phone 10 if the dataset is large it does not complete the transaction, there's 2 specific tables it fails on currently, one with some items of 276 records (total size of json object is 350KB) and one that contains base64 photo data of 16 records (json object size just over 4MB), which isn't that large.

The code below is what saves the data into the database:

getDataSingleTable: function (table, callback) {
    // get data for a single table
    if (!table) {
        // table name from array
        table = json_xfer.getTableList[json_xfer.currentGetTable];
    }

    var numRecords = 0;
    var anchor = '#li_get_' + table;
    var txt = $(anchor).html();
    $(anchor).html(txt + ' fetching...');

    // get data from CORS call
    json_xfer.corsGetdata(table, function (data) {
        // data is an array of json objects
        numRecords = data.length;
        console.log('fetched ' + table + ' ' + numRecords + ' row(s)');

        var trn = app.db.transaction([table], 'readwrite');
        var doDelete = xfer.latestUpds.length === 0;
        var obs = trn.objectStore(table);

        $(anchor).html(txt + ' applying ' + numRecords + ' row(s)...');
        var numSaved = 0;


        json_xfer.deleteLocalData(obs, doDelete, function () {
            if (numRecords === 0) {
                // in iOS if there's no records then trn.oncomplete will not be fired so
                // the code from that is now moved to another function we can call from here
                json_xfer.gotDataSingleTable(anchor, txt, numRecords);
            } else {
                // loop data
                data.forEach(function (row) {
                    // save data
                    var req = obs.put(row);
                    req.onerror = onIDBError;
                    req.onsuccess = function (event) {
                        numSaved++;
                        console.log('saved record ' + table + ' ' + row.id + ' ' + numSaved + '/' + numRecords);
                    };
                });
            }
        });

        trn.oncomplete = function () {
            console.log('trn.oncomplete(' + table + ')');
            if (callback) {
                callback();
            } else {
                if (numRecords > 0) {
                    json_xfer.gotDataSingleTable(anchor, txt, numRecords);
                }
            }

        };
        trnWrite.onabort = function() {
            console.log('transaction aborted');
        };
    });


},

It's pretty much doing this: Get data from CORS web service (returns JSON array) Clear down dataStore Loop the JSON array and save into dataStore

In Windows 10 it gets to the last console.log (saved record Photos 5b9200e3-4b33-4f4f-k0r3-2172139d36c3 16/16) but the trn.oncomplete never gets triggered. The transaction.onAbort does get triggered

It appears to be a size issue, once the database has grown to a certain size (around 2 to 4MB) any save to the database fails.

The calls to external functions should be self explanatory by their names.

Answer 1

The solution is to build using the "windows" platform and not the "wp8"