aboutsummaryrefslogtreecommitdiff
path: root/catapult/third_party/polymer/components/paper-dropdown-menu/test/paper-dropdown-menu-light.html
diff options
context:
space:
mode:
Diffstat (limited to 'catapult/third_party/polymer/components/paper-dropdown-menu/test/paper-dropdown-menu-light.html')
-rw-r--r--catapult/third_party/polymer/components/paper-dropdown-menu/test/paper-dropdown-menu-light.html219
1 files changed, 219 insertions, 0 deletions
diff --git a/catapult/third_party/polymer/components/paper-dropdown-menu/test/paper-dropdown-menu-light.html b/catapult/third_party/polymer/components/paper-dropdown-menu/test/paper-dropdown-menu-light.html
new file mode 100644
index 00000000..183ca86f
--- /dev/null
+++ b/catapult/third_party/polymer/components/paper-dropdown-menu/test/paper-dropdown-menu-light.html
@@ -0,0 +1,219 @@
+<!doctype html>
+<!--
+@license
+Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+<html>
+<head>
+ <meta charset="UTF-8">
+ <title>paper-dropdown-menu-light basic tests</title>
+ <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
+
+ <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
+ <script src="../../web-component-tester/browser.js"></script>
+ <script src="../../test-fixture/test-fixture-mocha.js"></script>
+ <script src="../../iron-test-helpers/mock-interactions.js"></script>
+
+ <link rel="import" href="../../paper-listbox/paper-listbox.html">
+ <link rel="import" href="../../paper-item/paper-item.html">
+ <link rel="import" href="../../test-fixture/test-fixture.html">
+ <link rel="import" href="../paper-dropdown-menu-light.html">
+</head>
+<body>
+
+ <test-fixture id="TrivialDropdownMenu">
+ <template>
+ <paper-dropdown-menu-light no-animations>
+ <paper-listbox class="dropdown-content">
+ <paper-item>Foo</paper-item>
+ <paper-item>Bar</paper-item>
+ </paper-listbox>
+ </paper-dropdown-menu-light>
+ </template>
+ </test-fixture>
+
+ <test-fixture id="PreselectedDropdownMenu">
+ <template>
+ <paper-dropdown-menu-light no-animations>
+ <paper-listbox class="dropdown-content" selected="1">
+ <paper-item>Foo</paper-item>
+ <paper-item>Bar</paper-item>
+ </paper-listbox>
+ </paper-dropdown-menu-light>
+ </template>
+ </test-fixture>
+
+ <test-fixture id="LabelsDropdownMenu">
+ <template>
+ <paper-dropdown-menu-light no-animations>
+ <paper-listbox class="dropdown-content">
+ <paper-item label="Foo label property">Foo textContent</paper-item>
+ <paper-item label="Foo label attribute">Foo textContent</paper-item>
+ <paper-item>Foo textContent</paper-item>
+ </paper-listbox>
+ </paper-dropdown-menu-light>
+ </template>
+ </test-fixture>
+
+ <script>
+
+ function runAfterOpen(menu, callback) {
+ menu.$.menuButton.$.dropdown.addEventListener('iron-overlay-opened', function() {
+ Polymer.Base.async(callback, 1);
+ });
+ MockInteractions.tap(menu);
+ }
+
+ suite('<paper-dropdown-menu-light>', function() {
+ var dropdownMenu;
+
+ setup(function() {
+ dropdownMenu = fixture('TrivialDropdownMenu');
+ content = Polymer.dom(dropdownMenu).querySelector('.dropdown-content');
+ });
+
+ test('opens when tapped', function(done) {
+ var contentRect = content.getBoundingClientRect();
+
+ expect(contentRect.width).to.be.equal(0);
+ expect(contentRect.height).to.be.equal(0);
+
+ runAfterOpen(dropdownMenu, function() {
+ contentRect = content.getBoundingClientRect();
+
+ expect(dropdownMenu.opened).to.be.equal(true);
+
+ expect(contentRect.width).to.be.greaterThan(0);
+ expect(contentRect.height).to.be.greaterThan(0);
+ done();
+ });
+
+ expect(dropdownMenu.opened).to.be.equal(true);
+ });
+
+ test('closes when an item is activated', function(done) {
+ runAfterOpen(dropdownMenu, function() {
+ var firstItem = Polymer.dom(content).querySelector('paper-item');
+
+ MockInteractions.tap(firstItem);
+
+ Polymer.Base.async(function() {
+ expect(dropdownMenu.opened).to.be.equal(false);
+ done();
+ });
+ });
+ });
+
+ test('sets selected item to the activated item', function(done) {
+ runAfterOpen(dropdownMenu, function() {
+ var firstItem = Polymer.dom(content).querySelector('paper-item');
+
+ MockInteractions.tap(firstItem);
+
+ Polymer.Base.async(function() {
+ expect(dropdownMenu.selectedItem).to.be.equal(firstItem);
+ done();
+ });
+ });
+ });
+
+ suite('when a value is preselected', function() {
+ setup(function() {
+ dropdownMenu = fixture('PreselectedDropdownMenu');
+ });
+
+ test('the input area shows the correct selection', function() {
+ Polymer.dom.flush();
+ var secondItem = Polymer.dom(dropdownMenu).querySelectorAll('paper-item')[1];
+ expect(dropdownMenu.selectedItem).to.be.equal(secondItem);
+ });
+ });
+
+ suite('deselecting', function() {
+ var menu;
+
+ setup(function() {
+ dropdownMenu = fixture('PreselectedDropdownMenu');
+ menu = Polymer.dom(dropdownMenu).querySelector('.dropdown-content');
+ });
+
+ test('an `iron-deselect` event clears the current selection', function() {
+ Polymer.dom.flush();
+ menu.selected = null;
+ expect(dropdownMenu.selectedItem).to.be.equal(null);
+ });
+ });
+
+ suite('validation', function() {
+ test('a non required dropdown is valid regardless of its selection', function() {
+ var dropdownMenu = fixture('TrivialDropdownMenu');
+ menu = Polymer.dom(dropdownMenu).querySelector('.dropdown-content');
+
+ // no selection.
+ expect(dropdownMenu.validate()).to.be.true;
+ expect(dropdownMenu.invalid).to.be.false;
+ expect(dropdownMenu.value).to.not.be.ok;
+
+ // some selection.
+ menu.selected = 1;
+ expect(dropdownMenu.validate()).to.be.true;
+ expect(dropdownMenu.invalid).to.be.false;
+ expect(dropdownMenu.value).to.be.equal('Bar');
+ });
+
+ test('a required dropdown is invalid without a selection', function() {
+ var dropdownMenu = fixture('TrivialDropdownMenu');
+ dropdownMenu.required = true;
+
+ // no selection.
+ expect(dropdownMenu.validate()).to.be.false;
+ expect(dropdownMenu.invalid).to.be.true;
+ expect(dropdownMenu.value).to.not.be.ok;
+ });
+
+ test('a required dropdown is valid with a selection', function() {
+ var dropdownMenu = fixture('PreselectedDropdownMenu');
+ Polymer.dom.flush();
+
+ dropdownMenu.required = true;
+
+ expect(dropdownMenu.validate()).to.be.true;
+ expect(dropdownMenu.invalid).to.be.false;
+ expect(dropdownMenu.value).to.be.equal('Bar');
+ });
+ });
+
+ suite('selectedItemLabel', function() {
+ test('label property', function() {
+ var dropdownMenu = fixture('LabelsDropdownMenu');
+ var menu = Polymer.dom(dropdownMenu).querySelector('.dropdown-content');
+ menu.selected = 0;
+ //Fake a label property since paper-item doesn't have one
+ dropdownMenu.selectedItem.label = dropdownMenu.selectedItem.getAttribute('label');
+ expect(dropdownMenu.selectedItemLabel).to.be.equal('Foo label property');
+ });
+
+ test('label attribute', function() {
+ var dropdownMenu = fixture('LabelsDropdownMenu');
+ var menu = Polymer.dom(dropdownMenu).querySelector('.dropdown-content');
+ menu.selected = 1;
+ expect(dropdownMenu.selectedItemLabel).to.be.equal('Foo label attribute');
+ });
+
+ test('textContent', function() {
+ var dropdownMenu = fixture('LabelsDropdownMenu');
+ var menu = Polymer.dom(dropdownMenu).querySelector('.dropdown-content');
+ menu.selected = 2;
+ expect(dropdownMenu.selectedItemLabel).to.be.equal('Foo textContent');
+ });
+ });
+ });
+ </script>
+
+</body>
+</html>
generated by cgit v1.2.3 (git 2.25.1) at 2024-05-24 05:28:50 +0000