Lazy load lock_screen.html in options.

chrome/browser/resources/options/chromeos/quick_unlock_configure_overlay.js

Index: chrome/browser/resources/options/chromeos/quick_unlock_configure_overlay.js
diff --git a/chrome/browser/resources/options/chromeos/quick_unlock_configure_overlay.js b/chrome/browser/resources/options/chromeos/quick_unlock_configure_overlay.js
index 5996d71dc0ab7c615b08ea648848ac7221899cff..887bcc07726a067acbd87cfb6f6a9f9fce9813e1 100644
--- a/chrome/browser/resources/options/chromeos/quick_unlock_configure_overlay.js
+++ b/chrome/browser/resources/options/chromeos/quick_unlock_configure_overlay.js
@@ -24,12 +24,39 @@ cr.define('options', function() {
   QuickUnlockConfigureOverlay.prototype = {
     __proto__: Page.prototype,
 
+    /** @private */
+    lazyLoadPolymer_: function() {
+      /** @const */ var idleTimeoutMs = 500;
+      window.requestIdleCallback(
+        this.ensurePolymerIsLoaded_.bind(this, function() {}),
+        { timeout: idleTimeoutMs });
+    },
+
+    /** @private */
+    ensurePolymerIsLoaded_: function(onload) {
+      if (this.loaded_) {
+        onload();
+        return;
+      }
+
+      var link = document.createElement('link');
+      link.setAttribute('rel', 'import');
+      link.setAttribute('href', 'chrome://settings-frame/options_polymer.html');
+      link.onload = function() {
+        this.loaded_ = true;
+        onload();
+      }.bind(this);
+      document.head.appendChild(link);
+    },
+
     /** @override */
     initializePage: function() {
       Page.prototype.initializePage.call(this);
       $('screen-lock-done').onclick = function() {
         QuickUnlockConfigureOverlay.dismiss();
       };
+
+      this.lazyLoadPolymer_();

[Dan Beam, 2016/12/03 02:05:06]

i don't think we should load polymer until we actually click the "Manage screen
lock" link, IMO

I've uploaded a slightly simpler version of this using Promises and only lazy
loading the bundle on didShowPage here:
https://codereview.chromium.org/2529293015/

     },
 
     /** @override */
@@ -39,6 +66,14 @@ cr.define('options', function() {
 
     /** @override */
     didShowPage: function() {
+      this.ensurePolymerIsLoaded_(this.onDidShowPage_.bind(this));
+    },
+
+    /**
+     * Called when polymer has been loaded and the dialog should be displayed.
+     * @private
+     */
+    onDidShowPage_: function() {
       settings.navigateTo(settings.Route.LOCK_SCREEN);
       var lockScreen = document.querySelector('settings-lock-screen');