Having a subtle javascript problem in the web browser on an older iPhone and also on an older Samsung S4. It runs nicely on a 2-year old Acer phone. Trying to pinpoint the problem I split the JS in several script blocks and put alert calls in each:
<script>
// ...JS code...
alert('JS0 end');
</script>
<script>
try{
alert('JS1 start');
// button handler to scan a barcode
function scan_barcode() {
$('#div_viewarea').show();
$('#input_barcode').val('');// clear the barcode field
log('scanning...');//clear message field
// install the handler to process a barcode fount by quagga
Quagga.onDetected(quagga_found_barcode);//callback stops Quagga
// The Quagga config data for the LiveStream method accessing the camera directly
var quagga_config_livestream = {
inputStream: {
//constraints: { width: 500, height: 500 },
//area: { top: '50%', right: '50%', left: '50%', bottom: '50%' },
target: document.querySelector('#div_viewarea'),
name: "Live",
type: "LiveStream"
},
quagga_decoders
};
// initialize/start/run the Quagga barcode module
Quagga.init(quagga_config_livestream, quagga_on_init);
return;
}
alert('JS1 end');
}
catch(e){
alert('exception 1: ' + e);
}
</script>
<script>
// ...JS code...
alert('JS2 end');
</script>
On the Acer phone I get dialogs for JS0/1/2, but on the iPhone only for JS0+2, so something goes wrong in the middle script block where I show the full JS code.
Running the page on firefox on Windows, the F12 debugger shows no problems. But on the mobile phone browsers there is no F12 debugger.
I also tried to get the JS exception with try/catch, but no dialog is shown for the exception.
So my questions are: - what is the problem in the middle script block? - how to debug JS code on a phone? - are there better methods than just splitting in several script blocks?
Incidentally, the code in the second block is not very interesting on the older phones, because according to the docs on Quagga , the older phones do not support the MediaDevices API. But if I put all the JS code in one script block, the JS past the problem in the middle won't run at all.
Update:
I regard this as a bug in older browser/devices. It works OK in Firefox on the Samsung S4 though. I was able to isolate the problem to the assignment of variable quagga_config_livestream but find it extremely surprising that neither an exception is fired, nor the earlier alert showed its dialog. Because this bug occurs in a piece of JS code that is not relevant for older devices that do not support the MediaDevices API, I just sandboxed that few lines of JS in its own script block and won't bother to install new tools to remotely debug this code on the device itself.
