You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
189 lines
5.9 KiB
189 lines
5.9 KiB
10 years ago
|
/**
|
||
|
* Copyright 2013-2015, Facebook, Inc.
|
||
|
* All rights reserved.
|
||
|
*
|
||
|
* This source code is licensed under the BSD-style license found in the
|
||
|
* LICENSE file in the root directory of this source tree. An additional grant
|
||
|
* of patent rights can be found in the PATENTS file in the same directory.
|
||
|
*
|
||
|
* @providesModule DOMPropertyOperations
|
||
|
* @typechecks static-only
|
||
|
*/
|
||
|
|
||
|
'use strict';
|
||
|
|
||
|
var DOMProperty = require("./DOMProperty");
|
||
|
|
||
|
var quoteAttributeValueForBrowser = require("./quoteAttributeValueForBrowser");
|
||
|
var warning = require("./warning");
|
||
|
|
||
|
function shouldIgnoreValue(name, value) {
|
||
|
return value == null ||
|
||
|
(DOMProperty.hasBooleanValue[name] && !value) ||
|
||
|
(DOMProperty.hasNumericValue[name] && isNaN(value)) ||
|
||
|
(DOMProperty.hasPositiveNumericValue[name] && (value < 1)) ||
|
||
|
(DOMProperty.hasOverloadedBooleanValue[name] && value === false);
|
||
|
}
|
||
|
|
||
|
if ("production" !== process.env.NODE_ENV) {
|
||
|
var reactProps = {
|
||
|
children: true,
|
||
|
dangerouslySetInnerHTML: true,
|
||
|
key: true,
|
||
|
ref: true
|
||
|
};
|
||
|
var warnedProperties = {};
|
||
|
|
||
|
var warnUnknownProperty = function(name) {
|
||
|
if (reactProps.hasOwnProperty(name) && reactProps[name] ||
|
||
|
warnedProperties.hasOwnProperty(name) && warnedProperties[name]) {
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
warnedProperties[name] = true;
|
||
|
var lowerCasedName = name.toLowerCase();
|
||
|
|
||
|
// data-* attributes should be lowercase; suggest the lowercase version
|
||
|
var standardName = (
|
||
|
DOMProperty.isCustomAttribute(lowerCasedName) ?
|
||
|
lowerCasedName :
|
||
|
DOMProperty.getPossibleStandardName.hasOwnProperty(lowerCasedName) ?
|
||
|
DOMProperty.getPossibleStandardName[lowerCasedName] :
|
||
|
null
|
||
|
);
|
||
|
|
||
|
// For now, only warn when we have a suggested correction. This prevents
|
||
|
// logging too much when using transferPropsTo.
|
||
|
("production" !== process.env.NODE_ENV ? warning(
|
||
|
standardName == null,
|
||
|
'Unknown DOM property %s. Did you mean %s?',
|
||
|
name,
|
||
|
standardName
|
||
|
) : null);
|
||
|
|
||
|
};
|
||
|
}
|
||
|
|
||
|
/**
|
||
|
* Operations for dealing with DOM properties.
|
||
|
*/
|
||
|
var DOMPropertyOperations = {
|
||
|
|
||
|
/**
|
||
|
* Creates markup for the ID property.
|
||
|
*
|
||
|
* @param {string} id Unescaped ID.
|
||
|
* @return {string} Markup string.
|
||
|
*/
|
||
|
createMarkupForID: function(id) {
|
||
|
return DOMProperty.ID_ATTRIBUTE_NAME + '=' +
|
||
|
quoteAttributeValueForBrowser(id);
|
||
|
},
|
||
|
|
||
|
/**
|
||
|
* Creates markup for a property.
|
||
|
*
|
||
|
* @param {string} name
|
||
|
* @param {*} value
|
||
|
* @return {?string} Markup string, or null if the property was invalid.
|
||
|
*/
|
||
|
createMarkupForProperty: function(name, value) {
|
||
|
if (DOMProperty.isStandardName.hasOwnProperty(name) &&
|
||
|
DOMProperty.isStandardName[name]) {
|
||
|
if (shouldIgnoreValue(name, value)) {
|
||
|
return '';
|
||
|
}
|
||
|
var attributeName = DOMProperty.getAttributeName[name];
|
||
|
if (DOMProperty.hasBooleanValue[name] ||
|
||
|
(DOMProperty.hasOverloadedBooleanValue[name] && value === true)) {
|
||
|
return attributeName;
|
||
|
}
|
||
|
return attributeName + '=' + quoteAttributeValueForBrowser(value);
|
||
|
} else if (DOMProperty.isCustomAttribute(name)) {
|
||
|
if (value == null) {
|
||
|
return '';
|
||
|
}
|
||
|
return name + '=' + quoteAttributeValueForBrowser(value);
|
||
|
} else if ("production" !== process.env.NODE_ENV) {
|
||
|
warnUnknownProperty(name);
|
||
|
}
|
||
|
return null;
|
||
|
},
|
||
|
|
||
|
/**
|
||
|
* Sets the value for a property on a node.
|
||
|
*
|
||
|
* @param {DOMElement} node
|
||
|
* @param {string} name
|
||
|
* @param {*} value
|
||
|
*/
|
||
|
setValueForProperty: function(node, name, value) {
|
||
|
if (DOMProperty.isStandardName.hasOwnProperty(name) &&
|
||
|
DOMProperty.isStandardName[name]) {
|
||
|
var mutationMethod = DOMProperty.getMutationMethod[name];
|
||
|
if (mutationMethod) {
|
||
|
mutationMethod(node, value);
|
||
|
} else if (shouldIgnoreValue(name, value)) {
|
||
|
this.deleteValueForProperty(node, name);
|
||
|
} else if (DOMProperty.mustUseAttribute[name]) {
|
||
|
// `setAttribute` with objects becomes only `[object]` in IE8/9,
|
||
|
// ('' + value) makes it output the correct toString()-value.
|
||
|
node.setAttribute(DOMProperty.getAttributeName[name], '' + value);
|
||
|
} else {
|
||
|
var propName = DOMProperty.getPropertyName[name];
|
||
|
// Must explicitly cast values for HAS_SIDE_EFFECTS-properties to the
|
||
|
// property type before comparing; only `value` does and is string.
|
||
|
if (!DOMProperty.hasSideEffects[name] ||
|
||
|
('' + node[propName]) !== ('' + value)) {
|
||
|
// Contrary to `setAttribute`, object properties are properly
|
||
|
// `toString`ed by IE8/9.
|
||
|
node[propName] = value;
|
||
|
}
|
||
|
}
|
||
|
} else if (DOMProperty.isCustomAttribute(name)) {
|
||
|
if (value == null) {
|
||
|
node.removeAttribute(name);
|
||
|
} else {
|
||
|
node.setAttribute(name, '' + value);
|
||
|
}
|
||
|
} else if ("production" !== process.env.NODE_ENV) {
|
||
|
warnUnknownProperty(name);
|
||
|
}
|
||
|
},
|
||
|
|
||
|
/**
|
||
|
* Deletes the value for a property on a node.
|
||
|
*
|
||
|
* @param {DOMElement} node
|
||
|
* @param {string} name
|
||
|
*/
|
||
|
deleteValueForProperty: function(node, name) {
|
||
|
if (DOMProperty.isStandardName.hasOwnProperty(name) &&
|
||
|
DOMProperty.isStandardName[name]) {
|
||
|
var mutationMethod = DOMProperty.getMutationMethod[name];
|
||
|
if (mutationMethod) {
|
||
|
mutationMethod(node, undefined);
|
||
|
} else if (DOMProperty.mustUseAttribute[name]) {
|
||
|
node.removeAttribute(DOMProperty.getAttributeName[name]);
|
||
|
} else {
|
||
|
var propName = DOMProperty.getPropertyName[name];
|
||
|
var defaultValue = DOMProperty.getDefaultValueForProperty(
|
||
|
node.nodeName,
|
||
|
propName
|
||
|
);
|
||
|
if (!DOMProperty.hasSideEffects[name] ||
|
||
|
('' + node[propName]) !== defaultValue) {
|
||
|
node[propName] = defaultValue;
|
||
|
}
|
||
|
}
|
||
|
} else if (DOMProperty.isCustomAttribute(name)) {
|
||
|
node.removeAttribute(name);
|
||
|
} else if ("production" !== process.env.NODE_ENV) {
|
||
|
warnUnknownProperty(name);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
};
|
||
|
|
||
|
module.exports = DOMPropertyOperations;
|