iOS - Blank White Screen. App Works fine on Android

Chad_C_ · ‎02-20-2017

Hi all, I built a polymer app and used the XDK to bundle it into an android and iOS app. The app works fine on android and there's a blank white screen when I try to run it on iOS. I have an apple developer account and the certificate and provisioning files are set up correctly. The app is built without any errors. When I tried to debug, I realize that none of my source files from my www/src and www/js folders are being imported. The index page is there and I can view the source in safari developer console, however, when I try click on the import for my main polymer element I get an error saying file cannot be found. The same code works fine on android. All my icons are in the package-assets folder. I've attached the build log. The code from my index.html page is below:

Intel XDK Version: 3759

Polymer Version: 1.6

Code from index.html:

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=no">
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline' https://fonts.googleapis.com; font-src 'self' https://fonts.gstatic.com 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'"/>

  <title>RLB Mobile</title>

  <link rel="manifest" href="manifest.json">

   <style>
        body {
          font-family: 'Roboto', 'Noto', sans-serif;
          overflow: auto;
          height: auto;
          background-color: #EEE;
        }
        @-ms-viewport { width: 100vw ; zoom: 100% ; }  @viewport { width: 100vw ; zoom: 100% ; }
        @-ms-viewport { user-zoom: fixed ; }           @viewport { user-zoom: fixed ; }
    </style>

    <!--<script src="cordova.js"></script>-->          <!-- phantom library, needed for Cordova api calls, added during build -->
    <!--<script src="js/app.js"></script>-->           <!-- recommended location of your JavaScript code relative to other JS files -->
    <!--<script src="xdk/init-dev.js"></script>-->     <!-- normalizes device and document ready events, see README for details -->
    <script>
    window.performance && performance.mark && performance.mark('index.html');
    // setup Polymer options
    window.Polymer = {lazyRegister: true, dom: 'shadow'};

    // load webcomponents polyfills
    (function() {
      if ('registerElement' in document
          && 'import' in document.createElement('link')
          && 'content' in document.createElement('template')) {
        // browser has web components
      } else {
        // polyfill web components
        var e = document.createElement('script');
        //e.src = 'bower_components/webcomponentsjs/webcomponents-lite.min.js';
        e.src = 'webcomponents-lite.min.js';
        document.head.appendChild(e);
      }
    })();

    // load pre-caching service worker
    if ('serviceWorker' in navigator) {
      window.addEventListener('load', function() {
        navigator.serviceWorker.register('service-worker.js');
      });
    }

  </script>
    
<link rel="import" href="src/rlb-mobile.html" async>     

</head>
<body>
    <rlb-mobile></rlb-mobile>
    <script src="js/jquery.min.js"></script>   
    <script src="js/md5.js"></script> 
    <script src="cordova.js"></script>          <!-- phantom library, needed for Cordova api calls, added during build -->
    <script src="js/app.js"></script>           <!-- recommended location of your JavaScript code relative to other JS files -->
    <script src="xdk/init-dev.js"></script>     <!-- normalizes device and document ready events, see README for details -->
</body>
</html>

My build settings, build log and ios xml config files are attached.

PaulF_IntelCorp · ‎02-21-2017

What happens if you do not use the <link> tag but just paste the contents of your src/rlb-mobile.html file directly into the index.html file, as an experiment, to determine if that is the source of the problem. It could be that attempting to read a file into the index.html is being blocked by the iOS webview or by the CSP rules.

Jerroyd_M_Intel · ‎02-24-2017

Hi Chad,

Does your application work on an Android phone? If not, what happens when you try to connect the cdt to the application on your device?