Lazy load lock_screen.html in options.

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

 // Copyright 2016 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 cr.define('options', function() {
   var Page = cr.ui.pageManager.Page;
   var PageManager = cr.ui.pageManager.PageManager;
 
   /**
    * QuickUnlockConfigureOverlay class
    * Dialog that allows users to configure screen lock.
    * @constructor
    * @extends {cr.ui.pageManager.Page}
    */
   function QuickUnlockConfigureOverlay() {
     Page.call(this, 'quickUnlockConfigureOverlay',
               loadTimeData.getString('lockScreenTitle'),
               'quick-unlock-configure-overlay');
 
   }
 
   cr.addSingletonGetter(QuickUnlockConfigureOverlay);
 
   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 */
     didClosePage: function() {
       settings.navigateTo(settings.Route.PEOPLE);
     },
 
     /** @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');
 
       var checkbox =
           lockScreen.root.querySelector('div.settings-box.single-column');
       checkbox.hidden = true;
 
       var passwordPrompt = lockScreen.root.
           querySelector('settings-password-prompt-dialog');
       passwordPrompt.addEventListener('close', function() {
         if (!lockScreen.setModes_) {
           QuickUnlockConfigureOverlay.dismiss();
         }
       }.bind(this));
     },
 
   };
 
   QuickUnlockConfigureOverlay.dismiss = function() {
     PageManager.closeOverlay();
   };
 
   // Export
   return {
     QuickUnlockConfigureOverlay: QuickUnlockConfigureOverlay
   };
 });