aboutsummaryrefslogtreecommitdiff
path: root/catapult/third_party/polymer/components/iron-behaviors/test/focused-state.html
diff options
context:
space:
mode:
Diffstat (limited to 'catapult/third_party/polymer/components/iron-behaviors/test/focused-state.html')
-rw-r--r--catapult/third_party/polymer/components/iron-behaviors/test/focused-state.html161
1 files changed, 161 insertions, 0 deletions
diff --git a/catapult/third_party/polymer/components/iron-behaviors/test/focused-state.html b/catapult/third_party/polymer/components/iron-behaviors/test/focused-state.html
new file mode 100644
index 00000000..3b75c704
--- /dev/null
+++ b/catapult/third_party/polymer/components/iron-behaviors/test/focused-state.html
@@ -0,0 +1,161 @@
+<!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>
+ <title>focused-state</title>
+
+ <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
+ <script src="../../web-component-tester/browser.js"></script>
+ <script src="../../iron-test-helpers/mock-interactions.js"></script>
+ <link rel="import" href="test-elements.html">
+</head>
+<body>
+
+ <test-fixture id="TrivialFocusedState">
+ <template>
+ <test-control tabindex="-1"></test-control>
+ </template>
+ </test-fixture>
+
+ <test-fixture id="NestedFocusedState">
+ <template>
+ <nested-focusable></nested-focusable>
+ </template>
+ </test-fixture>
+
+ <test-fixture id="LightDOM">
+ <template>
+ <test-light-dom>
+ <input id="input">
+ <nested-focusable></nested-focusable>
+ </test-light-dom>
+ </template>
+ </test-fixture>
+
+ <script>
+ suite('focused-state', function() {
+ var focusTarget;
+
+ setup(function() {
+ focusTarget = fixture('TrivialFocusedState');
+ });
+
+ suite('when is focused', function() {
+ test('receives a focused attribute', function() {
+ expect(focusTarget.hasAttribute('focused')).to.be.eql(false);
+ MockInteractions.focus(focusTarget);
+ expect(focusTarget.hasAttribute('focused')).to.be.eql(true);
+ });
+
+ test('focused property is true', function() {
+ expect(focusTarget.focused).to.not.be.eql(true);
+ MockInteractions.focus(focusTarget);
+ expect(focusTarget.focused).to.be.eql(true);
+ });
+ });
+
+ suite('when is blurred', function() {
+ test('loses the focused attribute', function() {
+ MockInteractions.focus(focusTarget);
+ expect(focusTarget.hasAttribute('focused')).to.be.eql(true);
+ MockInteractions.blur(focusTarget);
+ expect(focusTarget.hasAttribute('focused')).to.be.eql(false);
+ });
+
+ test('focused property is false', function() {
+ MockInteractions.focus(focusTarget);
+ expect(focusTarget.focused).to.be.eql(true);
+ MockInteractions.blur(focusTarget);
+ expect(focusTarget.focused).to.be.eql(false);
+ });
+ });
+
+ suite('when the focused state is disabled', function() {
+ test('will not be focusable', function() {
+ var blurSpy = sinon.spy(focusTarget, 'blur');
+ MockInteractions.focus(focusTarget);
+ focusTarget.disabled = true;
+ expect(focusTarget.getAttribute('tabindex')).to.be.eql('-1');
+ expect(blurSpy.called).to.be.eql(true);
+ });
+ });
+ });
+
+ suite('nested focusable', function() {
+ var focusable;
+
+ setup(function() {
+ focusable = fixture('NestedFocusedState');
+ });
+
+ test('focus/blur events fired on host element', function() {
+ var nFocusEvents = 0;
+ var nBlurEvents = 0;
+
+ focusable.addEventListener('focus', function() {
+ nFocusEvents += 1;
+ expect(focusable.focused).to.be.equal(true);
+ MockInteractions.blur(focusable.$.input);
+ });
+ focusable.addEventListener('blur', function() {
+ expect(focusable.focused).to.be.equal(false);
+ nBlurEvents += 1;
+ });
+
+ MockInteractions.focus(focusable.$.input);
+
+ expect(nBlurEvents).to.be.greaterThan(0);
+ expect(nFocusEvents).to.be.greaterThan(0);
+ });
+
+ });
+
+
+ suite('elements in the light dom', function() {
+ var lightDOM, input, lightDescendantShadowInput;
+
+ setup(function() {
+ lightDOM = fixture('LightDOM');
+ input = document.querySelector('#input');
+ lightDescendantShadowInput = Polymer.dom(lightDOM)
+ .querySelector('nested-focusable').$.input;
+ });
+
+ test('should not fire the focus event', function() {
+ var nFocusEvents = 0;
+
+ lightDOM.addEventListener('focus', function() {
+ nFocusEvents += 1;
+ });
+
+ MockInteractions.focus(input);
+
+ expect(nFocusEvents).to.be.equal(0);
+ });
+
+ test('should not fire the focus event from shadow descendants', function() {
+ var nFocusEvents = 0;
+
+ lightDOM.addEventListener('focus', function() {
+ nFocusEvents += 1;
+ });
+
+ MockInteractions.focus(lightDescendantShadowInput);
+
+ expect(nFocusEvents).to.be.equal(0);
+ });
+
+ });
+
+ </script>
+
+</body>
+</html>