fix(select): add / remove 'selected' attribute for select[multiple]

Author: Narretz

src/ng/directive/select.js

@@ -606,9 +606,23 @@ var selectDirective = function() {
         // Write value now needs to set the selected property of each matching option
         selectCtrl.writeValue = function writeMultipleValue(value) {
           var items = new HashMap(value);
+          var optionSelected = false;
+
           forEach(element.find('option'), function(option) {
-            option.selected = isDefined(items.get(option.value)) || isDefined(items.get(selectCtrl.selectValueMap[option.value]));
+            var optionIsDefined = isDefined(items.get(option.value)) || isDefined(items.get(selectCtrl.selectValueMap[option.value]));
+            option.selected = optionIsDefined;
+
+            if (optionIsDefined) {
+              option.setAttribute('selected', 'selected');
+              optionSelected = true;
+            } else {
+              option.removeAttribute('selected');
+            }
           });
+
+          if (!optionSelected) {
+            selectCtrl.selectEmptyOption();
+          }
         };
 
         // we have to do it on each watch since ngModel watches reference, but

test/ng/directive/selectSpec.js

@@ -1144,6 +1144,34 @@ describe('select', function() {
     });
 
 
+    it('should add / remove the "selected" attribute on selected / unselected options', function() {
+      compile(
+        '<select name="select" ng-model="selected" multiple>' +
+          '<option value=""></option>' +
+          '<option>A</option>' +
+          '<option>B</option>' +
+          '<option>C</option>' +
+        '</select>');
+
+      scope.selected = ['C'];
+      scope.$apply();
+
+      expect(element.find('option')[0].value).toBe('');
+
+      expect(element.find('option')[0]).not.toBeMarkedAsSelected();
+      expect(element.find('option')[3]).toBeMarkedAsSelected();
+
+      scope.$apply('selected = []');
+      expect(element.find('option')[0]).toBeMarkedAsSelected();
+
+      scope.selected = ['B', 'C'];
+      scope.$apply();
+      expect(element.find('option')[0]).not.toBeMarkedAsSelected();
+      expect(element.find('option')[2]).toBeMarkedAsSelected();
+      expect(element.find('option')[3]).toBeMarkedAsSelected();
+    });
+
+
     describe('calls to $render', function() {
 
       var ngModelCtrl;