Changeset 41933

Timestamp:

10/19/2017 12:06:25 AM (9 years ago)

Author:

westonruter

Message:

Widgets: Harden logic for checking for valid media URLs.

• Update deprecated isHostedVideo method to always return true since all oEmbeds are now supported.
• Disable scanImage for non-image media widgets.
• Ensure embed URL field element is matched from current media frame instance due to bug where media frames are not destroyed upon closing.
• Update error message for invalid video URLs to ask user to check the URL for validity.

Props gk.loveweb, octalmage, westonruter.
See #42039, #40935.
Fixes #41052.

Location:

trunk/src

Files:

• wp-admin/js/widgets/media-video-widget.js (modified) (1 diff)
• wp-admin/js/widgets/media-widgets.js (modified) (7 diffs)
• wp-includes/widgets/class-wp-widget-media-video.php (modified) (1 diff)

trunk/src/wp-admin/js/widgets/media-video-widget.js

@@ -139 +139 @@
                  * @deprecated since 4.9.
                  *
-                 * @param {String} url - Video url.
                  * @returns {boolean} Whether url is a supported video host.
                  */
                 isHostedVideo: function isHostedVideo() {
-                        return false;
+                        return true;
                 },
 

trunk/src/wp-admin/js/widgets/media-widgets.js

@@ -84 +84 @@
          */
         component.MediaEmbedView = wp.media.view.Embed.extend({
+
+                /**
+                 * Initialize.
+                 *
+                 * @since 4.9.0
+                 *
+                 * @param {object} options - Options.
+                 * @returns {void}
+                 */
+                initialize: function( options ) {
+                        var view = this, embedController; // eslint-disable-line consistent-thi
+                        wp.media.view.Embed.prototype.initialize.call( view, options );
+                        if ( 'image' !== view.controller.options.mimeType ) {
+                                embedController = view.controller.states.get( 'embed' );
+                                embedController.off( 'scan', embedController.scanImage, embedController );
+                        }
+                },
 
                 /**
@@ -141 +158 @@
 
                                         /**
+                                         * Update oEmbed.
+                                         *
+                                         * @since 4.9.0
+                                         *
+                                         * @returns {void}
+                                         */
+                                        updateoEmbed: function() {
+                                                var embedLinkView = this, url; // eslint-disable-line consistent-this
+
+                                                url = embedLinkView.model.get( 'url' );
+
+                                                // Abort if the URL field was emptied out.
+                                                if ( ! url ) {
+                                                        embedLinkView.setErrorNotice( '' );
+                                                        embedLinkView.setAddToWidgetButtonDisabled( true );
+                                                        return;
+                                                }
+
+                                                if ( ! url.match( /^(http|https):\/\/.+\// ) ) {
+                                                        embedLinkView.controller.$el.find( '#embed-url-field' ).addClass( 'invalid' );
+                                                        embedLinkView.setAddToWidgetButtonDisabled( true );
+                                                }
+
+                                                wp.media.view.EmbedLink.prototype.updateoEmbed.call( embedLinkView );
+                                        },
+
+                                        /**
                                          * Fetch media.
                                          *
@@ -147 +191 @@
                                         fetch: function() {
                                                 var embedLinkView = this, fetchSuccess, matches, fileExt, urlParser, url, re, youTubeEmbedMatch; // eslint-disable-line consistent-this
+                                                url = embedLinkView.model.get( 'url' );
 
                                                 if ( embedLinkView.dfd && 'pending' === embedLinkView.dfd.state() ) {
                                                         embedLinkView.dfd.abort();
-                                                }
-
-                                                // Abort if the URL field was emptied out.
-                                                if ( ! embedLinkView.model.get( 'url' ) ) {
-                                                        embedLinkView.setErrorNotice( '' );
-                                                        return;
                                                 }
 
@@ -165 +204 @@
                                                         });
 
-                                                        $( '#embed-url-field' ).removeClass( 'invalid' );
+                                                        embedLinkView.controller.$el.find( '#embed-url-field' ).removeClass( 'invalid' );
                                                         embedLinkView.setErrorNotice( '' );
                                                         embedLinkView.setAddToWidgetButtonDisabled( false );
@@ -171 +210 @@
 
                                                 urlParser = document.createElement( 'a' );
-                                                urlParser.href = embedLinkView.model.get( 'url' );
+                                                urlParser.href = url;
                                                 matches = urlParser.pathname.toLowerCase().match( /\.(\w+)$/ );
                                                 if ( matches ) {
@@ -186 +225 @@
 
                                                 // Support YouTube embed links.
-                                                url = embedLinkView.model.get( 'url' );
                                                 re = /https?:\/\/www\.youtube\.com\/embed\/([^/]+)/;
                                                 youTubeEmbedMatch = re.exec( url );
@@ -229 +267 @@
                                         renderFail: function renderFail() {
                                                 var embedLinkView = this; // eslint-disable-line consistent-this
-                                                $( '#embed-url-field' ).addClass( 'invalid' );
+                                                embedLinkView.controller.$el.find( '#embed-url-field' ).addClass( 'invalid' );
                                                 embedLinkView.setErrorNotice( embedLinkView.controller.options.invalidEmbedTypeError || 'ERROR' );
                                                 embedLinkView.setAddToWidgetButtonDisabled( true );

trunk/src/wp-includes/widgets/class-wp-widget-media-video.php

@@ -42 +42 @@
                         'media_library_state_single' => __( 'Video Widget' ),
                         /* translators: %s: a list of valid video file extensions */
-                        'unsupported_file_type' => sprintf( __( 'Sorry, we can&#8217;t display the video file type selected. Please select a supported video file (%s) or stream (e.g. YouTube and Vimeo) instead.' ), '<code>.' . implode( '</code>, <code>.', wp_get_video_extensions() ) . '</code>' ),
+                        'unsupported_file_type' => sprintf( __( 'Sorry, we can&#8217;t load the video at the supplied URL. Please check that the URL is for a supported video file (%s) or stream (e.g. YouTube and Vimeo).' ), '<code>.' . implode( '</code>, <code>.', wp_get_video_extensions() ) . '</code>' ),
                 ) );
         }