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.
114 lines
3.0 KiB
114 lines
3.0 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 getMarkupWrap
|
||
|
*/
|
||
|
|
||
|
var ExecutionEnvironment = require("./ExecutionEnvironment");
|
||
|
|
||
|
var invariant = require("./invariant");
|
||
|
|
||
|
/**
|
||
|
* Dummy container used to detect which wraps are necessary.
|
||
|
*/
|
||
|
var dummyNode =
|
||
|
ExecutionEnvironment.canUseDOM ? document.createElement('div') : null;
|
||
|
|
||
|
/**
|
||
|
* Some browsers cannot use `innerHTML` to render certain elements standalone,
|
||
|
* so we wrap them, render the wrapped nodes, then extract the desired node.
|
||
|
*
|
||
|
* In IE8, certain elements cannot render alone, so wrap all elements ('*').
|
||
|
*/
|
||
|
var shouldWrap = {
|
||
|
// Force wrapping for SVG elements because if they get created inside a <div>,
|
||
|
// they will be initialized in the wrong namespace (and will not display).
|
||
|
'circle': true,
|
||
|
'defs': true,
|
||
|
'ellipse': true,
|
||
|
'g': true,
|
||
|
'line': true,
|
||
|
'linearGradient': true,
|
||
|
'path': true,
|
||
|
'polygon': true,
|
||
|
'polyline': true,
|
||
|
'radialGradient': true,
|
||
|
'rect': true,
|
||
|
'stop': true,
|
||
|
'text': true
|
||
|
};
|
||
|
|
||
|
var selectWrap = [1, '<select multiple="true">', '</select>'];
|
||
|
var tableWrap = [1, '<table>', '</table>'];
|
||
|
var trWrap = [3, '<table><tbody><tr>', '</tr></tbody></table>'];
|
||
|
|
||
|
var svgWrap = [1, '<svg>', '</svg>'];
|
||
|
|
||
|
var markupWrap = {
|
||
|
'*': [1, '?<div>', '</div>'],
|
||
|
|
||
|
'area': [1, '<map>', '</map>'],
|
||
|
'col': [2, '<table><tbody></tbody><colgroup>', '</colgroup></table>'],
|
||
|
'legend': [1, '<fieldset>', '</fieldset>'],
|
||
|
'param': [1, '<object>', '</object>'],
|
||
|
'tr': [2, '<table><tbody>', '</tbody></table>'],
|
||
|
|
||
|
'optgroup': selectWrap,
|
||
|
'option': selectWrap,
|
||
|
|
||
|
'caption': tableWrap,
|
||
|
'colgroup': tableWrap,
|
||
|
'tbody': tableWrap,
|
||
|
'tfoot': tableWrap,
|
||
|
'thead': tableWrap,
|
||
|
|
||
|
'td': trWrap,
|
||
|
'th': trWrap,
|
||
|
|
||
|
'circle': svgWrap,
|
||
|
'defs': svgWrap,
|
||
|
'ellipse': svgWrap,
|
||
|
'g': svgWrap,
|
||
|
'line': svgWrap,
|
||
|
'linearGradient': svgWrap,
|
||
|
'path': svgWrap,
|
||
|
'polygon': svgWrap,
|
||
|
'polyline': svgWrap,
|
||
|
'radialGradient': svgWrap,
|
||
|
'rect': svgWrap,
|
||
|
'stop': svgWrap,
|
||
|
'text': svgWrap
|
||
|
};
|
||
|
|
||
|
/**
|
||
|
* Gets the markup wrap configuration for the supplied `nodeName`.
|
||
|
*
|
||
|
* NOTE: This lazily detects which wraps are necessary for the current browser.
|
||
|
*
|
||
|
* @param {string} nodeName Lowercase `nodeName`.
|
||
|
* @return {?array} Markup wrap configuration, if applicable.
|
||
|
*/
|
||
|
function getMarkupWrap(nodeName) {
|
||
|
("production" !== process.env.NODE_ENV ? invariant(!!dummyNode, 'Markup wrapping node not initialized') : invariant(!!dummyNode));
|
||
|
if (!markupWrap.hasOwnProperty(nodeName)) {
|
||
|
nodeName = '*';
|
||
|
}
|
||
|
if (!shouldWrap.hasOwnProperty(nodeName)) {
|
||
|
if (nodeName === '*') {
|
||
|
dummyNode.innerHTML = '<link />';
|
||
|
} else {
|
||
|
dummyNode.innerHTML = '<' + nodeName + '></' + nodeName + '>';
|
||
|
}
|
||
|
shouldWrap[nodeName] = !dummyNode.firstChild;
|
||
|
}
|
||
|
return shouldWrap[nodeName] ? markupWrap[nodeName] : null;
|
||
|
}
|
||
|
|
||
|
|
||
|
module.exports = getMarkupWrap;
|