Merge pull request #181 from xwp/fix/lint-fixes

Fix lint issues to meet WordPressVIPMinimum standard

assets/src/media-selector/views/button.js

@@ -1,3 +1,8 @@
+/**
+ * External dependencies
+ */
+import DOMPurify from 'dompurify';
+
 /**
  * Internal dependencies
  */
@@ -44,16 +49,20 @@ const Button = wp.media.view.Button.extend( {
 				spinner.hide();
 				/* istanbul ignore next */
 				if ( error && error.responseJSON && error.responseJSON.message ) {
-					const message = error.responseJSON.message.replace(
-						/(<([^>]+)>)/gi,
-						''
-					);
+					const message = DOMPurify.sanitize( error.responseJSON.message, {
+						ALLOWED_TAGS: [], // strip all HTML tags.
+					} );
 					console.error( message ); // eslint-disable-line
 					alert( message ); // eslint-disable-line
 				} else {
-					const errors = getConfig( 'errors' );
-					console.error( errors.generic ); // eslint-disable-line
-					alert( errors.generic ); // eslint-disable-line
+					const genericError = DOMPurify.sanitize(
+						getConfig( 'errors' ).generic,
+						{
+							ALLOWED_TAGS: [], // strip all HTML tags.
+						}
+					);
+					console.error( genericError ); // eslint-disable-line
+					alert( genericError ); // eslint-disable-line
 				}
 			} );
 	},

assets/src/media-selector/views/image-view.js

@@ -53,7 +53,12 @@ const ImageView = wp.media.view.Attachment.extend( {
 
 		this.views.detach();
 
-		this.$el.html( this.template( options ) );
+		/**
+		 * Whitelist because this is using the WP core `tmpl-attachment` Backbone template.
+		 *
+		 * @see https://github.com/WordPress/WordPress/blob/5.4-branch/wp-includes/media-template.php#L536
+		 */
+		this.$el.html( this.template( options ) ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.html
 		const img = this.$el.find( '.centered img' );
 		if (
 			1 === img.length &&

assets/src/media-selector/views/images-browser.js

@@ -1,3 +1,8 @@
+/**
+ * External dependencies
+ */
+import DOMPurify from 'dompurify';
+
 /**
  * Internal dependencies
  */
@@ -133,7 +138,12 @@ const ImagesBrowser = wp.media.view.AttachmentsBrowser.extend( {
 		} );
 
 		this.attachmentsNoResults.$el.addClass( 'hidden no-media' );
-		this.attachmentsNoResults.$el.append( `<h2>${ noResults.noMedia }</h2>` );
+
+		const noMedia = document.createElement( 'h2' );
+		noMedia.textContent = noResults.noMedia;
+
+		// Whitelist because of how the element is built. See above.
+		this.attachmentsNoResults.$el.append( noMedia ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append
 
 		this.views.add( this.attachmentsNoResults );
 
@@ -178,7 +188,9 @@ const ImagesBrowser = wp.media.view.AttachmentsBrowser.extend( {
 			this.collection.respErrorMessage()
 		) {
 			const error = this.collection.respErrorMessage();
-			errorView.$el.html( error.message );
+
+			// Whitelist because the HTML is sanitized.
+			errorView.$el.html( DOMPurify.sanitize( error.message ) ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.html
 			if ( [ 401, 403 ].includes( error.data?.status ) ) {
 				errorView.$el.removeClass( 'notice-error' );
 				errorView.$el.addClass( 'notice-warning' );

package.json

@@ -64,6 +64,7 @@
     "cross-env": "7.0.0",
     "css-loader": "3.4.2",
     "cssnano": "4.1.10",
+    "dompurify": "^2.0.12",
     "dotenv": "8.2.0",
     "eslint": "6.8.0",
     "eslint-plugin-eslint-comments": "3.1.2",