mirror of
https://github.com/jquery/jquery.git
synced 2024-11-23 02:54:22 +00:00
Manipulation: Avoid concatenating strings in buildFragment
Concatenating HTML strings in buildFragment is a possible security risk as it creates an opportunity of escaping the concatenated wrapper. It also makes it impossible to support secure HTML wrappers like [trusted types](https://web.dev/trusted-types/). It's safer to create wrapper elements using `document.createElement` & `appendChild`. The previous way was needed in jQuery <4 because IE <10 doesn't accept table parts set via `innerHTML`, even if the element which contents are set is a proper table element, e.g.: ```js tr.innerHTML = "<td></td>"; ``` The whole structure needs to be passed in one HTML string. jQuery 4 drops support for IE <11 so this is no longer an issue; in older version we'd have to duplicate the code paths. IE <10 needed to have `<option>` elements wrapped in `<select multiple="multiple">` but we no longer need that on master which makes the `document.createElement` way shorter as we don't have to call `setAttribute`. All these improvements, apart from making logic more secure, decrease the gzipped size by 58 bytes. Closes gh-4724 Ref gh-4409 Ref angular/angular.js#17028 Co-authored-by: Richard Gibson <richard.gibson@gmail.com>
This commit is contained in:
parent
7a6fae6a7e
commit
9c98e4e86e
@ -1,6 +1,7 @@
|
|||||||
import jQuery from "../core.js";
|
import jQuery from "../core.js";
|
||||||
import toType from "../core/toType.js";
|
import toType from "../core/toType.js";
|
||||||
import isAttached from "../core/isAttached.js";
|
import isAttached from "../core/isAttached.js";
|
||||||
|
import arr from "../var/arr.js";
|
||||||
import rtagName from "./var/rtagName.js";
|
import rtagName from "./var/rtagName.js";
|
||||||
import rscriptType from "./var/rscriptType.js";
|
import rscriptType from "./var/rscriptType.js";
|
||||||
import wrapMap from "./wrapMap.js";
|
import wrapMap from "./wrapMap.js";
|
||||||
@ -35,15 +36,16 @@ function buildFragment( elems, context, scripts, selection, ignored ) {
|
|||||||
|
|
||||||
// Deserialize a standard representation
|
// Deserialize a standard representation
|
||||||
tag = ( rtagName.exec( elem ) || [ "", "" ] )[ 1 ].toLowerCase();
|
tag = ( rtagName.exec( elem ) || [ "", "" ] )[ 1 ].toLowerCase();
|
||||||
wrap = wrapMap[ tag ] || wrapMap._default;
|
wrap = wrapMap[ tag ] || arr;
|
||||||
tmp.innerHTML = wrap[ 1 ] + jQuery.htmlPrefilter( elem ) + wrap[ 2 ];
|
|
||||||
|
|
||||||
// Descend through wrappers to the right content
|
// Create wrappers & descend into them.
|
||||||
j = wrap[ 0 ];
|
j = wrap.length;
|
||||||
while ( j-- ) {
|
while ( --j > -1 ) {
|
||||||
tmp = tmp.lastChild;
|
tmp = tmp.appendChild( context.createElement( wrap[ j ] ) );
|
||||||
}
|
}
|
||||||
|
|
||||||
|
tmp.innerHTML = jQuery.htmlPrefilter( elem );
|
||||||
|
|
||||||
jQuery.merge( nodes, tmp.childNodes );
|
jQuery.merge( nodes, tmp.childNodes );
|
||||||
|
|
||||||
// Remember the top-level container
|
// Remember the top-level container
|
||||||
|
@ -1,4 +1,3 @@
|
|||||||
// We have to close these tags to support XHTML (#13200)
|
|
||||||
var wrapMap = {
|
var wrapMap = {
|
||||||
|
|
||||||
// Table parts need to be wrapped with `<table>` or they're
|
// Table parts need to be wrapped with `<table>` or they're
|
||||||
@ -6,12 +5,10 @@ var wrapMap = {
|
|||||||
// XHTML parsers do not magically insert elements in the
|
// XHTML parsers do not magically insert elements in the
|
||||||
// same way that tag soup parsers do, so we cannot shorten
|
// same way that tag soup parsers do, so we cannot shorten
|
||||||
// this by omitting <tbody> or other required elements.
|
// this by omitting <tbody> or other required elements.
|
||||||
thead: [ 1, "<table>", "</table>" ],
|
thead: [ "table" ],
|
||||||
col: [ 2, "<table><colgroup>", "</colgroup></table>" ],
|
col: [ "colgroup", "table" ],
|
||||||
tr: [ 2, "<table><tbody>", "</tbody></table>" ],
|
tr: [ "tbody", "table" ],
|
||||||
td: [ 3, "<table><tbody><tr>", "</tr></tbody></table>" ],
|
td: [ "tr", "tbody", "table" ]
|
||||||
|
|
||||||
_default: [ 0, "", "" ]
|
|
||||||
};
|
};
|
||||||
|
|
||||||
wrapMap.tbody = wrapMap.tfoot = wrapMap.colgroup = wrapMap.caption = wrapMap.thead;
|
wrapMap.tbody = wrapMap.tfoot = wrapMap.colgroup = wrapMap.caption = wrapMap.thead;
|
||||||
|
@ -2969,3 +2969,14 @@ QUnit.test( "Sanitized HTML doesn't get unsanitized", function( assert ) {
|
|||||||
test( "<noembed><noembed/><img src=url404 onerror=xss(12)>" );
|
test( "<noembed><noembed/><img src=url404 onerror=xss(12)>" );
|
||||||
}
|
}
|
||||||
} );
|
} );
|
||||||
|
|
||||||
|
QUnit.test( "Works with invalid attempts to close the table wrapper", function( assert ) {
|
||||||
|
assert.expect( 3 );
|
||||||
|
|
||||||
|
// This test case attempts to close the tags which wrap input
|
||||||
|
// based on matching done in wrapMap which should be ignored.
|
||||||
|
var elem = jQuery( "<td></td></tr></tbody></table><td></td>" );
|
||||||
|
assert.strictEqual( elem.length, 2, "Two elements created" );
|
||||||
|
assert.strictEqual( elem[ 0 ].nodeName.toLowerCase(), "td", "First element is td" );
|
||||||
|
assert.strictEqual( elem[ 1 ].nodeName.toLowerCase(), "td", "Second element is td" );
|
||||||
|
} );
|
||||||
|
Loading…
Reference in New Issue
Block a user