Patch - Field flow: Keep URL params matching HTML attributes (#2407)

When field flow's redirect (redir) action is used, submitting causes the plugin to "transform" the currently-selected dropdown option's URL parameters into hidden input elements. The inputs are created by passing "raw" HTML strings to the jQuery object. That setup used to play nicely with URL parameters whose keys corresponded to the names of HTML attributes (e.g. lang=anything). But it stopped working when wet-boew/wet-boew#9210 introduced DOMPurify into WET's jQuery 2.x implementation. Why? Because DOMPurify's sanitize() method filters-out name="[any HTML attribute name]" to prevent potential DOM clobbering attacks (see cure53/DOMPurify#980). End result is that jQuery ultimately returns name-less inputs to the plugin, which in turn causes affected parameters to go missing. This fixes it by using "pure" JavaScript (instead of jQuery) to create the inputs. Also adds a query string example to the redirection demo (with a mix of key naming schemes). Fixes #2406. Co-authored-by: Pierre Dubois <[email protected]>
wet-boew · Aug 28, 2024 · c716ad6 · c716ad6
1 parent 08498cb
commit c716ad6
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 10 deletions.
diff --git a/components/wb-fieldflow/fieldflow-en.html b/components/wb-fieldflow/fieldflow-en.html
@@ -6,7 +6,7 @@
 tag: fieldflow
 parentdir: fieldflow
 altLangPage: fieldflow-fr.html
-dateModified: 2024-04-08
+dateModified: 2024-08-27
 ---
 <ul class="list-inline">
 	<li><a class="btn btn-primary" href="fieldflow-doc-en.html">Documentation</a></li>
@@ -47,7 +47,7 @@ <h2 id="redirect">Redirection</h2>
 	<ul>
 		<li><a href="https://wet-boew.github.io/v4.0-ci/demos/data-ajax/data-ajax-en.html">Inserting content</a></li>
 		<li><a href="https://wet-boew.github.io/v4.0-ci/demos/lightbox/lightbox-en.html">Photo galery</a></li>
-		<li><a href="https://wet-boew.github.io/v4.0-ci/demos/charts/charts-en.html">Draw charts</a></li>
+		<li><a href="https://wet-boew.github.io/v4.0-ci/demos/charts/charts-en.html?id=myId&something=test&lang=xyz">Draw charts</a></li>
 		<li><!--test comment--><a href="https://wet-boew.github.io/v4.0-ci/demos/details/details-en.html">Expand and collapse content</a></li>
 		<li>
 			<a href="https://wet-boew.github.io/v4.0-ci/demos/equalheight/equalheight-en.html">Set a consistant height</a>
@@ -62,7 +62,7 @@ <h2 id="redirect">Redirection</h2>
 	&lt;ul&gt;
 		&lt;li&gt;&lt;a href=&quot;https://wet-boew.github.io/v4.0-ci/demos/data-ajax/data-ajax-en.html&quot;&gt;Inserting content&lt;/a&gt;&lt;/li&gt;
 		&lt;li&gt;&lt;a href=&quot;https://wet-boew.github.io/v4.0-ci/demos/lightbox/lightbox-en.html&quot;&gt;Photo galery&lt;/a&gt;&lt;/li&gt;
-		&lt;li&gt;&lt;a href=&quot;https://wet-boew.github.io/v4.0-ci/demos/charts/charts-en.html&quot;&gt;Draw charts&lt;/a&gt;&lt;/li&gt;
+		&lt;li&gt;&lt;a href=&quot;https://wet-boew.github.io/v4.0-ci/demos/charts/charts-en.html?id=myId&something=test&lang=xyz&quot;&gt;Draw charts&lt;/a&gt;&lt;/li&gt;
 		&lt;li&gt;&lt;!--test comment--&gt;&lt;a href=&quot;https://wet-boew.github.io/v4.0-ci/demos/details/details-en.html&quot;&gt;Expand and collapse content&lt;/a&gt;&lt;/li&gt;
 		&lt;li&gt;
 			&lt;a href=&quot;https://wet-boew.github.io/v4.0-ci/demos/equalheight/equalheight-en.html&quot;&gt;Set a consistant height&lt;/a&gt;

diff --git a/components/wb-fieldflow/fieldflow-fr.html b/components/wb-fieldflow/fieldflow-fr.html
@@ -6,7 +6,7 @@
 tag: "fieldflow"
 parentdir: "fieldflow"
 altLangPage: fieldflow-en.html
-dateModified: "2024-04-08"
+dateModified: "2024-08-27"
 ---
 <ul class="list-inline">
 	<li><a class="btn btn-primary" href="fieldflow-doc-fr.html">Documentation</a></li>
@@ -46,7 +46,7 @@ <h2 id="redirect">Redirection</h2>
 	<ul>
 		<li><a href="https://wet-boew.github.io/v4.0-ci/demos/data-ajax/data-ajax-fr.html">Insertion de contenu</a></li>
 		<li><a href="https://wet-boew.github.io/v4.0-ci/demos/lightbox/lightbox-fr.html">Galerie photos</a></li>
-		<li><a href="https://wet-boew.github.io/v4.0-ci/demos/charts/charts-fr.html">Dessiner des graphiques</a></li>
+		<li><a href="https://wet-boew.github.io/v4.0-ci/demos/charts/charts-fr.html?id=myId&something=test&lang=xyz">Dessiner des graphiques</a></li>
 		<li><!--test comment--><a href="https://wet-boew.github.io/v4.0-ci/demos/details/details-fr.html">Contenu affichable/masquable</a></li>
 		<li>
 			<a href="https://wet-boew.github.io/v4.0-ci/demos/equalheight/equalheight-fr.html">Uniformisation de la hauteur</a>
@@ -61,7 +61,7 @@ <h2 id="redirect">Redirection</h2>
 	&lt;ul&gt;
 		&lt;li&gt;&lt;a href=&quot;https://wet-boew.github.io/v4.0-ci/demos/data-ajax/data-ajax-fr.html&quot;&gt;Insertion de contenu&lt;/a&gt;&lt;/li&gt;
 		&lt;li&gt;&lt;a href=&quot;https://wet-boew.github.io/v4.0-ci/demos/lightbox/lightbox-fr.html&quot;&gt;Galerie photos&lt;/a&gt;&lt;/li&gt;
-		&lt;li&gt;&lt;a href=&quot;https://wet-boew.github.io/v4.0-ci/demos/charts/charts-fr.html&quot;&gt;Dessiner des graphiques&lt;/a&gt;&lt;/li&gt;
+		&lt;li&gt;&lt;a href=&quot;https://wet-boew.github.io/v4.0-ci/demos/charts/charts-fr.html?id=myId&something=test&lang=xyz&quot;&gt;Dessiner des graphiques&lt;/a&gt;&lt;/li&gt;
 		&lt;li&gt;&lt;!--test comment--&gt;&lt;a href=&quot;https://wet-boew.github.io/v4.0-ci/demos/details/details-fr.html&quot;&gt;Contenu affichable/masquable&lt;/a&gt;&lt;/li&gt;
 		&lt;li&gt;
 			&lt;a href=&quot;https://wet-boew.github.io/v4.0-ci/demos/equalheight/equalheight-fr.html&quot;&gt;Uniformisation de la hauteur&lt;/a&gt;

diff --git a/components/wb-fieldflow/fieldflow.js b/components/wb-fieldflow/fieldflow.js
@@ -1112,7 +1112,7 @@ $document.on( "submit", selectorForm + " form", function( event ) {
 		$elm = $( elm ),
 		wbFieldFlowRegistered = $elm.data( registerJQData ),
 		wbRegisteredHidden = $elm.data( registerHdnFld ) || [],
-		$hdnField,
+		hdnField,
 		i, i_len = wbFieldFlowRegistered ? wbFieldFlowRegistered.length : 0,
 		$wbFieldFlow, fieldOrigin,
 		lstFieldFlowPostEvent = [],
@@ -1207,9 +1207,14 @@ $document.on( "submit", selectorForm + " form", function( event ) {
 						cacheName = items[ 0 ];
 						cacheParam = items[ 1 ];
 					}
-					$hdnField = $( "<input type='hidden' name='" + cacheName + "' value='" + wb.escapeAttribute( cacheParam ) + "' />" );
-					$elm.append( $hdnField );
-					wbRegisteredHidden.push( $hdnField.get( 0 ) );
+
+					hdnField = document.createElement( "input" );
+					hdnField.type = "hidden";
+					hdnField.name = cacheName;
+					hdnField.value = wb.escapeAttribute( cacheParam );
+
+					$elm.append( hdnField );
+					wbRegisteredHidden.push( hdnField );
 				}
 				$elm.data( registerHdnFld, wbRegisteredHidden );
 			}