Traversing: $.fn.contents() support for object

Fixes gh-4045
Closes gh-4046
This commit is contained in:
Luis Emilio Velasco Sanchez 2018-05-14 13:36:30 -04:00 committed by Dave Methvin
parent 821bf34353
commit 0ba8e38d0c
5 changed files with 94 additions and 49 deletions

View File

@ -209,7 +209,7 @@ module.exports = function( grunt ) {
{ pattern: "dist/*.map", included: false, served: true }, { pattern: "dist/*.map", included: false, served: true },
{ pattern: "external/qunit/qunit.css", included: false, served: true }, { pattern: "external/qunit/qunit.css", included: false, served: true },
{ {
pattern: "test/**/*.@(js|css|jpg|html|xml)", pattern: "test/**/*.@(js|css|jpg|html|xml|svg)",
included: false, included: false,
served: true served: true
} }

View File

@ -145,18 +145,18 @@ jQuery.each( {
return siblings( elem.firstChild ); return siblings( elem.firstChild );
}, },
contents: function( elem ) { contents: function( elem ) {
if ( nodeName( elem, "iframe" ) ) { if ( typeof elem.contentDocument !== "undefined" ) {
return elem.contentDocument; return elem.contentDocument;
} }
// Support: IE 9 - 11 only, iOS 7 only, Android Browser <=4.3 only // Support: IE 9 - 11 only, iOS 7 only, Android Browser <=4.3 only
// Treat the template element as a regular one in browsers that // Treat the template element as a regular one in browsers that
// don't support it. // don't support it.
if ( nodeName( elem, "template" ) ) { if ( nodeName( elem, "template" ) ) {
elem = elem.content || elem; elem = elem.content || elem;
} }
return jQuery.merge( [], elem.childNodes ); return jQuery.merge( [], elem.childNodes );
} }
}, function( name, fn ) { }, function( name, fn ) {
jQuery.fn[ name ] = function( until, selector ) { jQuery.fn[ name ] = function( until, selector ) {

6
test/data/1x1.svg Normal file
View File

@ -0,0 +1,6 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg width="1px" height="1px"
xmlns="http://www.w3.org/2000/svg">
</svg>

After

Width:  |  Height:  |  Size: 225 B

9
test/data/frame.html Normal file
View File

@ -0,0 +1,9 @@
<html>
<head>
<title>frame</title>
</head>
<frameset cols="20%, 80%">
<frame id="test-frame" src="iframe.html">
<frame src="iframe.html">
</frameset>
</html>

View File

@ -744,56 +744,86 @@ QUnit.test( "contents()", function( assert ) {
} ); } );
QUnit.test( "contents() for <template />", function( assert ) { QUnit.test( "contents() for <template />", function( assert ) {
assert.expect( 4 ); assert.expect( 4 );
jQuery( "#qunit-fixture" ).append( jQuery( "#qunit-fixture" ).append(
"<template id='template'>" + "<template id='template'>" +
" <div id='template-div0'>" + " <div id='template-div0'>" +
" <span>Hello, Web Component!</span>" + " <span>Hello, Web Component!</span>" +
" </div>" + " </div>" +
" <div id='template-div1'></div>" + " <div id='template-div1'></div>" +
" <div id='template-div2'></div>" + " <div id='template-div2'></div>" +
"</template>" "</template>"
); );
var contents = jQuery( "#template" ).contents(); var contents = jQuery( "#template" ).contents();
assert.equal( contents.length, 6, "Check template element contents" ); assert.equal( contents.length, 6, "Check template element contents" );
assert.equal( contents.find( "span" ).text(), "Hello, Web Component!", "Find span in template and check its text" ); assert.equal( contents.find( "span" ).text(), "Hello, Web Component!", "Find span in template and check its text" );
jQuery( "<div id='templateTest' />" ).append( jQuery( "<div id='templateTest' />" ).append(
jQuery( jQuery.map( contents, function( node ) { jQuery( jQuery.map( contents, function( node ) {
return document.importNode( node, true ); return document.importNode( node, true );
} ) ) } ) )
).appendTo( "#qunit-fixture" ); ).appendTo( "#qunit-fixture" );
contents = jQuery( "#templateTest" ).contents(); contents = jQuery( "#templateTest" ).contents();
assert.equal( contents.length, 6, "Check cloned nodes of template element contents" ); assert.equal( contents.length, 6, "Check cloned nodes of template element contents" );
assert.equal( contents.filter( "div" ).length, 3, "Count cloned elements from template" ); assert.equal( contents.filter( "div" ).length, 3, "Count cloned elements from template" );
} ); } );
QUnit[ "content" in document.createElement( "template" ) ? "test" : "skip" ]( QUnit[ "content" in document.createElement( "template" ) ? "test" : "skip" ]( "contents() for <template /> remains inert", function( assert ) {
"contents() for <template /> remains inert", assert.expect( 2 );
function( assert ) {
assert.expect( 2 );
Globals.register( "testScript" ); Globals.register( "testScript" );
Globals.register( "testImgOnload" ); Globals.register( "testImgOnload" );
jQuery( "#qunit-fixture" ).append( jQuery( "#qunit-fixture" ).append(
"<template id='template'>" + "<template id='template'>" +
" <script>testScript = 1;</script>" + " <script>testScript = 1;</script>" +
" <img src='" + baseURL + "1x1.jpg' onload='testImgOnload = 1' >" + " <img src='" + baseURL + "1x1.jpg' onload='testImgOnload = 1' >" +
"</template>" "</template>"
); );
var content = jQuery( "#template" ).contents(); var content = jQuery( "#template" ).contents();
assert.strictEqual( window.testScript, true, "script in template isn't executed" ); assert.strictEqual( window.testScript, true, "script in template isn't executed" );
assert.strictEqual( window.testImgOnload, true, "onload of image in template isn't executed" ); assert.strictEqual( window.testImgOnload, true, "onload of image in template isn't executed" );
} } );
);
QUnit.test( "contents() for <object />", function( assert ) {
assert.expect( 2 );
var svgObject = jQuery( "<object id='svg-object' data='" + baseURL + "1x1.svg'></object>" );
var done = assert.async();
svgObject.on( "load", function() {
var contents = jQuery( "#svg-object" ).contents();
assert.equal( contents.length, 1, "Check object contents" );
assert.equal( contents.find( "svg" ).length, 1, "Find svg within object" );
done();
} );
jQuery( "#qunit-fixture" ).append( svgObject );
} );
QUnit.test( "contents() for <frame />", function( assert ) {
assert.expect( 2 );
var iframe = jQuery( "<iframe id='frame-contents' src='" + baseURL + "frame.html'></iframe>" );
var done = assert.async();
iframe.on( "load", function() {
var container = jQuery( "#frame-contents" ).contents();
var contents = container.find( "#test-frame" ).contents();
assert.equal( contents.length, 1, "Check frame contents" );
assert.equal( contents.find( "body" ).length, 1, "Find body within frame" );
done();
} );
jQuery( "#qunit-fixture" ).append( iframe );
} );
QUnit.test( "sort direction", function( assert ) { QUnit.test( "sort direction", function( assert ) {
assert.expect( 12 ); assert.expect( 12 );