Index: third_party/polymer/components/paper-tooltip/test/basic.html |
diff --git a/third_party/polymer/components/paper-tooltip/test/basic.html b/third_party/polymer/components/paper-tooltip/test/basic.html |
index 2d68931a2248cebdfdbd9d6ace0c4c9bd3e793c0..45e386b0dcc16db34d629161e2f6219c4a36b20b 100644 |
--- a/third_party/polymer/components/paper-tooltip/test/basic.html |
+++ b/third_party/polymer/components/paper-tooltip/test/basic.html |
@@ -22,6 +22,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN |
<link rel="import" href="../../test-fixture/test-fixture.html"> |
<link rel="import" href="../paper-tooltip.html"> |
<link rel="import" href="test-button.html"> |
+ <link rel="import" href="test-icon.html"> |
</head> |
<style> |
@@ -92,6 +93,12 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN |
</template> |
</test-fixture> |
+ <test-fixture id="custom-with-content"> |
+ <template> |
+ <test-icon>Tooltip text</test-icon> |
+ </template> |
+ </test-fixture> |
+ |
<test-fixture id="no-offset-parent"> |
<template> |
<div> |
@@ -100,7 +107,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN |
</div> |
</template> |
</test-fixture> |
- |
+ |
<test-fixture id="manual-mode"> |
<template> |
<div> |
@@ -375,27 +382,27 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN |
done(); |
}, 200); |
}); |
- |
+ |
test('tooltip ignores events in manual-mode', function() { |
var f = fixture('manual-mode'); |
- |
+ |
var tooltip = f.querySelector('paper-tooltip'); |
assert.isTrue(tooltip.manualMode); |
- |
+ |
tooltip.show(); |
assert.isTrue(tooltip._showing); |
- |
+ |
sinon.spy(tooltip, 'hide'); |
- |
+ |
tooltip.fire('mouseenter'); |
- |
+ |
var target = f.querySelector('#target'); |
target.dispatchEvent(new CustomEvent('mouseenter')); |
target.dispatchEvent(new CustomEvent('focus')); |
target.dispatchEvent(new CustomEvent('mouseleave')); |
target.dispatchEvent(new CustomEvent('blur')); |
target.dispatchEvent(new CustomEvent('tap')); |
- |
+ |
expect(tooltip.hide.callCount).to.be.equal(0); |
}); |
@@ -480,6 +487,50 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN |
}); |
}); |
+ suite('tooltip is inside a custom element with content', function() { |
+ var f, tooltip, target; |
+ |
+ setup(function() { |
+ f = fixture('custom-with-content'); |
+ target = f.$.icon; |
+ tooltip = f.$.iconTooltip; |
+ }); |
+ |
+ test('tooltip is shown when target is focused', function() { |
+ var actualTooltip = Polymer.dom(tooltip.root).querySelector('#tooltip'); |
+ assert.isTrue(isHidden(actualTooltip)); |
+ |
+ MockInteractions.focus(target); |
+ assert.isFalse(isHidden(actualTooltip)); |
+ }); |
+ |
+ test('tooltip is positioned correctly', function() { |
+ var actualTooltip = Polymer.dom(tooltip.root).querySelector('#tooltip'); |
+ assert.isTrue(isHidden(actualTooltip)); |
+ |
+ MockInteractions.focus(target); |
+ assert.isFalse(isHidden(actualTooltip)); |
+ |
+ var divRect = target.getBoundingClientRect(); |
+ expect(divRect.width).to.be.equal(100); |
+ expect(divRect.height).to.be.equal(20); |
+ |
+ var contentRect = tooltip.getBoundingClientRect(); |
+ expect(contentRect.width).to.be.equal(70); |
+ expect(contentRect.height).to.be.equal(30); |
+ |
+ // The target div width is 100, and the tooltip width is 70, and |
+ // it's centered. The height of the target div is 20, and the |
+ // tooltip is 14px below. |
+ expect(contentRect.left).to.be.equal((100 - 70)/2); |
+ expect(contentRect.top).to.be.equal(20 + 14); |
+ |
+ // Also check the math, just in case. |
+ expect(contentRect.left).to.be.equal((divRect.width - contentRect.width)/2); |
+ expect(contentRect.top).to.be.equal(divRect.height + tooltip.offset); |
+ }); |
+ }); |
+ |
suite('a11y', function() { |
test('has aria role "tooltip"', function() { |
var f = fixture('basic'); |