Fixed search params encoded twice issue

y-kkamil · Mar 29, 2022 · cf91e9c · cf91e9c
1 parent 8557dcf
commit cf91e9c
Show file tree

Hide file tree

Showing 4 changed files with 30 additions and 15 deletions.
diff --git a/core/src/utilities/helpers/routing-helpers.js b/core/src/utilities/helpers/routing-helpers.js
@@ -511,11 +511,7 @@ class RoutingHelpersClass {
     if (!GenericHelpers.isObject(localSearchParams)) {
       return;
     }
-    Object.keys(localSearchParams).forEach(key => {
-      if (localSearchParams[key] !== undefined) {
-        localSearchParams[key] = encodeURIComponent(localSearchParams[key]);
-      }
-    });
+
     if (currentNode && currentNode.clientPermissions && currentNode.clientPermissions.urlParameters) {
       const filteredObj = {};
       Object.keys(currentNode.clientPermissions.urlParameters).forEach(key => {
@@ -622,7 +618,7 @@ class RoutingHelpersClass {
     this.modifySearchParams(params, searchParams, paramPrefix);
     localhash = hashValue;
     if (searchParams.toString() !== '') {
-      localhash += `?${decodeURIComponent(searchParams.toString())}`;
+      localhash += `?${searchParams.toString()}`;
     }
     return localhash;
   }

diff --git a/core/test/core-api/routing.spec.js b/core/test/core-api/routing.spec.js
@@ -112,6 +112,17 @@ describe('Luigi routing', function() {
         'http://some.url.de/#/?test=tets&foo=bar'
       );
     });
+    it('add search params to hash routing with special characters', () => {
+      window.state = {};
+      global.location = 'http://some.url.de/#/?test=tets';
+      LuigiRouting.addSearchParams({ foo: '%bar#foo@bar&foo' }, true);
+      sinon.assert.calledWithExactly(
+        window.history.pushState,
+        window.state,
+        '',
+        'http://some.url.de/#/?test=tets&foo=%25bar%23foo%40bar%26foo'
+      );
+    });
     it('add search params to hash routing', () => {
       window.state = {};
       global.location = 'http://some.url.de/#/?~luigi=rocks';
@@ -120,7 +131,7 @@ describe('Luigi routing', function() {
         window.history.pushState,
         window.state,
         '',
-        'http://some.url.de/#/?~luigi=rocks&foo=bar'
+        'http://some.url.de/#/?%7Eluigi=rocks&foo=bar'
       );
     });
     it('call addSearchParams with wrong argument hash routing', () => {

diff --git a/test/e2e-test-application/e2e/tests/0-fiddle/fiddle-navigation.spec.js b/test/e2e-test-application/e2e/tests/0-fiddle/fiddle-navigation.spec.js
@@ -994,7 +994,7 @@ describe('Fiddle', () => {
           .contains('add node params')
           .click();
       });
-      cy.expectPathToBe('/home/mynode?~q=test&~luigi=rocks');
+      cy.expectPathToBe('/home/mynode?%7Eq=test&%7Eluigi=rocks');
       cy.getIframeBody().then($body => {
         cy.wrap($body)
           .find('[data-testid="lui-delete-node-params"]')
@@ -1003,7 +1003,7 @@ describe('Fiddle', () => {
           .contains('delete node params')
           .click();
       });
-      cy.expectPathToBe('/home/mynode?~luigi=rocks');
+      cy.expectPathToBe('/home/mynode?%7Eluigi=rocks');
     });
   });
   describe('LuigiClient add and delete node and search paramstest', () => {

diff --git a/website/fiddle/public/examples/microfrontends/luigi-client-test.html b/website/fiddle/public/examples/microfrontends/luigi-client-test.html
@@ -6,17 +6,21 @@
 	<link href="../../styles/styles.css" rel="stylesheet">
 	<script src="/vendor/luigi-client/luigi-client.js"></script>
     <style>
-		.lui-hide-button{
+		.hide{
 			display:none;
 		}
 	</style>
 </head>
 <body>
-    <button data-testid="lui-add-search-params" class="lui-hide-button" onclick="addSearchParams()">add search params</button>
-	<button data-testid="lui-delete-search-params" class="lui-hide-button" onclick="deleteSearchParam()">delete search params</button>
-	<button data-testid="lui-add-node-params" class="lui-hide-button" onclick="addNodeParams()">add node params</button>
-	<button data-testid="lui-delete-node-params" class="lui-hide-button" onclick="deleteNodeParam()">delete node params</button>
-    <script>
+	<section>
+		<button data-testid="lui-add-search-params" onclick="addSearchParams()">add search params</button>
+		<button data-testid="lui-delete-search-params" onclick="deleteSearchParam()">delete search params</button>
+		<button data-testid="lui-get-search-params" onclick="getSearchParam()">get search params</button>
+		<button data-testid="lui-add-node-params" onclick="addNodeParams()">add node params</button>
+		<button data-testid="lui-delete-node-params" onclick="deleteNodeParam()">delete node params</button>
+		<div>current search params: <span id="currentSearchParams"></span></div>
+	</section>
+	<script>
         function addSearchParams(){
 			LuigiClient.addCoreSearchParams({q:'test', luigi:'rocks', tets:'tets'});
 		}
@@ -29,6 +33,10 @@
 		function deleteNodeParam(){
 			LuigiClient.addNodeParams({q:undefined, luigi:'rocks'});
 		}
+		function getSearchParam() {
+			const params = LuigiClient.getCoreSearchParams();
+			document.getElementById('currentSearchParams').innerHTML = JSON.stringify(params);
+		}
 	</script>
     </script>
 </body>