Proper handling of special attributes in jqlite

Author: mhevery

src/Angular.js

@@ -411,6 +411,19 @@ function isElement(node) {
     || (node.bind && node.find));  // we have a bind and find method part of jQuery API
 }
 
+/**
+ * @param str 'key1,key2,...'
+ * @returns {object} in the form of {key1:true, key2:true, ...}
+ */
+function makeMap(str){
+  var obj = {}, items = str.split(","), i;
+  for ( i = 0; i < items.length; i++ )
+    obj[ items[i] ] = true;
+  return obj;
+}
+
+
+
 /**
  * HTML class which is the only class which can be used in ng:bind to inline HTML for security reasons.
  * @constructor

src/jqLite.js

@@ -32,6 +32,7 @@ function getStyle(element) {
   return current;
 }
 
+//TODO: delete me! dead code?
 if (msie) {
   extend(JQLite.prototype, {
     text: function(value) {
@@ -174,6 +175,8 @@ var JQLitePrototype = JQLite.prototype = {
 // these functions return self on setter and
 // value on get.
 //////////////////////////////////////////
+var SPECIAL_ATTR = makeMap("multiple,selected,checked,disabled,readonly");
+
 forEach({
   data: JQLiteData,
 
@@ -200,7 +203,13 @@ forEach({
   },
 
   attr: function(element, name, value){
-    if (isDefined(value)) {
+    if (SPECIAL_ATTR[name]) {
+      if (isDefined(value)) {
+        element[name] = !!value;
+      } else {
+        return element[name];
+      }
+    } else if (isDefined(value)) {
       element.setAttribute(name, value);
     } else if (element.getAttribute) {
       // the extra argument "2" is to get the right thing for a.href in IE, see jQuery code

src/sanitizer.js

@@ -186,17 +186,6 @@ function htmlParser( html, handler ) {
   }
 }
 
-/**
- * @param str 'key1,key2,...'
- * @returns {object} in the form of {key1:true, key2:true, ...}
- */
-function makeMap(str){
-  var obj = {}, items = str.split(","), i;
-  for ( i = 0; i < items.length; i++ )
-    obj[ items[i] ] = true;
-  return obj;
-}
-
 /**
  * decodes all entities into regular string
  * @param value

test/jqLiteSpec.js

@@ -128,7 +128,7 @@ describe('jqLite', function(){
 
 
   describe('attr', function(){
-    it('shoul read wirite and remove attr', function(){
+    it('shoul read write and remove attr', function(){
       var selector = jqLite([a, b]);
 
       expect(selector.attr('prop', 'value')).toEqual(selector);
@@ -147,6 +147,21 @@ describe('jqLite', function(){
       expect(jqLite(a).attr('prop')).toBeFalsy();
       expect(jqLite(b).attr('prop')).toBeFalsy();
     });
+
+    it('should read special attributes as boolean', function(){
+      var select = jqLite('<select>');
+      expect(select.attr('multiple')).toEqual(false);
+      expect(jqLite('<select multiple>').attr('multiple')).toEqual(true);
+      expect(jqLite('<select multiple="">').attr('multiple')).toEqual(true);
+      expect(jqLite('<select multiple="x">').attr('multiple')).toEqual(true);
+
+      select.attr('multiple', false);
+      expect(select.attr('multiple')).toEqual(false);
+
+      select.attr('multiple', true);
+      expect(select.attr('multiple')).toEqual(true);
+    });
+
   });