1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00

update prompt text

This commit is contained in:
Luke Pulverenti 2016-02-06 01:33:34 -05:00
parent b63aaeb909
commit ed4d08ab68
22 changed files with 401 additions and 146 deletions

View file

@ -15,12 +15,12 @@
}, },
"devDependencies": {}, "devDependencies": {},
"ignore": [], "ignore": [],
"version": "1.0.72", "version": "1.0.73",
"_release": "1.0.72", "_release": "1.0.73",
"_resolution": { "_resolution": {
"type": "version", "type": "version",
"tag": "1.0.72", "tag": "1.0.73",
"commit": "c06518f026fe592c24aa79312dcecf025e604ef4" "commit": "da24184a3afaddf25b6d6ffa41363dedee7e63d2"
}, },
"_source": "git://github.com/MediaBrowser/emby-webcomponents.git", "_source": "git://github.com/MediaBrowser/emby-webcomponents.git",
"_target": "~1.0.0", "_target": "~1.0.0",

View file

@ -1,4 +1,4 @@
define(['paperdialoghelper', 'layoutManager', 'html!./icons.html', 'css!./style.css', 'paper-button', 'paper-input'], function (paperdialoghelper, layoutManager) { define(['paperdialoghelper', 'layoutManager', 'globalize', 'dialogText', 'html!./icons.html', 'css!./style.css', 'paper-button', 'paper-input'], function (paperdialoghelper, layoutManager, globalize, dialogText) {
function show(options, resolve, reject) { function show(options, resolve, reject) {
@ -37,10 +37,12 @@ define(['paperdialoghelper', 'layoutManager', 'html!./icons.html', 'css!./style.
// TODO: An actual form element should probably be added // TODO: An actual form element should probably be added
html += '<br/>'; html += '<br/>';
if (raisedButtons) { if (raisedButtons) {
html += '<paper-button raised class="btnSubmit"><iron-icon icon="dialog:check"></iron-icon><span>' + Globalize.translate('core#ButtonOk') + '</span></paper-button>'; html += '<paper-button raised class="btnSubmit"><iron-icon icon="dialog:check"></iron-icon><span>' + globalize.translate(dialogText.buttonOk) + '</span></paper-button>';
} else { } else {
html += '<paper-button class="btnSubmit">' + Globalize.translate('core#ButtonOk') + '</paper-button>'; html += '<div style="text-align:right;">';
html += '<paper-button class="btnPromptExit">' + Globalize.translate('core#ButtonCancel') + '</paper-button>'; html += '<paper-button class="btnSubmit">' + globalize.translate(dialogText.buttonOk) + '</paper-button>';
html += '<paper-button class="btnPromptExit">' + globalize.translate(dialogText.buttonCancel) + '</paper-button>';
html += '</div>';
} }
html += '</div>'; html += '</div>';

View file

@ -1,6 +1,6 @@
{ {
"name": "iron-dropdown", "name": "iron-dropdown",
"version": "1.1.0", "version": "1.2.0",
"description": "An unstyled element that works similarly to a native browser select", "description": "An unstyled element that works similarly to a native browser select",
"authors": [ "authors": [
"The Polymer Authors" "The Polymer Authors"
@ -32,15 +32,15 @@
"iron-test-helpers": "polymerelements/iron-test-helpers#^1.0.0", "iron-test-helpers": "polymerelements/iron-test-helpers#^1.0.0",
"paper-styles": "polymerelements/paper-styles#^1.0.0", "paper-styles": "polymerelements/paper-styles#^1.0.0",
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0", "webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0",
"web-component-tester": "*", "web-component-tester": "^4.0.0",
"iron-image": "polymerelements/iron-image#^1.0.0" "iron-image": "polymerelements/iron-image#^1.0.0"
}, },
"ignore": [], "ignore": [],
"_release": "1.1.0", "_release": "1.2.0",
"_resolution": { "_resolution": {
"type": "version", "type": "version",
"tag": "v1.1.0", "tag": "v1.2.0",
"commit": "b09b0d57ba917bac9315de4761373d88e85ac52e" "commit": "f864191c6ffbd3aaddea8102102ab40137046327"
}, },
"_source": "git://github.com/polymerelements/iron-dropdown.git", "_source": "git://github.com/polymerelements/iron-dropdown.git",
"_target": "^1.0.0", "_target": "^1.0.0",

View file

@ -1,22 +1,25 @@
language: node_js language: node_js
sudo: false sudo: false
before_script: before_script:
- npm install web-component-tester - npm install -g bower polylint web-component-tester
- npm install bower
- 'export PATH=$PWD/node_modules/.bin:$PATH'
- bower install - bower install
- polylint
env: env:
global: global:
- secure: Nd7sbgkYVekuQRB4K3svNCL3veA6t6aGopNP2FUxlJvQuzRV1vKV67angPvMUAFelEA7/rTzrFPBMfNbsz9C2wInLLLPux4wEk1MQX+2KYZVeXKMHjgl8iQKMXnodaL7XXwBPg0L7053TWtYkIt8wZ/vN0JGPQFKhlQkSrduztkPCJQfkFsMPJ7SudPG3Ld0UPBVxo8TwH/d44p8VhLGiI0oEWw3GnGZZ1T7RJLDAVBwj1BiVHAOaS0SSeOR3ngpZyXbk8OItgzw4o/bbAt2yrHMfwymBy0Xv9v3G0QLFJnMi/gE2lWnN4+IttUPI8gVyr1TuiTgtFxdwteLO3R5iFe+qlQjq0VGssmAHcPwtLhvrT4wEkGMc8ZeyW11z+GdkIw4XHGACWj+9Jz9f19mJd9xU3fkJ+f5mFiB8vEkzjsUI9pswgd3RoHt2WewcVdHnCED2wRdQCw9H34dX7d2ieWKPl/pv+EKZOgEJJ8UNZMyKnj57Y25WRrTpIQBt6p9uVv5MsiZQm7Sd1pYQnJKPQ+BxvvL5fsoT1YkFSjyz9gwijtftXhfL8KLB6i04V3mra3f9d5hc20wAOt+ad+mTOkaM/aGxE/I3Ko13BceMvRSNzuz+N2WE6FEJj1NuOCW/AeSh5/6n9nnlDeu7Nu7VeM9kjk4dyBGNRDWLNcSCEk= - secure: Nd7sbgkYVekuQRB4K3svNCL3veA6t6aGopNP2FUxlJvQuzRV1vKV67angPvMUAFelEA7/rTzrFPBMfNbsz9C2wInLLLPux4wEk1MQX+2KYZVeXKMHjgl8iQKMXnodaL7XXwBPg0L7053TWtYkIt8wZ/vN0JGPQFKhlQkSrduztkPCJQfkFsMPJ7SudPG3Ld0UPBVxo8TwH/d44p8VhLGiI0oEWw3GnGZZ1T7RJLDAVBwj1BiVHAOaS0SSeOR3ngpZyXbk8OItgzw4o/bbAt2yrHMfwymBy0Xv9v3G0QLFJnMi/gE2lWnN4+IttUPI8gVyr1TuiTgtFxdwteLO3R5iFe+qlQjq0VGssmAHcPwtLhvrT4wEkGMc8ZeyW11z+GdkIw4XHGACWj+9Jz9f19mJd9xU3fkJ+f5mFiB8vEkzjsUI9pswgd3RoHt2WewcVdHnCED2wRdQCw9H34dX7d2ieWKPl/pv+EKZOgEJJ8UNZMyKnj57Y25WRrTpIQBt6p9uVv5MsiZQm7Sd1pYQnJKPQ+BxvvL5fsoT1YkFSjyz9gwijtftXhfL8KLB6i04V3mra3f9d5hc20wAOt+ad+mTOkaM/aGxE/I3Ko13BceMvRSNzuz+N2WE6FEJj1NuOCW/AeSh5/6n9nnlDeu7Nu7VeM9kjk4dyBGNRDWLNcSCEk=
- secure: aFsYKL6Sw8/r57wzj3pnzEwBE1mnTajJasHAbXgQMd336S2Sq/f39DCNTXgKBA4AKZGvWKe8w9nzaocQoMa4l9bLWEBJMCMPQFawOhTkuEjsLjpU3g74b46/EhjBP5zixR32xoyF5o9FTzC6UyrDjt2XpKwIQJYxaEfoyIW1vTPdoasWdaG5rXvWFTsmXtaMDpCKFH9aQ1DHn9Sbi9NZlR4izdULsbv9GZwg53xvuH4xYEkGtB29KKy04uK1nJ+9SmRWTAnu4Q/ivYWlbwBArjiYTTi0wclvDNvT1iaFNAaeK2pJea8CnoyJJ0pg9NcuzZtStGUvP00kGUpJQ4lqkr+gBCHDPYtoZ17XCz59cg6LrhG1q//vPi7Yz0xW51GHuwmcVs+PsjmWaRuO/1UFreDCQYf+GU4I1pQZf2q1R4m8noe4i5CcFXLKTrC4udBzPmzVB4As2LsxRc3HCIXmhaMxI8MJwdkQBA22u4vCwU2xpqBawJocj0Gvbeme6wG99PW7+XSkijQDk2cTJ5/CJtY22nAECvn4tve3OVvybSTjQ1yipLxJm/dtjgEXFWtknFZr++tId88wPd3EBtrwEhliD3zD/TyLPO2RPZGuI0i6oD3O89P5d8qp66T/eByDr1IEm0+FIQjgiCEMbhmaIuUKGG2GCfwPglI3uR0kbg0= - secure: aFsYKL6Sw8/r57wzj3pnzEwBE1mnTajJasHAbXgQMd336S2Sq/f39DCNTXgKBA4AKZGvWKe8w9nzaocQoMa4l9bLWEBJMCMPQFawOhTkuEjsLjpU3g74b46/EhjBP5zixR32xoyF5o9FTzC6UyrDjt2XpKwIQJYxaEfoyIW1vTPdoasWdaG5rXvWFTsmXtaMDpCKFH9aQ1DHn9Sbi9NZlR4izdULsbv9GZwg53xvuH4xYEkGtB29KKy04uK1nJ+9SmRWTAnu4Q/ivYWlbwBArjiYTTi0wclvDNvT1iaFNAaeK2pJea8CnoyJJ0pg9NcuzZtStGUvP00kGUpJQ4lqkr+gBCHDPYtoZ17XCz59cg6LrhG1q//vPi7Yz0xW51GHuwmcVs+PsjmWaRuO/1UFreDCQYf+GU4I1pQZf2q1R4m8noe4i5CcFXLKTrC4udBzPmzVB4As2LsxRc3HCIXmhaMxI8MJwdkQBA22u4vCwU2xpqBawJocj0Gvbeme6wG99PW7+XSkijQDk2cTJ5/CJtY22nAECvn4tve3OVvybSTjQ1yipLxJm/dtjgEXFWtknFZr++tId88wPd3EBtrwEhliD3zD/TyLPO2RPZGuI0i6oD3O89P5d8qp66T/eByDr1IEm0+FIQjgiCEMbhmaIuUKGG2GCfwPglI3uR0kbg0=
node_js: 4 - CXX=g++-4.8
node_js: stable
addons: addons:
firefox: latest firefox: latest
apt: apt:
sources: sources:
- google-chrome - google-chrome
- ubuntu-toolchain-r-test
packages: packages:
- google-chrome-stable - google-chrome-stable
- g++-4.8
sauce_connect: true
script: script:
- xvfb-run wct - xvfb-run wct
- "if [ \"${TRAVIS_PULL_REQUEST}\" = \"false\" ]; then wct -s 'default'; fi" - "if [ \"${TRAVIS_PULL_REQUEST}\" = \"false\" ]; then wct -s 'default'; fi"

View file

@ -5,6 +5,11 @@ https://github.com/PolymerElements/ContributionGuide/blob/master/CONTRIBUTING.md
If you edit that file, it will get updated everywhere else. If you edit that file, it will get updated everywhere else.
If you edit this file, your changes will get overridden :) If you edit this file, your changes will get overridden :)
You can however override the jsbin link with one that's customized to this
specific element:
jsbin=https://jsbin.com/cagaye/edit?html,output
--> -->
# Polymer Elements # Polymer Elements
## Guide for Contributors ## Guide for Contributors
@ -41,7 +46,7 @@ Polymer Elements are built in the open, and the Polymer authors eagerly encourag
3. Click the `paper-foo` element. 3. Click the `paper-foo` element.
``` ```
2. **A reduced test case that demonstrates the problem.** If possible, please include the test case as a JSBin. Start with this template to easily import and use relevant Polymer Elements: [http://jsbin.com/cagaye](http://jsbin.com/cagaye/edit?html,output). 2. **A reduced test case that demonstrates the problem.** If possible, please include the test case as a JSBin. Start with this template to easily import and use relevant Polymer Elements: [https://jsbin.com/cagaye/edit?html,output](https://jsbin.com/cagaye/edit?html,output).
3. **A list of browsers where the problem occurs.** This can be skipped if the problem is the same across all browsers. 3. **A list of browsers where the problem occurs.** This can be skipped if the problem is the same across all browsers.
@ -51,14 +56,14 @@ Polymer Elements are built in the open, and the Polymer authors eagerly encourag
When submitting pull requests, please provide: When submitting pull requests, please provide:
1. **A reference to the corresponding issue** or issues that will be closed by the pull request. Please refer to these issues using the following syntax: 1. **A reference to the corresponding issue** or issues that will be closed by the pull request. Please refer to these issues in the pull request description using the following syntax:
```markdown ```markdown
(For a single issue) (For a single issue)
Fixes #20 Fixes #20
(For multiple issues) (For multiple issues)
Fixes #32, #40 Fixes #32, fixes #40
``` ```
2. **A succinct description of the design** used to fix any related issues. For example: 2. **A succinct description of the design** used to fix any related issues. For example:

View file

@ -1,6 +1,6 @@
{ {
"name": "iron-dropdown", "name": "iron-dropdown",
"version": "1.1.0", "version": "1.2.0",
"description": "An unstyled element that works similarly to a native browser select", "description": "An unstyled element that works similarly to a native browser select",
"authors": [ "authors": [
"The Polymer Authors" "The Polymer Authors"
@ -32,7 +32,7 @@
"iron-test-helpers": "polymerelements/iron-test-helpers#^1.0.0", "iron-test-helpers": "polymerelements/iron-test-helpers#^1.0.0",
"paper-styles": "polymerelements/paper-styles#^1.0.0", "paper-styles": "polymerelements/paper-styles#^1.0.0",
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0", "webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0",
"web-component-tester": "*", "web-component-tester": "^4.0.0",
"iron-image": "polymerelements/iron-image#^1.0.0" "iron-image": "polymerelements/iron-image#^1.0.0"
}, },
"ignore": [] "ignore": []

View file

@ -79,6 +79,11 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
* @param {HTMLElement} element The element that should lock scroll. * @param {HTMLElement} element The element that should lock scroll.
*/ */
pushScrollLock: function(element) { pushScrollLock: function(element) {
// Prevent pushing the same element twice
if (this._lockingElements.indexOf(element) >= 0) {
return;
}
if (this._lockingElements.length === 0) { if (this._lockingElements.length === 0) {
this._lockScrollInteractions(); this._lockScrollInteractions();
} }
@ -172,7 +177,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
_scrollInteractionHandler: function(event) { _scrollInteractionHandler: function(event) {
if (Polymer if (Polymer
.IronDropdownScrollManager .IronDropdownScrollManager
.elementIsScrollLocked(event.target)) { .elementIsScrollLocked(Polymer.dom(event).rootTarget)) {
if (event.type === 'keydown' && if (event.type === 'keydown' &&
!Polymer.IronDropdownScrollManager._isScrollingKeypress(event)) { !Polymer.IronDropdownScrollManager._isScrollingKeypress(event)) {
return; return;
@ -199,13 +204,13 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
document.body.style.overflowY = 'hidden'; document.body.style.overflowY = 'hidden';
// Modern `wheel` event for mouse wheel scrolling: // Modern `wheel` event for mouse wheel scrolling:
window.addEventListener('wheel', this._scrollInteractionHandler, true); document.addEventListener('wheel', this._scrollInteractionHandler, true);
// Older, non-standard `mousewheel` event for some FF: // Older, non-standard `mousewheel` event for some FF:
window.addEventListener('mousewheel', this._scrollInteractionHandler, true); document.addEventListener('mousewheel', this._scrollInteractionHandler, true);
// IE: // IE:
window.addEventListener('DOMMouseScroll', this._scrollInteractionHandler, true); document.addEventListener('DOMMouseScroll', this._scrollInteractionHandler, true);
// Mobile devices can scroll on touch move: // Mobile devices can scroll on touch move:
window.addEventListener('touchmove', this._scrollInteractionHandler, true); document.addEventListener('touchmove', this._scrollInteractionHandler, true);
// Capture keydown to prevent scrolling keys (pageup, pagedown etc.) // Capture keydown to prevent scrolling keys (pageup, pagedown etc.)
document.addEventListener('keydown', this._scrollInteractionHandler, true); document.addEventListener('keydown', this._scrollInteractionHandler, true);
}, },
@ -215,10 +220,10 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
document.body.style.overflowX = this._originalBodyStyles.overflowX; document.body.style.overflowX = this._originalBodyStyles.overflowX;
document.body.style.overflowY = this._originalBodyStyles.overflowY; document.body.style.overflowY = this._originalBodyStyles.overflowY;
window.removeEventListener('wheel', this._scrollInteractionHandler, true); document.removeEventListener('wheel', this._scrollInteractionHandler, true);
window.removeEventListener('mousewheel', this._scrollInteractionHandler, true); document.removeEventListener('mousewheel', this._scrollInteractionHandler, true);
window.removeEventListener('DOMMouseScroll', this._scrollInteractionHandler, true); document.removeEventListener('DOMMouseScroll', this._scrollInteractionHandler, true);
window.removeEventListener('touchmove', this._scrollInteractionHandler, true); document.removeEventListener('touchmove', this._scrollInteractionHandler, true);
document.removeEventListener('keydown', this._scrollInteractionHandler, true); document.removeEventListener('keydown', this._scrollInteractionHandler, true);
} }
}; };

View file

@ -224,6 +224,7 @@ method is called on the element.
/** /**
* The element that should be focused when the dropdown opens. * The element that should be focused when the dropdown opens.
* @deprecated
*/ */
get _focusTarget() { get _focusTarget() {
return this.focusTarget || this.containedElement; return this.focusTarget || this.containedElement;
@ -323,10 +324,6 @@ method is called on the element.
this._prepareDropdown(); this._prepareDropdown();
Polymer.IronOverlayBehaviorImpl._openedChanged.apply(this, arguments); Polymer.IronOverlayBehaviorImpl._openedChanged.apply(this, arguments);
} }
if (this.opened) {
this._focusContent();
}
}, },
/** /**
@ -381,7 +378,7 @@ method is called on the element.
var scrollTop; var scrollTop;
var scrollLeft; var scrollLeft;
if (containedElement) { if (this.opened && containedElement) {
scrollTop = containedElement.scrollTop; scrollTop = containedElement.scrollTop;
scrollLeft = containedElement.scrollLeft; scrollLeft = containedElement.scrollLeft;
} }
@ -392,7 +389,7 @@ method is called on the element.
Polymer.IronOverlayBehaviorImpl._onIronResize.apply(this, arguments); Polymer.IronOverlayBehaviorImpl._onIronResize.apply(this, arguments);
if (containedElement) { if (this.opened && containedElement) {
containedElement.scrollTop = scrollTop; containedElement.scrollTop = scrollTop;
containedElement.scrollLeft = scrollLeft; containedElement.scrollLeft = scrollLeft;
} }
@ -477,16 +474,15 @@ method is called on the element.
}, },
/** /**
* Focuses the configured focus target. * Apply focus to focusTarget or containedElement
*/ */
_focusContent: function() { _applyFocus: function () {
// NOTE(cdata): This is async so that it can attempt the focus after var focusTarget = this.focusTarget || this.containedElement;
// `display: none` is removed from the element. if (focusTarget && this.opened && !this.noAutoFocus) {
this.async(function() { focusTarget.focus();
if (this._focusTarget) { } else {
this._focusTarget.focus(); Polymer.IronOverlayBehaviorImpl._applyFocus.apply(this, arguments);
} }
});
} }
}); });
})(); })();

View file

@ -21,19 +21,13 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<link rel="import" href="../iron-dropdown-scroll-manager.html"> <link rel="import" href="../iron-dropdown-scroll-manager.html">
<link rel="import" href="../../test-fixture/test-fixture.html"> <link rel="import" href="../../test-fixture/test-fixture.html">
<link rel="import" href="x-scrollable-element.html">
</head> </head>
<body> <body>
<test-fixture id="DOMSubtree"> <test-fixture id="DOMSubtree">
<template> <template>
<div id="Parent"> <x-scrollable-element id="Parent"></x-scrollable-element>
<div id="ChildOne">
<div id="GrandchildOne"></div>
</div>
<div id="ChildTwo">
<div id="GrandchildTwo"></div>
</div>
</div>
</template> </template>
</test-fixture> </test-fixture>
<script> <script>
@ -47,14 +41,14 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
setup(function() { setup(function() {
parent = fixture('DOMSubtree'); parent = fixture('DOMSubtree');
childOne = parent.querySelector('#ChildOne'); childOne = parent.$$('#ChildOne');
childTwo = parent.querySelector('#ChildTwo'); childTwo = parent.$$('#ChildTwo');
grandChildOne = parent.querySelector('#GrandchildOne'); grandChildOne = parent.$$('#GrandchildOne');
grandChildTwo = parent.querySelector('#GrandchildTwo'); grandChildTwo = parent.$$('#GrandchildTwo');
ancestor = document.body; ancestor = document.body;
}); });
suite('contraining scroll in the DOM', function() { suite('constraining scroll in the DOM', function() {
setup(function() { setup(function() {
Polymer.IronDropdownScrollManager.pushScrollLock(childOne); Polymer.IronDropdownScrollManager.pushScrollLock(childOne);
}); });
@ -99,6 +93,58 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
expect(Polymer.IronDropdownScrollManager.elementIsScrollLocked(parent)) expect(Polymer.IronDropdownScrollManager.elementIsScrollLocked(parent))
.to.be.equal(false); .to.be.equal(false);
}); });
test('does not check locked elements when there are no locking elements', function() {
sinon.spy(Polymer.IronDropdownScrollManager, 'elementIsScrollLocked');
childOne.dispatchEvent(new CustomEvent('wheel', {
bubbles: true,
cancelable: true
}));
expect(Polymer.IronDropdownScrollManager
.elementIsScrollLocked.callCount).to.be.eql(1);
Polymer.IronDropdownScrollManager.removeScrollLock(childOne);
childOne.dispatchEvent(new CustomEvent('wheel', {
bubbles: true,
cancelable: true
}));
expect(Polymer.IronDropdownScrollManager
.elementIsScrollLocked.callCount).to.be.eql(1);
});
suite('various scroll events', function() {
var scrollEvents;
var events;
setup(function() {
scrollEvents = [
'wheel',
'mousewheel',
'DOMMouseScroll',
'touchmove'
];
events = scrollEvents.map(function(scrollEvent) {
return new CustomEvent(scrollEvent, {
bubbles: true,
cancelable: true
});
});
});
test('prevents wheel events from locked elements', function() {
events.forEach(function(event) {
childTwo.dispatchEvent(event);
expect(event.defaultPrevented).to.be.eql(true);
});
});
test('allows wheel events from unlocked elements', function() {
events.forEach(function(event) {
childOne.dispatchEvent(event);
expect(event.defaultPrevented).to.be.eql(false);
});
});
});
}); });
}); });
</script> </script>

View file

@ -118,6 +118,13 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
contentRect.height > 0; contentRect.height > 0;
} }
function runAfterOpen(overlay, cb) {
overlay.addEventListener('iron-overlay-opened', function () {
Polymer.Base.async(cb, 1);
});
overlay.open();
}
suite('<iron-dropdown>', function() { suite('<iron-dropdown>', function() {
var dropdown; var dropdown;
var content; var content;
@ -133,31 +140,20 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
}); });
test('shows dropdown content when opened', function(done) { test('shows dropdown content when opened', function(done) {
dropdown.open(); runAfterOpen(dropdown, function () {
Polymer.Base.async(function() {
expect(elementIsVisible(content)).to.be.equal(true); expect(elementIsVisible(content)).to.be.equal(true);
done(); done();
}); });
}); });
test('hides dropdown content when outside is clicked', function(done) { test('hides dropdown content when outside is clicked', function(done) {
dropdown.open(); runAfterOpen(dropdown, function () {
Polymer.Base.async(function() {
expect(elementIsVisible(content)).to.be.equal(true); expect(elementIsVisible(content)).to.be.equal(true);
MockInteractions.tap(dropdown.parentNode);
// The document capture-click listeners are set async.
// Note(noms): I think this bit in iron-overlay-behavior is pretty
// brittle, so if the tests start failing in the future, make sure
// _toggleListeners is getting called at the right time.
Polymer.Base.async(function() { Polymer.Base.async(function() {
MockInteractions.tap(dropdown.parentNode); expect(elementIsVisible(content)).to.be.equal(false);
Polymer.Base.async(function() { done();
expect(elementIsVisible(content)).to.be.equal(false); }, 10);
done();
}, 100);
}, 1);
}); });
}); });
@ -167,9 +163,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
content = Polymer.dom(dropdown).querySelector('.dropdown-content'); content = Polymer.dom(dropdown).querySelector('.dropdown-content');
}); });
test('focuses the content when opened', function(done) { test('focuses the content when opened', function(done) {
dropdown.open(); runAfterOpen(dropdown, function () {
Polymer.Base.async(function() {
expect(document.activeElement).to.be.equal(content); expect(document.activeElement).to.be.equal(content);
done(); done();
}); });
@ -179,9 +173,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
var focusableChild = Polymer.dom(content).querySelector('div[tabindex]'); var focusableChild = Polymer.dom(content).querySelector('div[tabindex]');
dropdown.focusTarget = focusableChild; dropdown.focusTarget = focusableChild;
dropdown.open(); runAfterOpen(dropdown, function () {
Polymer.Base.async(function() {
expect(document.activeElement).to.not.be.equal(content); expect(document.activeElement).to.not.be.equal(content);
expect(document.activeElement).to.be.equal(focusableChild); expect(document.activeElement).to.be.equal(focusableChild);
done(); done();
@ -193,14 +185,40 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
suite('locking scroll', function() { suite('locking scroll', function() {
var dropdown; var dropdown;
setup(function() {
dropdown = fixture('TrivialDropdown');
});
test('should lock, only once', function(done) {
var openCount = 0;
runAfterOpen(dropdown, function() {
expect(Polymer.IronDropdownScrollManager._lockingElements.length)
.to.be.equal(1);
expect(Polymer.IronDropdownScrollManager.elementIsScrollLocked(document.body))
.to.be.equal(true);
if(openCount === 0) {
// This triggers a second `pushScrollLock` with the same element, however
// that should not add the element to the `_lockingElements` stack twice
dropdown.close();
dropdown.open();
} else {
done();
}
openCount++;
});
});
});
suite('non locking scroll', function() {
var dropdown;
setup(function() { setup(function() {
dropdown = fixture('NonLockingDropdown'); dropdown = fixture('NonLockingDropdown');
}); });
test('can be disabled with `allowOutsideScroll`', function(done) { test('can be disabled with `allowOutsideScroll`', function(done) {
dropdown.open(); runAfterOpen(dropdown, function () {
Polymer.Base.async(function() {
expect(Polymer.IronDropdownScrollManager.elementIsScrollLocked(document.body)) expect(Polymer.IronDropdownScrollManager.elementIsScrollLocked(document.body))
.to.be.equal(false); .to.be.equal(false);
done(); done();
@ -219,9 +237,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
var parentRect; var parentRect;
var dropdownRect; var dropdownRect;
dropdown.opened = true; runAfterOpen(dropdown, function () {
Polymer.Base.async(function() {
dropdownRect = dropdown.getBoundingClientRect(); dropdownRect = dropdown.getBoundingClientRect();
parentRect = parent.getBoundingClientRect(); parentRect = parent.getBoundingClientRect();
@ -230,7 +246,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
expect(dropdownRect.top).to.be.closeTo(parentRect.top, 0.1); expect(dropdownRect.top).to.be.closeTo(parentRect.top, 0.1);
expect(dropdownRect.right).to.be.closeTo(parentRect.right, 0.1); expect(dropdownRect.right).to.be.closeTo(parentRect.right, 0.1);
done(); done();
}, 1); });
}); });
test('can be re-aligned to the bottom', function(done) { test('can be re-aligned to the bottom', function(done) {
@ -238,9 +254,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
var dropdownRect; var dropdownRect;
dropdown.verticalAlign = 'bottom'; dropdown.verticalAlign = 'bottom';
dropdown.opened = true; runAfterOpen(dropdown, function () {
Polymer.Base.async(function() {
parentRect = parent.getBoundingClientRect(); parentRect = parent.getBoundingClientRect();
dropdownRect = dropdown.getBoundingClientRect(); dropdownRect = dropdown.getBoundingClientRect();
@ -249,7 +263,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
expect(dropdownRect.bottom).to.be.closeTo(parentRect.bottom, 0.1); expect(dropdownRect.bottom).to.be.closeTo(parentRect.bottom, 0.1);
expect(dropdownRect.right).to.be.closeTo(parentRect.right, 0.1); expect(dropdownRect.right).to.be.closeTo(parentRect.right, 0.1);
done(); done();
}, 1); });
}); });
}); });
@ -263,9 +277,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
}); });
test('can be offset towards the bottom right', function(done) { test('can be offset towards the bottom right', function(done) {
dropdown.opened = true; runAfterOpen(dropdown, function () {
Polymer.Base.async(function() {
dropdownRect = dropdown.getBoundingClientRect(); dropdownRect = dropdown.getBoundingClientRect();
dropdown.verticalOffset = 10; dropdown.verticalOffset = 10;
@ -277,13 +289,11 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
// horizontalAlign is left, so a positive offset moves to the right. // horizontalAlign is left, so a positive offset moves to the right.
expect(dropdownRect.left + 10).to.be.closeTo(offsetDropdownRect.left, 0.1); expect(dropdownRect.left + 10).to.be.closeTo(offsetDropdownRect.left, 0.1);
done(); done();
}, 1); });
}); });
test('can be offset towards the top left', function(done) { test('can be offset towards the top left', function(done) {
dropdown.opened = true; runAfterOpen(dropdown, function () {
Polymer.Base.async(function() {
dropdownRect = dropdown.getBoundingClientRect(); dropdownRect = dropdown.getBoundingClientRect();
dropdown.verticalOffset = -10; dropdown.verticalOffset = -10;
@ -295,7 +305,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
// horizontalAlign is left, so a negative offset moves to the left. // horizontalAlign is left, so a negative offset moves to the left.
expect(dropdownRect.left - 10).to.be.closeTo(offsetDropdownRect.left, 0.1); expect(dropdownRect.left - 10).to.be.closeTo(offsetDropdownRect.left, 0.1);
done(); done();
}, 1); });
}); });
}); });
@ -309,9 +319,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
}); });
test('can be offset towards the top left', function(done) { test('can be offset towards the top left', function(done) {
dropdown.opened = true; runAfterOpen(dropdown, function () {
Polymer.Base.async(function() {
dropdownRect = dropdown.getBoundingClientRect(); dropdownRect = dropdown.getBoundingClientRect();
dropdown.verticalOffset = 10; dropdown.verticalOffset = 10;
@ -323,13 +331,11 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
// horizontalAlign is right, so a positive offset moves to the left. // horizontalAlign is right, so a positive offset moves to the left.
expect(dropdownRect.right - 10).to.be.closeTo(offsetDropdownRect.right, 0.1); expect(dropdownRect.right - 10).to.be.closeTo(offsetDropdownRect.right, 0.1);
done(); done();
}, 1); });
}); });
test('can be offset towards the bottom right', function(done) { test('can be offset towards the bottom right', function(done) {
dropdown.opened = true; runAfterOpen(dropdown, function () {
Polymer.Base.async(function() {
dropdownRect = dropdown.getBoundingClientRect(); dropdownRect = dropdown.getBoundingClientRect();
dropdown.verticalOffset = -10; dropdown.verticalOffset = -10;
@ -341,7 +347,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
// horizontalAlign is right, so a positive offset moves to the right. // horizontalAlign is right, so a positive offset moves to the right.
expect(dropdownRect.right + 10).to.be.closeTo(offsetDropdownRect.right, 0.1); expect(dropdownRect.right + 10).to.be.closeTo(offsetDropdownRect.right, 0.1);
done(); done();
}, 1); });
}); });
}); });
@ -352,9 +358,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
test('with horizontalAlign=left', function(done) { test('with horizontalAlign=left', function(done) {
var parent = fixture('RTLDropdownLeft'); var parent = fixture('RTLDropdownLeft');
dropdown = parent.querySelector('iron-dropdown'); dropdown = parent.querySelector('iron-dropdown');
dropdown.open(); runAfterOpen(dropdown, function () {
Polymer.Base.async(function() {
// In RTL, if `horizontalAlign` is "left", that's the same as // In RTL, if `horizontalAlign` is "left", that's the same as
// being right-aligned in LTR. So the dropdown should be in the top // being right-aligned in LTR. So the dropdown should be in the top
// right corner. // right corner.
@ -368,9 +372,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
test('with horizontalAlign=right', function(done) { test('with horizontalAlign=right', function(done) {
var parent = fixture('RTLDropdownRight'); var parent = fixture('RTLDropdownRight');
dropdown = parent.querySelector('iron-dropdown'); dropdown = parent.querySelector('iron-dropdown');
dropdown.open(); runAfterOpen(dropdown, function () {
Polymer.Base.async(function() {
// In RTL, if `horizontalAlign` is "right", that's the same as // In RTL, if `horizontalAlign` is "right", that's the same as
// being left-aligned in LTR. So the dropdown should be in the top // being left-aligned in LTR. So the dropdown should be in the top
// left corner. // left corner.

View file

@ -0,0 +1,27 @@
<!--
@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
-->
<link rel="import" href="../../polymer/polymer.html">
<dom-module id="x-scrollable-element">
<template>
<div id="ChildOne">
<div id="GrandchildOne"></div>
</div>
<div id="ChildTwo">
<div id="GrandchildTwo"></div>
</div>
</template>
<script>
Polymer({
is: 'x-scrollable-element'
});
</script>
</dom-module>

View file

@ -28,14 +28,14 @@
"iron-component-page": "polymerelements/iron-component-page#^1.0.0" "iron-component-page": "polymerelements/iron-component-page#^1.0.0"
}, },
"ignore": [], "ignore": [],
"homepage": "https://github.com/PolymerElements/iron-flex-layout", "homepage": "https://github.com/polymerelements/iron-flex-layout",
"_release": "1.2.2", "_release": "1.2.2",
"_resolution": { "_resolution": {
"type": "version", "type": "version",
"tag": "v1.2.2", "tag": "v1.2.2",
"commit": "41c4f35be1368afb770312b907a258175565dbdf" "commit": "41c4f35be1368afb770312b907a258175565dbdf"
}, },
"_source": "git://github.com/PolymerElements/iron-flex-layout.git", "_source": "git://github.com/polymerelements/iron-flex-layout.git",
"_target": "^1.0.0", "_target": "^1.0.0",
"_originalSource": "PolymerElements/iron-flex-layout" "_originalSource": "polymerelements/iron-flex-layout"
} }

View file

@ -1,6 +1,6 @@
{ {
"name": "iron-overlay-behavior", "name": "iron-overlay-behavior",
"version": "1.2.0", "version": "1.3.0",
"license": "http://polymer.github.io/LICENSE.txt", "license": "http://polymer.github.io/LICENSE.txt",
"description": "Provides a behavior for making an element an overlay", "description": "Provides a behavior for making an element an overlay",
"private": true, "private": true,
@ -19,26 +19,25 @@
"url": "git://github.com/PolymerElements/iron-overlay-behavior.git" "url": "git://github.com/PolymerElements/iron-overlay-behavior.git"
}, },
"dependencies": { "dependencies": {
"polymer": "Polymer/polymer#^1.0.0",
"iron-fit-behavior": "PolymerElements/iron-fit-behavior#^1.0.0", "iron-fit-behavior": "PolymerElements/iron-fit-behavior#^1.0.0",
"iron-resizable-behavior": "PolymerElements/iron-resizable-behavior#^1.0.0" "iron-resizable-behavior": "PolymerElements/iron-resizable-behavior#^1.0.0",
"polymer": "Polymer/polymer#^1.0.0"
}, },
"devDependencies": { "devDependencies": {
"paper-styles": "polymerelements/paper-styles#^1.0.2",
"iron-component-page": "PolymerElements/iron-component-page#^1.0.0", "iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
"iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0", "iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0",
"iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0", "iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0",
"test-fixture": "PolymerElements/test-fixture#^1.0.0", "paper-styles": "PolymerElements/paper-styles#^1.0.2",
"web-component-tester": "^4.0.0", "web-component-tester": "^4.0.0",
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0" "webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
}, },
"ignore": [], "ignore": [],
"homepage": "https://github.com/polymerelements/iron-overlay-behavior", "homepage": "https://github.com/polymerelements/iron-overlay-behavior",
"_release": "1.2.0", "_release": "1.3.0",
"_resolution": { "_resolution": {
"type": "version", "type": "version",
"tag": "v1.2.0", "tag": "v1.3.0",
"commit": "1d8e1d29c601add9c135e5103c4d1d0d652dd957" "commit": "b488ce94ec1c17c3a5491af1a2fba2f7382684da"
}, },
"_source": "git://github.com/polymerelements/iron-overlay-behavior.git", "_source": "git://github.com/polymerelements/iron-overlay-behavior.git",
"_target": "^1.0.0", "_target": "^1.0.0",

View file

@ -5,6 +5,11 @@ https://github.com/PolymerElements/ContributionGuide/blob/master/CONTRIBUTING.md
If you edit that file, it will get updated everywhere else. If you edit that file, it will get updated everywhere else.
If you edit this file, your changes will get overridden :) If you edit this file, your changes will get overridden :)
You can however override the jsbin link with one that's customized to this
specific element:
jsbin=https://jsbin.com/cagaye/edit?html,output
--> -->
# Polymer Elements # Polymer Elements
## Guide for Contributors ## Guide for Contributors
@ -41,7 +46,7 @@ Polymer Elements are built in the open, and the Polymer authors eagerly encourag
3. Click the `paper-foo` element. 3. Click the `paper-foo` element.
``` ```
2. **A reduced test case that demonstrates the problem.** If possible, please include the test case as a JSBin. Start with this template to easily import and use relevant Polymer Elements: [http://jsbin.com/cagaye](http://jsbin.com/cagaye/edit?html,output). 2. **A reduced test case that demonstrates the problem.** If possible, please include the test case as a JSBin. Start with this template to easily import and use relevant Polymer Elements: [https://jsbin.com/cagaye/edit?html,output](https://jsbin.com/cagaye/edit?html,output).
3. **A list of browsers where the problem occurs.** This can be skipped if the problem is the same across all browsers. 3. **A list of browsers where the problem occurs.** This can be skipped if the problem is the same across all browsers.
@ -51,14 +56,14 @@ Polymer Elements are built in the open, and the Polymer authors eagerly encourag
When submitting pull requests, please provide: When submitting pull requests, please provide:
1. **A reference to the corresponding issue** or issues that will be closed by the pull request. Please refer to these issues using the following syntax: 1. **A reference to the corresponding issue** or issues that will be closed by the pull request. Please refer to these issues in the pull request description using the following syntax:
```markdown ```markdown
(For a single issue) (For a single issue)
Fixes #20 Fixes #20
(For multiple issues) (For multiple issues)
Fixes #32, #40 Fixes #32, fixes #40
``` ```
2. **A succinct description of the design** used to fix any related issues. For example: 2. **A succinct description of the design** used to fix any related issues. For example:

View file

@ -1,6 +1,6 @@
{ {
"name": "iron-overlay-behavior", "name": "iron-overlay-behavior",
"version": "1.2.0", "version": "1.3.0",
"license": "http://polymer.github.io/LICENSE.txt", "license": "http://polymer.github.io/LICENSE.txt",
"description": "Provides a behavior for making an element an overlay", "description": "Provides a behavior for making an element an overlay",
"private": true, "private": true,
@ -19,16 +19,15 @@
"url": "git://github.com/PolymerElements/iron-overlay-behavior.git" "url": "git://github.com/PolymerElements/iron-overlay-behavior.git"
}, },
"dependencies": { "dependencies": {
"polymer": "Polymer/polymer#^1.0.0",
"iron-fit-behavior": "PolymerElements/iron-fit-behavior#^1.0.0", "iron-fit-behavior": "PolymerElements/iron-fit-behavior#^1.0.0",
"iron-resizable-behavior": "PolymerElements/iron-resizable-behavior#^1.0.0" "iron-resizable-behavior": "PolymerElements/iron-resizable-behavior#^1.0.0",
"polymer": "Polymer/polymer#^1.0.0"
}, },
"devDependencies": { "devDependencies": {
"paper-styles": "polymerelements/paper-styles#^1.0.2",
"iron-component-page": "PolymerElements/iron-component-page#^1.0.0", "iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
"iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0", "iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0",
"iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0", "iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0",
"test-fixture": "PolymerElements/test-fixture#^1.0.0", "paper-styles": "PolymerElements/paper-styles#^1.0.2",
"web-component-tester": "^4.0.0", "web-component-tester": "^4.0.0",
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0" "webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
}, },

View file

@ -120,7 +120,10 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<button data-dialog="backdrop">backdrop</button> <button data-dialog="backdrop">backdrop</button>
<simple-overlay id="backdrop" with-backdrop> <simple-overlay id="backdrop" with-backdrop>
Hello world! <p>Hello world!</p>
<button>button</button>
<button>button</button>
<button>button</button>
</simple-overlay> </simple-overlay>
<button data-dialog="autofocus">autofocus</button> <button data-dialog="autofocus">autofocus</button>

View file

@ -118,10 +118,14 @@ Custom property | Description | Default
this.style.zIndex = this._manager.backdropZ(); this.style.zIndex = this._manager.backdropZ();
// close only if no element with backdrop is left // close only if no element with backdrop is left
if (this._manager.getBackdrops().length === 0) { if (this._manager.getBackdrops().length === 0) {
// Read style before setting opened.
var cs = getComputedStyle(this);
var noAnimation = (cs.transitionDuration === '0s' || cs.opacity == 0);
this._setOpened(false); this._setOpened(false);
// complete() will be called after the transition is done. // In case of no animations, complete
// If animations are disabled via custom-styles, user is expected to call if (noAnimation) {
// complete() after close() this.complete();
}
} }
}, },

View file

@ -135,6 +135,18 @@ context. You should place this element as a child of `<body>` whenever possible.
value: function() { value: function() {
return this._onCaptureKeydown.bind(this); return this._onCaptureKeydown.bind(this);
} }
},
_boundOnCaptureFocus: {
type: Function,
value: function() {
return this._onCaptureFocus.bind(this);
}
},
/** @type {?Node} */
_focusedChild: {
type: Object
} }
}, },
@ -152,10 +164,13 @@ context. You should place this element as a child of `<body>` whenever possible.
}, },
get _focusNode() { get _focusNode() {
return Polymer.dom(this).querySelector('[autofocus]') || this; return this._focusedChild || Polymer.dom(this).querySelector('[autofocus]') || this;
}, },
ready: function() { ready: function() {
// with-backdrop need tabindex to be set in order to trap the focus.
// If it is not set, IronOverlayBehavior will set it, and remove it if with-backdrop = false.
this.__shouldRemoveTabIndex = false;
this._ensureSetup(); this._ensureSetup();
}, },
@ -265,6 +280,14 @@ context. You should place this element as a child of `<body>` whenever possible.
}, },
_withBackdropChanged: function() { _withBackdropChanged: function() {
// If tabindex is already set, no need to override it.
if (this.withBackdrop && !this.hasAttribute('tabindex')) {
this.setAttribute('tabindex', '-1');
this.__shouldRemoveTabIndex = true;
} else if (this.__shouldRemoveTabIndex) {
this.removeAttribute('tabindex');
this.__shouldRemoveTabIndex = false;
}
if (this.opened) { if (this.opened) {
this._manager.trackBackdrop(this); this._manager.trackBackdrop(this);
if (this.withBackdrop) { if (this.withBackdrop) {
@ -298,6 +321,7 @@ context. You should place this element as a child of `<body>` whenever possible.
_toggleListeners: function () { _toggleListeners: function () {
this._toggleListener(this.opened, document, 'tap', this._boundOnCaptureClick, true); this._toggleListener(this.opened, document, 'tap', this._boundOnCaptureClick, true);
this._toggleListener(this.opened, document, 'keydown', this._boundOnCaptureKeydown, true); this._toggleListener(this.opened, document, 'keydown', this._boundOnCaptureKeydown, true);
this._toggleListener(this.opened, document, 'focus', this._boundOnCaptureFocus, true);
}, },
// tasks which must occur before opening; e.g. making the element visible // tasks which must occur before opening; e.g. making the element visible
@ -343,6 +367,7 @@ context. You should place this element as a child of `<body>` whenever possible.
this.style.display = 'none'; this.style.display = 'none';
this._manager.removeOverlay(this); this._manager.removeOverlay(this);
this._focusedChild = null;
this._applyFocus(); this._applyFocus();
this.notifyResize(); this.notifyResize();
@ -376,9 +401,12 @@ context. You should place this element as a child of `<body>` whenever possible.
_onCaptureClick: function(event) { _onCaptureClick: function(event) {
if (this._manager.currentOverlay() === this && if (this._manager.currentOverlay() === this &&
!this.noCancelOnOutsideClick &&
Polymer.dom(event).path.indexOf(this) === -1) { Polymer.dom(event).path.indexOf(this) === -1) {
this.cancel(); if (this.noCancelOnOutsideClick) {
this._applyFocus();
} else {
this.cancel();
}
} }
}, },
@ -391,6 +419,19 @@ context. You should place this element as a child of `<body>` whenever possible.
} }
}, },
_onCaptureFocus: function (event) {
if (this._manager.currentOverlay() === this &&
this.withBackdrop) {
var path = Polymer.dom(event).path;
if (path.indexOf(this) === -1) {
event.stopPropagation();
this._applyFocus();
} else {
this._focusedChild = path[0];
}
}
},
_onIronResize: function() { _onIronResize: function() {
if (this.opened) { if (this.opened) {
this.refit(); this.refit();

View file

@ -323,6 +323,19 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
}); });
}); });
test('no-cancel-on-outside-click property; focus stays on overlay when click outside', function(done) {
overlay = fixture('autofocus');
overlay.noCancelOnOutsideClick = true;
runAfterOpen(overlay, function() {
MockInteractions.tap(document.body);
setTimeout(function() {
assert.equal(Polymer.dom(overlay).querySelector('[autofocus]'), document.activeElement, '<button autofocus> is focused');
done();
}, 10);
});
});
test('no-cancel-on-esc-key property', function(done) { test('no-cancel-on-esc-key property', function(done) {
overlay.noCancelOnEscKey = true; overlay.noCancelOnEscKey = true;
runAfterOpen(overlay, function() { runAfterOpen(overlay, function() {
@ -465,6 +478,42 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
overlays[0].opened = false; overlays[0].opened = false;
assert.equal(overlays[0]._manager.getBackdrops().length, 0, 'overlay removed from manager backdrops'); assert.equal(overlays[0]._manager.getBackdrops().length, 0, 'overlay removed from manager backdrops');
}); });
test('with-backdrop sets tabindex=-1 and removes it', function() {
var overlay = fixture('basic');
overlay.withBackdrop = true;
assert.equal(overlay.getAttribute('tabindex'), '-1', 'tabindex is -1');
overlay.withBackdrop = false;
assert.isFalse(overlay.hasAttribute('tabindex'), 'tabindex removed');
});
test('with-backdrop does not override tabindex if already set', function() {
var overlay = fixture('basic');
overlay.setAttribute('tabindex', '1');
overlay.withBackdrop = true;
assert.equal(overlay.getAttribute('tabindex'), '1', 'tabindex is 1');
overlay.withBackdrop = false;
assert.equal(overlay.getAttribute('tabindex'), '1', 'tabindex is still 1');
});
test('with-backdrop traps the focus within the overlay', function(done) {
// Add button to try to "steal" focus.
var button = document.createElement('button');
var focusSpy = sinon.stub();
button.addEventListener('focus', focusSpy, true);
document.body.appendChild(button);
var overlay = fixture('autofocus');
overlay.withBackdrop = true;
runAfterOpen(overlay, function() {
// Try to steal the focus
MockInteractions.focus(button);
assert.isFalse(focusSpy.called, 'button in body did not get the focus');
assert.equal(Polymer.dom(overlay).querySelector('[autofocus]'), document.activeElement, '<button autofocus> is focused');
button.parentNode.removeChild(button);
done();
});
});
}); });
suite('multiple overlays with backdrop', function() { suite('multiple overlays with backdrop', function() {
@ -492,17 +541,31 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
}); });
test('updating with-backdrop to false closes backdrop', function(done) { test('updating with-backdrop to false closes backdrop', function(done) {
// no waiting for animations
overlays[0].backdropElement.style.transitionDuration = '0s';
runAfterOpen(overlays[0], function() { runAfterOpen(overlays[0], function() {
overlays[0].withBackdrop = false; overlays[0].withBackdrop = false;
// Don't wait for animations.
overlays[0].backdropElement.complete();
assert.isFalse(overlays[0].backdropElement.opened, 'backdrop is closed'); assert.isFalse(overlays[0].backdropElement.opened, 'backdrop is closed');
assert.isNotObject(overlays[0].backdropElement.parentNode, 'backdrop is removed from document'); assert.isNotObject(overlays[0].backdropElement.parentNode, 'backdrop is removed from document');
overlays[0].backdropElement.style.transitionDuration = '';
done(); done();
}); });
}); });
test('backdrop is removed when toggling overlay opened', function(done) {
overlays[0].open();
assert.isObject(overlays[0].backdropElement.parentNode, 'backdrop is immediately inserted in the document');
overlays[0].close();
// Wait a tick (overlay will call backdropElement.close in the _openChangedAsync)
setTimeout(function() {
assert.isFalse(overlays[0].backdropElement.opened, 'backdrop is closed');
assert.isNotObject(overlays[0].backdropElement.parentNode, 'backdrop is removed from document');
done();
}, 1);
});
test('updating with-backdrop updates z-index', function(done) { test('updating with-backdrop updates z-index', function(done) {
runAfterOpen(overlays[0], function() { runAfterOpen(overlays[0], function() {
runAfterOpen(overlays[1], function() { runAfterOpen(overlays[1], function() {

View file

@ -0,0 +1,40 @@
<!--
@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
-->
<link rel="import" href="../../polymer/polymer.html">
<dom-module id="test-buttons">
<style>
:host {
border: 1px solid black;
padding: 10px;
}
</style>
<template>
<button id="button0">button0</button>
<button id="button1">button1</button>
<button id="button2">button2</button>
</template>
</dom-module>
<script>
(function() {
Polymer({
is: 'test-buttons'
});
})();
</script>

View file

@ -32,14 +32,14 @@
"iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0" "iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0"
}, },
"ignore": [], "ignore": [],
"homepage": "https://github.com/polymerelements/paper-ripple", "homepage": "https://github.com/PolymerElements/paper-ripple",
"_release": "1.0.5", "_release": "1.0.5",
"_resolution": { "_resolution": {
"type": "version", "type": "version",
"tag": "v1.0.5", "tag": "v1.0.5",
"commit": "d72e7a9a8ab518b901ed18dde492df3b87a93be5" "commit": "d72e7a9a8ab518b901ed18dde492df3b87a93be5"
}, },
"_source": "git://github.com/polymerelements/paper-ripple.git", "_source": "git://github.com/PolymerElements/paper-ripple.git",
"_target": "^1.0.0", "_target": "^1.0.0",
"_originalSource": "polymerelements/paper-ripple" "_originalSource": "PolymerElements/paper-ripple"
} }

View file

@ -2037,6 +2037,21 @@ var AppInfo = {};
define("connectionManager", [], function () { define("connectionManager", [], function () {
return ConnectionManager; return ConnectionManager;
}); });
define("globalize", [], function () {
return Globalize;
});
define('dialogText', [], getDialogText());
}
function getDialogText() {
return function () {
return {
buttonOk: 'ButtonOk',
buttonCancel: 'ButtonCancel'
};
};
} }
function initRequireWithBrowser(browser) { function initRequireWithBrowser(browser) {