Use browser provided URL object instead of mw.Uri

Bug: T374314
Change-Id: I7de5ac9ba2de70e5a3a84fca1608c64ea1cd1aaf

extension.json

@@ -93,7 +93,6 @@
 			"dependencies": [
 				"mediawiki.api",
 				"mediawiki.Title",
-				"mediawiki.Uri",
 				"mediawiki.jqueryMsg",
 				"mediawiki.router",
 				"mediawiki.storage",

resources/mmv/logging/mmv.logging.ViewLogger.js

@@ -93,28 +93,26 @@ class ViewLogger {
 	 * Records the amount of time the current image has been viewed
 	 */
 	recordViewDuration() {
-		let uri;
+		let url;
 
 		this.stopViewDuration();
 
 		if ( recordVirtualViewBeaconURI ) {
 			try {
-				uri = new mw.Uri( recordVirtualViewBeaconURI );
-				uri.extend( {
-					duration: this.viewDuration,
-					uri: this.url
-				} );
+				url = new URL( recordVirtualViewBeaconURI, location );
+				url.searchParams.set( 'duration', this.viewDuration );
+				url.searchParams.set( 'uri', this.url );
 			} catch ( e ) {
 				// the URI is malformed. We cannot log it.
 				return;
 			}
 
 			try {
-				navigator.sendBeacon( uri.toString() );
+				navigator.sendBeacon( url.toString() );
 			} catch ( e ) {
 				$.ajax( {
 					type: 'HEAD',
-					url: uri.toString()
+					url: url.toString()
 				} );
 			}
 
@@ -132,7 +130,7 @@ class ViewLogger {
 	 * @param {string} url URL of the image to record a virtual view for
 	 */
 	attach( url ) {
-		this.url = encodeURIComponent( url );
+		this.url = url;
 		this.startViewDuration();
 
 		$( this.window )

resources/mmv/provider/mmv.provider.Image.js

@@ -47,13 +47,12 @@ class ImageProvider {
 	 */
 	get( url ) {
 		const cacheKey = url;
-		const extraParam = {};
 
 		if ( this.imageQueryParameter ) {
 			try {
-				const uri = new mw.Uri( url );
-				extraParam[ this.imageQueryParameter ] = null;
-				url = uri.extend( extraParam ).toString();
+				const uri = new URL( url, location );
+				uri.searchParams.set( this.imageQueryParameter, '' );
+				url = uri.toString();
 			} catch ( error ) {
 				return $.Deferred().reject( error.message );
 			}

resources/mmv/ui/mmv.ui.stripeButtons.js

@@ -51,10 +51,6 @@ class StripeButtons extends UiElement {
 		const match = image && image.src ?
 			image.src.match( /(lang|page)([\d\-a-z]+)-(\d+)px/ ) : // multi lingual SVG or PDF page
 			null;
-		const params = {};
-		if ( match ) {
-			params[ match[ 1 ] ] = match[ 2 ];
-		}
 
 		const commons = '//commons.wikimedia.org';
 		const isCommonsServer = String( mw.config.get( 'wgServer' ) ).includes( commons );
@@ -62,12 +58,18 @@ class StripeButtons extends UiElement {
 		let isCommons = String( descriptionUrl ).includes( commons );
 
 		if ( imageInfo.pageID && !isCommonsServer ) {
+			const params = {};
+			if ( match ) {
+				params[ match[ 1 ] ] = match[ 2 ];
+			}
 			// The file has a local description page, override the description URL
 			descriptionUrl = imageInfo.title.getUrl( params );
 			isCommons = false;
 		} else {
-			const parsedUrl = new mw.Uri( descriptionUrl );
-			parsedUrl.extend( params );
+			const parsedUrl = new URL( descriptionUrl, location );
+			if ( match ) {
+				parsedUrl.searchParams.set( match[ 1 ], match[ 2 ] );
+			}
 			descriptionUrl = parsedUrl.toString();
 		}
 

tests/qunit/mmv/provider/mmv.provider.Image.test.js

@@ -134,7 +134,7 @@ const { ImageProvider } = require( 'mmv' );
 
 		imageProvider.imagePreloadingSupported = () => false;
 		imageProvider.rawGet = function ( url ) {
-			assert.strictEqual( url, 'http://www.wikipedia.org/?foo', 'Extra parameter added' );
+			assert.strictEqual( url, 'http://www.wikipedia.org/?foo=', 'Extra parameter added' );
 
 			return $.Deferred().resolve();
 		};