Skip to content
This repository has been archived by the owner on Sep 5, 2024. It is now read-only.

Commit

Permalink
fix(tooltip): interpolate the tooltip text when adding it to the aria…
Browse files Browse the repository at this point in the history
…-label

Fixes the raw tooltip text text being added to the parent, if a tooltip contained a data binding, instead of the interpolated value.

Fixes #6855.

Closes #8170
  • Loading branch information
crisbeto authored and ThomasBurleson committed Jun 3, 2016
1 parent 9f6eecb commit 60910ef
Show file tree
Hide file tree
Showing 2 changed files with 45 additions and 4 deletions.
19 changes: 15 additions & 4 deletions src/components/tooltip/tooltip.js
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ angular
* @param {string=} md-direction Which direction would you like the tooltip to go? Supports left, right, top, and bottom. Defaults to bottom.
*/
function MdTooltipDirective($timeout, $window, $$rAF, $document, $mdUtil, $mdTheming, $rootElement,
$animate, $q) {
$animate, $q, $interpolate) {

var TOOLTIP_SHOW_DELAY = 0;
var TOOLTIP_WINDOW_EDGE_SPACE = 8;
Expand Down Expand Up @@ -150,11 +150,22 @@ function MdTooltipDirective($timeout, $window, $$rAF, $document, $mdUtil, $mdThe
element.remove();
attributeObserver && attributeObserver.disconnect();
});

// Updates the aria-label when the element text changes. This watch
// doesn't need to be set up if the element doesn't have any data
// bindings.
if (element.text().indexOf($interpolate.startSymbol()) > -1) {
scope.$watch(function() {
return element.text().trim();
}, addAriaLabel);
}
}

function addAriaLabel () {
if (!parent.attr('aria-label') && !parent.text().trim()) {
parent.attr('aria-label', element.text().trim());
function addAriaLabel (override) {
if ((override || !parent.attr('aria-label')) && !parent.text().trim()) {
var rawText = override || element.text().trim();
var interpolatedText = $interpolate(rawText)(parent.scope());
parent.attr('aria-label', interpolatedText);
}
}

Expand Down
30 changes: 30 additions & 0 deletions src/components/tooltip/tooltip.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -67,6 +67,36 @@ describe('<md-tooltip> directive', function() {
expect(element.attr('aria-label')).toEqual('Tooltip');
});

it('should interpolate the aria-label', function(){
buildTooltip(
'<md-button>' +
'<md-tooltip>{{ "hello" | uppercase }}</md-tooltip>' +
'</md-button>'
);

expect(element.attr('aria-label')).toBe('HELLO');
});

it('should update the aria-label when the interpolated value changes', function(){
buildTooltip(
'<md-button>' +
'<md-tooltip>{{ testModel.ariaTest }}</md-tooltip>' +
'</md-button>'
);

$rootScope.$apply(function() {
$rootScope.testModel.ariaTest = 'test 1';
});

expect(element.attr('aria-label')).toBe('test 1');

$rootScope.$apply(function() {
$rootScope.testModel.ariaTest = 'test 2';
});

expect(element.attr('aria-label')).toBe('test 2');
});

it('should not set parent to items with no pointer events', inject(function($window){
spyOn($window, 'getComputedStyle').and.callFake(function(el) {
return { 'pointer-events': el ? 'none' : '' };
Expand Down

0 comments on commit 60910ef

Please sign in to comment.