Display interstitials in mobile setup webview

The mobile setup UI loads carrier activation site in a webview.
The webview is initially hidden, and then shown when the carrier
content is loaded. This prevents any interstitial pages from getting
displayed - in particular, an SSL error page in M71+.

While the issue should be fixed server-side, by the carrier, not showing
the interstitial (however scary it is), prevents the user from
proceeding with mobile activation. To unblock testing the flow, update
mobile setup UI to display the webview contents sooner - when the
carrier page load starts (instead of when the navigation to the target
page is committed, which will not happen if interstitial is shown).

BUG=894281

Change-Id: I36de9d00afcf0f058bac95a938381c75d5e9a18e
Reviewed-on: https://chromium-review.googlesource.com/c/1275138Reviewed-by: Steven Bennetts <stevenjb@chromium.org>
Commit-Queue: Toni Baržić <tbarzic@chromium.org>
Cr-Commit-Position: refs/heads/master@{#598869}

chrome/browser/resources/chromeos/mobile_setup.js

@@ -139,6 +139,27 @@ cr.define('mobile', function() {
           .contentWindow.postMessage({msg: 'loadedInWebview'}, paymentUrl);
     },
 
+    /**
+     * Shows the payment portal webview when the payment portal starts loading.
+     * The goal is to ensure that any interstitial UI in the webview is visible
+     * to the user, at least temporarily, until https://crbug.com/894281 is
+     * resolved.
+     *
+     * @param {string} paymentUrl The payment portal URL - used to restrict
+     *     origins to which the message is sent.
+     * @private
+     */
+    showPaymentPortalOnLoadStart_: function(paymentUrl, evt) {
+      if (!evt.isTopLevel ||
+          new URL(evt.url).origin != new URL(paymentUrl).origin) {
+        return;
+      }
+
+      $('finalStatus').classList.add('hidden');
+      $('systemStatus').classList.add('hidden');
+      $('portalFrame').classList.remove('hidden');
+    },
+
     /**
      * Loads payment URL defined by <code>deviceInfo</code> into the
      * portal frame webview.
@@ -187,6 +208,11 @@ cr.define('mobile', function() {
           'loadstop',
           this.sendInitialMessage_.bind(this, deviceInfo.payment_url));
 
+      frame.addEventListener(
+          'loadstart',
+          this.showPaymentPortalOnLoadStart_.bind(
+              this, deviceInfo.payment_url));
+
       if (deviceInfo.post_data && deviceInfo.post_data.length) {
         mobile.util.postDeviceDataToWebview(frame, deviceInfo);
       } else {