Display material design policies grouped by tags.

chrome/test/data/webui/policy_ui_material.js

+// Copyright (c) 2015 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.
+
+/** @const {string} Path to source root. */
+var ROOT_PATH = '../../../../';
+
+// Polymer BrowserTest fixture.
+GEN_INCLUDE(
+    [ROOT_PATH + 'chrome/test/data/webui/polymer_browser_test_base.js']);
+
+GEN('#include "chrome/test/data/webui/policy_ui_material.h"');
+
+/** @type {Object} * @const */
+var GROUP = {
+  ADMIN: 'fullAdminAccess',
+  SECURITY: 'systemSecurity'
+};
+
+/** @type {!Array<string>} @const */
+var GROUP_NAMES = Object.keys(GROUP).map(key => GROUP[key]);
+
+/** @type {Object} @const */
+var POLICY = {
+  SAMPLE_A: {
+    NAME: 'RandomPolicy',
+    TAGS: [GROUP.ADMIN, GROUP.SECURITY]
+  },
+  SAMPLE_B: {
+    NAME: 'AnotherPolicy',
+    TAGS: [GROUP.ADMIN]
+  }
+};
+
+/**
+ * Test fixture for policy ui WebUI testing.
+ * @constructor
+ * @extends {PolymerTest}
+ */
+function PolicyUiMaterialWebUITest() {
+}
+
+PolicyUiMaterialWebUITest.prototype = {
+  __proto__: PolymerTest.prototype,
+
+  /** @override */
+  browsePreload: 'chrome://md-policy',
+
+  /** @override */
+  runAccessibilityChecks: true,
+
+  /** @override */
+  accessibilityIssuesAreErrors: true,
+
+  /** @override */
+  typedefCppFixture: null,
+
+  /**
+   * Set extra libraries relative to source root.
+   * @override
+   */
+  extraLibraries: PolymerTest.getLibraries(ROOT_PATH),
+
+  /**
+   * Creates object as send by chromium. Can include only a subset of policies.
+   * @param {Array.Object=} opt_policies Defaults to all policies.
+   * @return {Object} Name object with policies within 'chromePolicyNames' key.
+   */
+  createPolicyNames: function(opt_policies) {
+    opt_policies = opt_policies || Object.keys(POLICY).map(key => POLICY[key]);
+    var data = {chromePolicyNames: {}};
+    for (var i = opt_policies.length - 1; i >= 0; i--)
+      data.chromePolicyNames[opt_policies[i].NAME] = opt_policies[i].TAGS;
+    return data;
+  },
+
+  /**
+   * Tries to find at least one of the element matching the selector.
+   * @param {string} selector
+   * @param {Element=} opt_root Defaults to document
+   * @return {number} Returns how many objects with the selector were found.
+   */
+  count: function(selector, opt_root) {
+    opt_root = opt_root || document;
+    return opt_root.querySelectorAll(selector).length;
+  },
+
+  /**
+   * Tries to find a group by name within the first POLICY-UI tag.
+   * @param {string} name Name of the group
+   * @return {?Element} Group with name matching |name|.
+   */
+  group: function(name) {
+    var ui = document.querySelector('policy-ui');
+    return ui.$.groups.querySelector('[risk-tag=' + name + ']');
+  },
+
+  /**
+   * Returns if there is a group with the given |groupName| whose content
+   * contains the given |text|.
+   * @param {string} groupName
+   * @param {string} text
+   * @return {boolean} Returns false when there is no group named |groupName| or
+   *     if the group doesn't contain the string.
+   */
+  groupContainsText: function(groupName, text) {
+    var group = this.group(groupName);
+    if (!group)
+      return false;
+    return group.$.content.textContent.indexOf(text) != -1;
+  }
+};
+
+// Test some basic assumptions about the print preview WebUI.
+TEST_F('PolicyUiMaterialWebUITest', 'TestPolicyLayout', function() {
+  var createPolicyNames = this.createPolicyNames.bind(this);
+  var count = this.count.bind(this);
+  var groupContainsText = this.groupContainsText.bind(this);
+
+  suite('Layout', function() {
+    test('has one PolicyUi', function() {
+      expectEquals(count('policy-ui'), 1);
+    });
+
+    test('PolicyUi renders paper-cards', function() {
+      var policyUi = document.querySelector('policy-ui');
+      expectTrue(policyUi.$$('paper-card') != null);
+    });
+  });
+
+  suite('Functionality', function() {
+    setup(function() {
+      this.policyUi = document.querySelector('policy-ui');
+    });
+
+    test('PolicyUi loads introduction title', function() {
+      expectTrue(this.policyUi.$.introduction.heading != '');
+    });
+
+    test('PolicyUi loads at least one group', function() {
+      this.policyUi.setPolicyGroups(GROUP_NAMES);
+      this.policyUi.setPolicyNames(createPolicyNames([POLICY.SAMPLE_A]));
+      expectTrue(this.policyUi.$$('policy-group') != null);
+    });
+
+    test('PolicyUi provides same methods as internal page', function() {
+      expectTrue(typeof this.policyUi.setPolicyGroups === 'function');
+      expectTrue(typeof this.policyUi.setPolicyNames === 'function');
+      expectTrue(typeof this.policyUi.setPolicyValues === 'function');
+      expectTrue(typeof this.policyUi.setStatus === 'function');
+    });
+
+    // TODO(fhorschig): Move to separate async Test.
+    test.skip('PolicyUi clears groups when names are loaded', function() {
+      this.policyUi.setPolicyGroups(GROUP_NAMES);
+      this.policyUi.setPolicyNames(createPolicyNames());
+
+      expectEquals(count('policy-group', this.policyUi), 2);
+
+      this.policyUi.setPolicyGroups([POLICY.SAMPLE_B.TAGS[0]]);
+      this.policyUi.setPolicyNames(createPolicyNames([POLICY.SAMPLE_B]));
+
+      expectEquals(count('policy-group', this.policyUi), 1);
+    });
+
+    // TODO(fhorschig): Move to separate async Test.
+    test.skip('policies with multiple tags are in multiple groups', function() {
+      this.policyUi.setPolicyGroups(GROUP_NAMES);
+      this.policyUi.setPolicyNames(createPolicyNames());
+
+      expectTrue(groupContainsText(GROUP.ADMIN, POLICY.SAMPLE_A.NAME));
+      expectTrue(groupContainsText(GROUP.SECURITY, POLICY.SAMPLE_A.NAME));
+    });
+  });
+
+  mocha.run();
+});