replaced Regex with object dict for boolean attributes

pull/15/head
yelouafi 10 years ago
parent 379f736254
commit f86608cd25

@ -201,10 +201,10 @@ h('a', {props: {href: '/foo'}, 'Go to Foo');
Same as props but set attributes instead of properties on DOM elements
```javascript
h('a', {attrs: {href: '/foo'}, 'Go to Foo');
h('a', { attrs: {href: '/foo'} }, 'Go to Foo');
```
Attributes are added and updated using `setAttribute`. In case of an attribute that has been previously added/set is no longer present in the `attrs` object, it is removed from the DOM elemnt's attribute list using `removeAttribute`.
Attributes are added and updated using `setAttribute`. In case of an attribute that has been previously added/set is no longer present in the `attrs` object, it is removed from the DOM element's attribute list using `removeAttribute`.
In the case of boolean attributes (.e.g. `disabled`, `hidden`, `selected` ...). The meaning doesn't depend on the attribute value (`true` of `false`) but depends instead on the presence/absence of the attribute itself in the DOM element. Those attributes are handled differently by the module : if a boolean attribute is set to a [falsy value](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean) (`0`, `-0`, `null`, `false`, `NaN`, `undefined`, or the empty string (`""`)) then the attribute will be removed from the attribute list of the DOM element.

@ -1,7 +1,15 @@
function isBooleanAttribute(attrName) {
return (/^(?:allowfullscreen|async|autofocus|autoplay|checked|compact|controls|declare|default|defaultchecked|defaultmuted|defaultselected|defer|disabled|draggable|enabled|formnovalidate|hidden|indeterminate|inert|ismap|itemscope|loop|multiple|muted|nohref|noresize|noshade|novalidate|nowrap|open|pauseonexit|readonly|required|reversed|scoped|seamless|selected|sortable|spellcheck|translate|truespeed|typemustmatch|visible)$/).test(attrName);
var booleanAttrs = ["allowfullscreen", "async", "autofocus", "autoplay", "checked", "compact", "controls", "declare",
"default", "defaultchecked", "defaultmuted", "defaultselected", "defer", "disabled", "draggable",
"enabled", "formnovalidate", "hidden", "indeterminate", "inert", "ismap", "itemscope", "loop", "multiple",
"muted", "nohref", "noresize", "noshade", "novalidate", "nowrap", "open", "pauseonexit", "readonly",
"required", "reversed", "scoped", "seamless", "selected", "sortable", "spellcheck", "translate",
"truespeed", "typemustmatch", "visible"];
var booleanAttrsDict = {};
for(var i=0, len = booleanAttrs.length; i < len; i++) {
booleanAttrsDict[booleanAttrs[i]] = true;
}
function updateAttrs(oldVnode, vnode) {
var key, cur, old, elm = vnode.elm,
oldAttrs = oldVnode.data.attrs || {}, attrs = vnode.data.attrs || {};
@ -12,7 +20,7 @@ function updateAttrs(oldVnode, vnode) {
old = oldAttrs[key];
if (old !== cur) {
// TODO: add support to namespaced attributes (setAttributeNS)
if(!cur && isBooleanAttribute(key))
if(!cur && booleanAttrsDict[key])
elm.removeAttribute(key);
else
elm.setAttribute(key, cur);

Loading…
Cancel
Save