MD Settings: Fix subpage visibility and add appearance page tests

chrome/test/data/webui/settings/settings_main_test.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('settings_main_page', function() {
+cr.define('settings_test', function() {
   /**
    * Extending TestBrowserProxy even though SearchManager is not a browser proxy
    * itself. Essentially TestBrowserProxy can act as a "proxy" for any external
    * dependency, not just "browser proxies" (and maybe should be renamed to
    * TestProxy).
    *
    * @implements {SearchManager}
    * @extends {settings.TestBrowserProxy}
    */
   var TestSearchManager = function() {
     settings.TestBrowserProxy.call(this, [
       'search',
     ]);
 
     /** @private {boolean} */
     this.matchesFound_ = true;
 
     /** @private {?settings.SearchRequest} */
     this.searchRequest_ = null;
-  }
+  };
 
   TestSearchManager.prototype = {
     __proto__: settings.TestBrowserProxy.prototype,
 
     /**
      * @param {boolean} matchesFound
      */
     setMatchesFound: function(matchesFound) {
       this.matchesFound_ = matchesFound;
     },
 
     /** @override */
     search: function(text, page) {
       this.methodCalled('search', text);
 
       if (this.searchRequest_ == null || !this.searchRequest_.isSame(text)) {
         this.searchRequest_ = new settings.SearchRequest(text);
         this.searchRequest_.finished = true;
         this.searchRequest_.updateMatches(this.matchesFound_);
         this.searchRequest_.resolver.resolve(this.searchRequest_);
       }
       return this.searchRequest_.resolver.promise;
     },
   };
 
-  function registerTests() {
-    var settingsPrefs = null;
+    suite('MainPageTests', function() {
+      /** @type {?SettingsPrefsElement} */
+      var settingsPrefs = null;
 
-    suiteSetup(function() {
-      settingsPrefs = document.createElement('settings-prefs');
-      return CrSettingsPrefs.initialized;
-    });
-
-    suite('MainPageTests', function() {
       /** @type {?TestSearchManager} */
       var searchManager = null;
 
       /** @type {?SettingsMainElement} */
       var settingsMain = null;
 
+      suiteSetup(function() {
+        CrOncStrings = {};
+        settingsPrefs = document.createElement('settings-prefs');
+        var fakePrefs = [];
+        var fakeApi = new settings.FakeSettingsPrivate(fakePrefs);
+        settingsPrefs.initialize(fakeApi);
+        return CrSettingsPrefs.initialized;
+      });
+
       setup(function() {
         settings.navigateTo(settings.Route.BASIC);
         searchManager = new TestSearchManager();
         settings.setSearchManagerForTesting(searchManager);
         PolymerTest.clearBody();
         settingsMain = document.createElement('settings-main');
         settingsMain.prefs = settingsPrefs.prefs;
         settingsMain.toolbarSpinnerActive = false;
         // Set default page visibility.
         settingsMain.pageVisibility = {};
         document.body.appendChild(settingsMain);
       });
 
-      teardown(function() { settingsMain.remove(); });
+      teardown(function() {
+        settingsMain.remove();
+      });
 
       test('searchContents() triggers SearchManager', function() {
         Polymer.dom.flush();
 
         var expectedQuery1 = 'foo';
         var expectedQuery2 = 'bar';
         var expectedQuery3 = '';
 
         return settingsMain.searchContents(expectedQuery1).then(function() {
           return searchManager.whenCalled('search');
@@ skipping 72 matching lines @@
         // Clearing the search box is effectively a search for the empty string.
         return settingsMain.searchContents('').then(function() {
           Polymer.dom.flush();
           assertTrue(noSearchResults.hidden);
           assertToggleContainerVisible(true);
         });
       });
 
       /**
        * Asserts the visibility of the basic and advanced pages.
-       * @param {string} Expected 'display' value for the basic page.
-       * @param {string} Expected 'display' value for the advanced page.
+       * @param {string} expectedBasic 'display' value for the basic page.
+       * @param {string} expectedAdvanced 'display' value for the advanced page.
        */
       function assertPageVisibility(expectedBasic, expectedAdvanced) {
         Polymer.dom.flush();
         var page = settingsMain.$$('settings-basic-page');
-        assertEquals(
-            expectedBasic, page.$$('#basicPage').style.display);
-        assertEquals(
-            expectedAdvanced,
-            page.$$('#advancedPageTemplate').get().style.display);
+        assertEquals(expectedBasic, page.$$('#basicPage').style.display);
+
+        var advanced = page.$$('#advancedPage');
+        if (!advanced) {
+          assertEquals(expectedAdvanced, 'none');
+        } else if (advanced.hidden) {
+          assertEquals(expectedAdvanced, 'none');
+        } else {
+          assertEquals(expectedAdvanced, advanced.style.display);
+        }
       }
 
       // TODO(michaelpg): It would be better not to drill into
       // settings-basic-page. If search should indeed only work in Settings
       // (as opposed to Advanced), perhaps some of this logic should be
       // delegated to settings-basic-page now instead of settings-main.
 
       /**
        * Asserts the visibility of the basic and advanced pages after exiting
        * search mode.
        * @param {string} Expected 'display' value for the basic page.
        * @param {string} Expected 'display' value for the advanced page.
        * @return {!Promise}
        */
       function assertPageVisibilityAfterSearch(
           expectedBasic, expectedAdvanced) {
         searchManager.setMatchesFound(true);
         return settingsMain.searchContents('Query1').then(function() {
           searchManager.setMatchesFound(false);
           return settingsMain.searchContents('');
         }).then(function() {
           assertPageVisibility(expectedBasic, expectedAdvanced);
         });
       }
 
       test('exiting search mode, advanced collapsed', function() {
         // Simulating searching while the advanced page is collapsed.
         settingsMain.currentRouteChanged(settings.Route.BASIC);
         Polymer.dom.flush();
+        assertPageVisibility('', 'none');
         return assertPageVisibilityAfterSearch('', 'none');
       });
 
       // Ensure that clearing the search results restores both "basic" and
       // "advanced" page, when the search has been initiated from a subpage
       // whose parent is the "advanced" page.
       test('exiting search mode, advanced expanded', function() {
         settings.navigateTo(settings.Route.SITE_SETTINGS);
         Polymer.dom.flush();
         return assertPageVisibilityAfterSearch('', '');
@@ skipping 27 matching lines @@
         var advancedToggle =
             getToggleContainer().querySelector('#advancedToggle');
         assertTrue(!!advancedToggle);
 
         MockInteractions.tap(advancedToggle);
         Polymer.dom.flush();
 
         assertPageVisibility('', 'none');
       });
 
+      test('navigating to an advanced page expands advanced', function() {
+        settings.navigateTo(settings.Route.PRIVACY);
+        Polymer.dom.flush();
+        return Polymer.Base.async(function() {
+          assertToggleContainerVisible(true);
+          assertPageVisibility('', '');
+        });
+      });
+
       test('navigating to a basic page does not collapse advanced', function() {
         settings.navigateTo(settings.Route.PRIVACY);
         Polymer.dom.flush();
+        return Promise.all([
+          Polymer.Base.async(function() {
+            assertToggleContainerVisible(true);
+            assertPageVisibility('', '');
 
-        assertToggleContainerVisible(true);
+            settings.navigateTo(settings.Route.PEOPLE);
+            Polymer.dom.flush();
+          }),
+          Polymer.Base.async(function() {
+            assertPageVisibility('', '');
+          })
+        ]);
+      });
 
-        settings.navigateTo(settings.Route.PEOPLE);
+      test('basic pageVisibility', function() {
         Polymer.dom.flush();
+        var page = settingsMain.$$('settings-basic-page');
+        assertTrue(!!page);
+        return Polymer.Base.async(function() {
+          assertTrue(!!page.$$('settings-section[section="people"]'));
+          assertTrue(!!page.$$('settings-section[section="appearance"]'));
+          assertFalse(!!page.$$('settings-section[section="privacy"]'));
+          assertFalse(
+              !!page.$$('settings-section[section="passwordsAndForms"]'));
+        });
+      });
 
-        assertPageVisibility('', '');
+      test('advanced pageVisibility', function() {
+        Polymer.dom.flush();
+        var page = settingsMain.$$('settings-basic-page');
+        var advancedToggle = page.$$('#advancedToggle');
+        assertTrue(!!advancedToggle);
+        MockInteractions.tap(advancedToggle);
+        Polymer.dom.flush();
+        return Polymer.Base.async(function() {
+          assertTrue(!!page.$$('settings-section[section="people"]'));
+          assertTrue(!!page.$$('settings-section[section="appearance"]'));
+          assertTrue(!!page.$$('settings-section[section="privacy"]'));
+          assertTrue(
+              !!page.$$('settings-section[section="passwordsAndForms"]'));
+        });
+      });
+
+      test('custom pageVisibility', function() {
+        Polymer.dom.flush();
+        var page = settingsMain.$$('settings-basic-page');
+        assertTrue(!!page);
+        Polymer.dom.flush();
+        return Promise.all([
+          Polymer.Base.async(function() {
+            assertTrue(!!page.$$('settings-section[section="people"]'));
+            assertTrue(!!page.$$('settings-section[section="appearance"]'));
+          }),
+          Polymer.Base.async(function() {
+            page.set('pageVisibility.appearance', false);
+            Polymer.dom.flush();
+          }),
+          Polymer.Base.async(function() {
+            assertTrue(!!page.$$('settings-section[section="people"]'));
+            assertFalse(!!page.$$('settings-section[section="appearance"]'));
+          })
+        ]);
       });
     });
-  }
-
-  return {
-    registerTests: registerTests,
-  };
 });