From e3e23808dcee85d8193583fd144be0a8ba35454a Mon Sep 17 00:00:00 2001
From: Wesley Cho <wesley.cho@gmail.com>
Date: Wed, 2 Mar 2016 08:04:33 -0800
Subject: [PATCH] fix(rating): fix usage of aria-valuetext

- Fix usage to be on top level element
---
 src/rating/rating.js           | 4 +++-
 src/rating/test/rating.spec.js | 1 +
 template/rating/rating.html    | 4 ++--
 3 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/rating/rating.js b/src/rating/rating.js
index 6ccc54e2a6..fe0c363ee9 100644
--- a/src/rating/rating.js
+++ b/src/rating/rating.js
@@ -8,7 +8,8 @@ angular.module('ui.bootstrap.rating', [])
 })
 
 .controller('UibRatingController', ['$scope', '$attrs', 'uibRatingConfig', function($scope, $attrs, ratingConfig) {
-  var ngModelCtrl = { $setViewValue: angular.noop };
+  var ngModelCtrl = { $setViewValue: angular.noop },
+    self = this;
 
   this.init = function(ngModelCtrl_) {
     ngModelCtrl = ngModelCtrl_;
@@ -78,6 +79,7 @@ angular.module('ui.bootstrap.rating', [])
 
   this.render = function() {
     $scope.value = ngModelCtrl.$viewValue;
+    $scope.title = self.getTitle($scope.value - 1);
   };
 }])
 
diff --git a/src/rating/test/rating.spec.js b/src/rating/test/rating.spec.js
index f5614647f7..d435dccccb 100644
--- a/src/rating/test/rating.spec.js
+++ b/src/rating/test/rating.spec.js
@@ -107,6 +107,7 @@ describe('rating directive', function() {
 
     expect(getState()).toEqual([true, true, false, false, false]);
     expect(element.attr('aria-valuenow')).toBe('2');
+    expect(element.attr('aria-valuetext')).toBe('two');
   });
 
   it('shows different number of icons when `max` attribute is set', function() {
diff --git a/template/rating/rating.html b/template/rating/rating.html
index 5543b03d9c..bd74ffb7b2 100644
--- a/template/rating/rating.html
+++ b/template/rating/rating.html
@@ -1,4 +1,4 @@
-<span ng-mouseleave="reset()" ng-keydown="onKeydown($event)" tabindex="0" role="slider" aria-valuemin="0" aria-valuemax="{{range.length}}" aria-valuenow="{{value}}">
+<span ng-mouseleave="reset()" ng-keydown="onKeydown($event)" tabindex="0" role="slider" aria-valuemin="0" aria-valuemax="{{range.length}}" aria-valuenow="{{value}}" aria-valuetext="{{title}}">
     <span ng-repeat-start="r in range track by $index" class="sr-only">({{ $index < value ? '*' : ' ' }})</span>
-    <i ng-repeat-end ng-mouseenter="enter($index + 1)" ng-click="rate($index + 1)" class="glyphicon" ng-class="$index < value && (r.stateOn || 'glyphicon-star') || (r.stateOff || 'glyphicon-star-empty')" ng-attr-title="{{r.title}}" aria-valuetext="{{r.title}}"></i>
+    <i ng-repeat-end ng-mouseenter="enter($index + 1)" ng-click="rate($index + 1)" class="glyphicon" ng-class="$index < value && (r.stateOn || 'glyphicon-star') || (r.stateOff || 'glyphicon-star-empty')" ng-attr-title="{{r.title}}"></i>
 </span>