Usage of URLSearchParams breaks in IE11 (https://github.com/woocommerce/woocommerce-admin/pull/4501)

* Removed URLSearchParams method

This commit removes the method URLSearchParams to use something compatible with IE

* Revert "Removed URLSearchParams method"

This reverts commit c2b24b34c93d16264c62b3bf522f4fbc94354d58.

* Removed URLSearchParams method

This commit removes the method URLSearchParams to use something compatible with IE

* Created folder utils with global utils

This commit moves the method "getUrlParams" to a utils file. Also some unit test were added

Co-authored-by: Fernando Marichal <contacto@fernandomarichal.com>

plugins/woocommerce-admin/client/header/activity-panel/panels/inbox/card.js

@@ -17,6 +17,7 @@ import classnames from 'classnames';
 import { recordEvent } from 'lib/tracks';
 import './style.scss';
 import { H, Section } from '@woocommerce/components';
+import { getUrlParams } from 'utils';
 
 class InboxNoteCard extends Component {
 	constructor( props ) {
@@ -67,21 +68,16 @@ class InboxNoteCard extends Component {
 
 	getScreenName() {
 		let screenName = '';
-		const urlParams = new URLSearchParams( window.location.search );
-
-		if ( urlParams.has( 'page' ) ) {
-			const currentPage =
-				urlParams.get( 'page' ) === 'wc-admin'
-					? 'home_screen'
-					: urlParams.get( 'page' );
-			screenName = urlParams.has( 'path' )
-				? urlParams
-						.get( 'path' )
-						.replace( /\//g, '_' )
-						.substring( 1 )
+		const { page, path, post_type: postType } = getUrlParams(
+			window.location.search
+		);
+		if ( page ) {
+			const currentPage = page === 'wc-admin' ? 'home_screen' : page;
+			screenName = path
+				? path.replace( /\//g, '_' ).substring( 1 )
 				: currentPage;
-		} else if ( urlParams.has( 'post_type' ) ) {
-			screenName = urlParams.get( 'post_type' );
+		} else if ( postType ) {
+			screenName = postType;
 		}
 		return screenName;
 	}

plugins/woocommerce-admin/client/layout/controller.js

@@ -21,6 +21,7 @@ import { Spinner } from '@woocommerce/components';
  * Internal dependencies
  */
 import { getSetting } from '@woocommerce/wc-admin-settings';
+import { getUrlParams } from 'utils';
 
 const AnalyticsReport = lazy( () =>
 	import( /* webpackChunkName: "analytics-report" */ 'analytics/report' )
@@ -55,8 +56,7 @@ export const getPages = ( homepageEnabled ) => {
 			container: DevDocs,
 			path: '/devdocs',
 			breadcrumbs: ( { location } ) => {
-				const searchParams = new URLSearchParams( location.search );
-				const component = searchParams.get( 'component' );
+				const { component } = getUrlParams( location.search );
 
 				if ( component ) {
 					return [

plugins/woocommerce-admin/client/utils/README.md

@@ -0,0 +1,4 @@
+Utils
+=========
+
+This folder contains general utils.

plugins/woocommerce-admin/client/utils/index.js

@@ -0,0 +1,15 @@
+export function getUrlParams( locationSearch ) {
+	if ( locationSearch ) {
+		return locationSearch
+			.substr( 1 )
+			.split( '&' )
+			.reduce( ( params, query ) => {
+				const chunks = query.split( '=' );
+				const key = chunks[ 0 ];
+				let value = decodeURIComponent( chunks[ 1 ] );
+				value = isNaN( Number( value ) ) ? value : Number( value );
+				return ( params[ key ] = value ), params;
+			}, {} );
+	}
+	return {};
+}

plugins/woocommerce-admin/client/utils/test/index.js

@@ -0,0 +1,31 @@
+/**
+ * Internal dependencies
+ */
+import { getUrlParams } from '../index';
+
+describe( 'getUrlParams', () => {
+	let locationSearch = '?param1=text1&param2=text2';
+
+	test( 'should return an object with sent params', () => {
+		const { param1, param2 } = getUrlParams( locationSearch );
+		expect( param1 ).toEqual( 'text1' );
+		expect( param2 ).toEqual( 'text2' );
+	} );
+
+	test( 'should return an object with 2 keys/params', () => {
+		const params = getUrlParams( locationSearch );
+		expect( Object.keys( params ).length ).toEqual( 2 );
+	} );
+
+	test( 'should return an empty object', () => {
+		locationSearch = '';
+		const params = getUrlParams( locationSearch );
+		expect( Object.keys( params ).length ).toEqual( 0 );
+	} );
+
+	test( 'should return an object with key "no_value" equal to "undefined"', () => {
+		locationSearch = 'no_value';
+		const { no_value: noValue } = getUrlParams( locationSearch );
+		expect( noValue ).toBeUndefined();
+	} );
+} );