Ah, the dreaded white screen of death, le sigh. This page should help in resolving the WSOD, and so should the Troubleshoot Page.
Debugging the WSOD
jDrupal.settings.debug = true;in your
- Open the
Consoletab in your browser's development tools
This allows you to see debug information and errors printed to the console log. It should reveal to you the error(s) causing the WSOD. Listed below are common WSOD conole log error messages and how to fix them.
Common WSOD Issues
Uncaught ReferenceError: jDrupal is not defined
DrupalGap can't find jDrupal. First, make sure the
jdrupal.min.js exists in your app's folder. If it doesn't, download jDrupal:
cd app wget https://raw.githubusercontent.com/signalpoint/jDrupal/8.x-1.x/jdrupal.min.js --no-check-certificate
Second, make sure
jdrupal.min.js is included in your
index.html file before the
GET https://example.com/jdrupal/connect?_format=json 403 (Forbidden) GET https://example.com/jdrupal/connect?_format=json 404 (Not Found) deviceready connect failed
The jDrupal module for your Drupal 8 site is either not enabled, or not configured correctly. Refer to the jDrupal README for more information.
Failed to load resource: net::ERR_NETWORK_CHANGED
If this mentions a
xhr network status problem for csrf token, check that your Drupal site is online and that you have an Internet connection. If your app is behind a VPN, make sure you are connected to that as well.
WSOD while compiling to device
The WSOD is a common problem when first compiling your app to an Android or iOS device. Again, the best way to debug this is to utilize your browser's
Console tab in its development tools. In both cases, we're assuming your device is already connected to your computer via USB and you've successfully compiled the app, but are experiencing the WSOD.
For Android devices, open Chrome, go to
Tools -> Inspect devices, then click the
Console tab to spot any errors.
For iOS devices, open Safari, and use its developer tools to inspect your device, then click the
Console tab to spot any errors.
When we compile an app directly to our device for testing, we need to include the
cordova.js file in the head of our index.html file. Take a look at the
cordova.index.html file for an example of how to include the
cordova.js file in your
index.html file. If we don't include this file, and try to run an app directly on our device, we'll most likely get a WSOD.
Did you install all the needed cordova plugins?
Digging deeper into the WSOD
Next, stepping through the DrupalGap bootstrap process and printing messages to the
console.log() each step of the way, is the absolute best way to debug the WSOD.
You use can modify the
drupalgap.js directly, or use
Grunt to build the
drupalgap.min.js from the
Once you're ready to place some
console.log() statements in DrupalGap core, here are the first few functions that are called:
dg.start(); dg.deviceready(); dg.bootstrap(); etc...
console.log() messages in these functions each step of the way. That should reveal to you what line(s) are crashing.
This is very important in debugging the WSOD, so please try this and report your findings in one of the issue queues.