Embeds: Modernize wp-embed script with removal of obsolete IE10/IE11 code and support for WP<4.4.

* Remove obsolete `load` event handler in `wp-embed` since IE10+ support `DOMContentLoaded`.
* Replace obsolete use of `document.createElement('a')` in favor of the newer `URL` class (supported in all browsers but obsolete IE11).
* Remove obsolete IE10/IE11 code.
* Combine conditionals.
* Use `substring()` instead of deprecated `substr()` method.
* Eliminate the stipulation that `wp-embed.js` not include ampersands, considering this was put in place for WP<4.3 which now accounts for only 1.43% of sites. This includes the elimination of the `verify:wp-embed` grunt task.

Props westonruter, swissspidy.
Fixes #58974.


git-svn-id: https://develop.svn.wordpress.org/trunk@56383 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Weston Ruter 2023-08-10 19:47:08 +00:00
parent bb6de6b8c0
commit 415c9f6bb4
3 changed files with 30 additions and 116 deletions

View File

@ -764,21 +764,8 @@ module.exports = function(grunt) {
'!wp-admin/js/custom-header.js', // Why? We should minify this.
'!wp-admin/js/farbtastic.js',
'!wp-includes/js/swfobject.js',
'!wp-includes/js/wp-embed.js' // We have extra options for this, see uglify:embed.
]
},
embed: {
options: {
compress: {
conditionals: false
}
},
expand: true,
cwd: WORKING_DIR,
dest: WORKING_DIR,
ext: '.min.js',
src: ['wp-includes/js/wp-embed.js']
},
'jquery-ui': {
options: {
// Preserve comments that start with a bang.
@ -1461,7 +1448,6 @@ module.exports = function(grunt) {
grunt.registerTask( 'uglify:all', [
'uglify:core',
'uglify:embed',
'uglify:jquery-ui',
'uglify:imgareaselect',
'uglify:jqueryform',
@ -1507,38 +1493,10 @@ module.exports = function(grunt) {
* Build verification tasks.
*/
grunt.registerTask( 'verify:build', [
'verify:wp-embed',
'verify:old-files',
'verify:source-maps',
] );
/**
* Build assertions for wp-embed.min.js.
*
* @ticket 34698
*/
grunt.registerTask( 'verify:wp-embed', function() {
const file = `${ BUILD_DIR }/wp-includes/js/wp-embed.min.js`;
assert(
fs.existsSync( file ),
'The build/wp-includes/js/wp-embed.min.js file does not exist.'
);
const contents = fs.readFileSync( file, {
encoding: 'utf8',
} );
assert(
contents.length > 0,
'The build/wp-includes/js/wp-embed.min.js file must not be empty.'
);
assert(
false === contents.includes( '&' ),
'The build/wp-includes/js/wp-embed.min.js file must not contain ampersands.'
);
} );
/**
* Build assertions to ensure no project files are inside `$_old_files` in the build directory.
*

View File

@ -4,25 +4,23 @@
* @since 4.4.0
* @output wp-includes/js/wp-embed.js
*
* This file cannot have ampersands in it. This is to ensure
* it can be embedded in older versions of WordPress.
* See https://core.trac.wordpress.org/changeset/35708.
* Single line comments should not be used since they will break
* the script when inlined in get_post_embed_html(), specifically
* when the comments are not stripped out due to SCRIPT_DEBUG
* being turned on.
*/
(function ( window, document ) {
'use strict';
var supportedBrowser = false,
loaded = false;
if ( document.querySelector ) {
if ( window.addEventListener ) {
supportedBrowser = true;
}
}
/* Abort for ancient browsers. */
if ( ! document.querySelector || ! window.addEventListener || typeof URL === 'undefined' ) {
return;
}
/** @namespace wp */
window.wp = window.wp || {};
/* Abort if script was already executed. */
if ( !! window.wp.receiveEmbedMessage ) {
return;
}
@ -35,15 +33,11 @@
window.wp.receiveEmbedMessage = function( e ) {
var data = e.data;
if ( ! data ) {
return;
}
if ( ! ( data.secret || data.message || data.value ) ) {
return;
}
if ( /[^a-zA-Z0-9]/.test( data.secret ) ) {
/* Verify shape of message. */
if (
! ( data || data.secret || data.message || data.value ) ||
/[^a-zA-Z0-9]/.test( data.secret )
) {
return;
}
@ -65,8 +59,8 @@
source.removeAttribute( 'style' );
/* Resize the iframe on request. */
if ( 'height' === data.message ) {
/* Resize the iframe on request. */
height = parseInt( data.value, 10 );
if ( height > 1000 ) {
height = 1000;
@ -75,42 +69,25 @@
}
source.height = height;
}
} else if ( 'link' === data.message ) {
/* Link to a specific URL on request. */
sourceURL = new URL( source.getAttribute( 'src' ) );
targetURL = new URL( data.value );
/* Link to a specific URL on request. */
if ( 'link' === data.message ) {
sourceURL = document.createElement( 'a' );
targetURL = document.createElement( 'a' );
sourceURL.href = source.getAttribute( 'src' );
targetURL.href = data.value;
/* Only follow link if the protocol is in the allow list. */
if ( ! allowedProtocols.test( targetURL.protocol ) ) {
continue;
}
/* Only continue if link hostname matches iframe's hostname. */
if ( targetURL.host === sourceURL.host ) {
if ( document.activeElement === source ) {
window.top.location.href = data.value;
}
if (
allowedProtocols.test( targetURL.protocol ) &&
targetURL.host === sourceURL.host &&
document.activeElement === source
) {
window.top.location.href = data.value;
}
}
}
};
function onLoad() {
if ( loaded ) {
return;
}
loaded = true;
var isIE10 = -1 !== navigator.appVersion.indexOf( 'MSIE 10' ),
isIE11 = !!navigator.userAgent.match( /Trident.*rv:11\./ ),
iframes = document.querySelectorAll( 'iframe.wp-embedded-content' ),
iframeClone, i, source, secret;
var iframes = document.querySelectorAll( 'iframe.wp-embedded-content' ),
i, source, secret;
for ( i = 0; i < iframes.length; i++ ) {
/** @var {IframeElement} */
@ -119,18 +96,11 @@
secret = source.getAttribute( 'data-secret' );
if ( ! secret ) {
/* Add secret to iframe */
secret = Math.random().toString( 36 ).substr( 2, 10 );
secret = Math.random().toString( 36 ).substring( 2, 12 );
source.src += '#?secret=' + secret;
source.setAttribute( 'data-secret', secret );
}
/* Remove security attribute from iframes in IE10 and IE11. */
if ( ( isIE10 || isIE11 ) ) {
iframeClone = source.cloneNode( true );
iframeClone.removeAttribute( 'security' );
source.parentNode.replaceChild( iframeClone, source );
}
/*
* Let post embed window know that the parent is ready for receiving the height message, in case the iframe
* loaded before wp-embed.js was loaded. When the ready message is received by the post embed window, the
@ -143,9 +113,6 @@
}
}
if ( supportedBrowser ) {
window.addEventListener( 'message', window.wp.receiveEmbedMessage, false );
document.addEventListener( 'DOMContentLoaded', onLoad, false );
window.addEventListener( 'load', onLoad, false );
}
window.addEventListener( 'message', window.wp.receiveEmbedMessage, false );
document.addEventListener( 'DOMContentLoaded', onLoad, false );
})( window, document );

View File

@ -343,15 +343,4 @@ class Tests_Embed_Template extends WP_UnitTestCase {
wp_maybe_enqueue_oembed_host_js( $post_embed );
$this->assertFalse( $scripts->query( 'wp-embed', 'enqueued' ) );
}
/**
* Confirms that no ampersands exist in src/wp-includes/js/wp-embed.js.
*
* See also the `verify:wp-embed` Grunt task for verifying the built file.
*
* @ticket 34698
*/
public function test_js_no_ampersands() {
$this->assertStringNotContainsString( '&', file_get_contents( ABSPATH . WPINC . '/js/wp-embed.js' ) );
}
}