Conditionally initialize Playlist Media Element

[kostasx]

The single element media player (​https://develop.svn.wordpress.org/trunk/src/wp-includes/js/mediaelement/wp-mediaelement.js) uses a special jQuery filter to remove already initialized media elements from the initialization process:

Source: ​https://develop.svn.wordpress.org/trunk/src/wp-includes/js/mediaelement/wp-mediaelement.js
Lines: 43~49

			// Only initialize new media elements.
			$( '.wp-audio-shortcode, .wp-video-shortcode' )
				.not( '.mejs-container' )
				.filter(function () {
					return ! $( this ).parent().hasClass( 'mejs-mediaelement' );
				})
				.mediaelementplayer( settings );

However, a similar approach is not implemented for the Playlist element and might be needed.

Source: ​https://develop.svn.wordpress.org/trunk/src/wp-includes/js/mediaelement/wp-playlist.js
Lines: 167~171

Original Code:

    $(document).ready(function () {
		$('.wp-playlist').each( function() {
			return new WPPlaylistView({ el: this });
		} );
    });

Should probably be (my suggestion):

   // Only initialize new media elements.
    $(document).ready(function () {
		$('.wp-playlist')
		.not(':has(.mejs-mediaelement)')    // <-- Filter out already initialized playlist media elements
		.each( function() {
			return new WPPlaylistView({ el: this });
		} );
    });

I have tested both media elements (single player and playlist player) on an Ajax-based WordPress theme, and I've noticed that an already initialized playlist media element stops playing when the wp-playlist.js file is reloaded on a new page load.
When the conditional (patch above) is placed in the code, the playlist element continues playing without problem on subsequent page loads.

Awaiting feedback.

[antpb]

Hello @kostasx thanks for your ticket. The Media team has been hard at work determining the best next steps for support of the Playlist functionality. I am going to mark this Future Release for the time being.

Once we determine the next steps for supporting this functionality, we will consider the recommendations made in this ticket.

Thank you for submitting! I'll circle back here soon when we have new info!