Use .text( '\u00A0' ) instead of .html( ' ' )

On reading the HTML by .html() in the tests the content is still
' '.

Bug: T154300
Change-Id: I2f43909c5539a5882af354fc8f64b03e43697647

resources/mmv.ui.download.pane/mmv.ui.download.pane.js

@@ -93,12 +93,12 @@
 			.append(
 				$( '<span>' )
 					.addClass( 'mw-mmv-download-image-size-name' )
-					.html( '&nbsp;' )
+					.text( '\u00A0' )
 			)
 			.append(
 				$( '<span>' )
 					.addClass( 'mw-mmv-download-image-size' )
-					.html( '&nbsp;' )
+					.text( '\u00A0' )
 			);
 
 		$container

resources/mmv.ui.reuse.shareembed/mmv.ui.reuse.share.js

@@ -54,7 +54,7 @@
 			.addClass( 'mw-mmv-share-page-link' )
 			.prop( 'alt', mw.message( 'multimediaviewer-link-to-page' ).text() )
 			.prop( 'target', '_blank' )
-			.html( ' ' )
+			.text( '\u00A0' )
 			.appendTo( this.$pane );
 
 		this.pageInput.$element.appendTo( this.$pane );

resources/mmv/ui/mmv.ui.canvasButtons.js

@@ -41,7 +41,7 @@
 		this.$reuse = $( '<a>' )
 			.attr( 'role', 'button' )
 			.addClass( 'mw-mmv-reuse-button' )
-			.html( '&nbsp;' )
+			.text( '\u00A0' )
 			.prop( 'title', mw.message( 'multimediaviewer-reuse-link' ).text() )
 			.tipsy( {
 				delayIn: tooltipDelay,
@@ -60,7 +60,7 @@
 		this.$download = $( '<a>' )
 			.attr( 'role', 'button' )
 			.addClass( 'mw-mmv-download-button' )
-			.html( '&nbsp;' )
+			.text( '\u00A0' )
 			.prop( 'title', mw.message( 'multimediaviewer-download-link' ).text() )
 			.tipsy( {
 				delayIn: tooltipDelay,
@@ -70,12 +70,12 @@
 		this.$next = $( '<button>' )
 			.prop( 'title', mw.message( 'multimediaviewer-next-image-alt-text' ).text() )
 			.addClass( 'mw-mmv-next-image disabled' )
-			.html( '&nbsp;' );
+			.text( '\u00A0' );
 
 		this.$prev = $( '<button>' )
 			.prop( 'title', mw.message( 'multimediaviewer-prev-image-alt-text' ).text() )
 			.addClass( 'mw-mmv-prev-image disabled' )
-			.html( '&nbsp;' );
+			.text( '\u00A0' );
 
 		this.$nav = this.$next
 			.add( this.$prev );

resources/mmv/ui/mmv.ui.viewingOptions.js

@@ -203,7 +203,7 @@
 				.appendTo( this.$dialog );
 
 		$( '<div>' )
-			.html( '&nbsp;' )
+			.text( '\u00A0' )
 			.addClass( 'mw-mmv-confirmation-close' )
 			.on( 'click', function () {
 				dialog.closeDialog();
@@ -362,7 +362,7 @@
 			$subContainer = $( '<div>' ).addClass( 'mw-mmv-options-subcontainer' );
 
 			$( '<div>' )
-				.html( '&nbsp;' )
+				.text( '\u00A0' )
 				.addClass( 'mw-mmv-options-icon' )
 				.appendTo( $subContainer );