[TASK] Replace missing jquery import in SelectTreeElement

SelectTreeElement makes use of $.param() without importing
jquery via requireJS. Instead of adding the missing jquery
import, we simply migrate to the native URLSearchParams,
as it is available in all supported browsers.

Furthermore we avoid decoding the datastructureidentifier
json, as it is encoded to json server side. We do this,
because URLSearchParams does not url encode nested objects.

Resolves: #93200
Releases: master
Change-Id: I0da98092da6e09d6576bbdb59112d738086be238
Reviewed-on: https://review.typo3.org/c/Packages/TYPO3.CMS/+/67323


Tested-by: TYPO3com <noreply@typo3.com>
Tested-by: Christian Kuhn <lolli@schwarzbu.ch>
Tested-by: Oliver Bartsch <bo@cedev.de>
Tested-by: Benjamin Franzke <bfr@qbus.de>
Reviewed-by: Christian Kuhn <lolli@schwarzbu.ch>
Reviewed-by: Oliver Bartsch <bo@cedev.de>
Reviewed-by: Benjamin Franzke <bfr@qbus.de>

Build/Sources/TypeScript/backend/Resources/Public/TypeScript/FormEngine/Element/SelectTreeElement.ts

@@ -61,9 +61,7 @@ class SelectTreeElement {
       fieldName: this.recordField.dataset.fieldname,
       uid: this.recordField.dataset.uid,
       recordTypeValue: this.recordField.dataset.recordtypevalue,
-      dataStructureIdentifier: this.recordField.dataset.datastructureidentifier !== ''
-        ? JSON.parse(this.recordField.dataset.datastructureidentifier)
-        : '',
+      dataStructureIdentifier: this.recordField.dataset.datastructureidentifier,
       flexFormSheetName: this.recordField.dataset.flexformsheetname,
       flexFormFieldName: this.recordField.dataset.flexformfieldname,
       flexFormContainerName: this.recordField.dataset.flexformcontainername,
@@ -72,7 +70,7 @@ class SelectTreeElement {
       flexFormSectionContainerIsNew: this.recordField.dataset.flexformsectioncontainerisnew,
       command: this.recordField.dataset.command,
     };
-    return TYPO3.settings.ajaxUrls.record_tree_data + '&' + $.param(params);
+    return TYPO3.settings.ajaxUrls.record_tree_data + '&' + new URLSearchParams(params);
   }
 }
 

typo3/sysext/backend/Classes/Controller/FormSelectTreeAjaxController.php

@@ -72,7 +72,7 @@ class FormSelectTreeAjaxController
         $flexSectionContainerPreparation = [];
         if ($processedTca['columns'][$fieldName]['config']['type'] === 'flex') {
             if (!empty($request->getQueryParams()['dataStructureIdentifier'])) {
-                $dataStructureIdentifier = json_encode($request->getQueryParams()['dataStructureIdentifier']);
+                $dataStructureIdentifier = $request->getQueryParams()['dataStructureIdentifier'];
             }
             $flexFormSheetName = $request->getQueryParams()['flexFormSheetName'];
             $flexFormFieldName = $request->getQueryParams()['flexFormFieldName'];

typo3/sysext/backend/Resources/Public/JavaScript/FormEngine/Element/SelectTreeElement.js

@@ -10,4 +10,4 @@
  *
  * The TYPO3 project - inspiring people to share!
  */
-define(["require","exports","TYPO3/CMS/Backend/FormEngine/Element/SelectTree"],(function(e,t,r){"use strict";return class{constructor(e,t,r){this.treeWrapper=null,this.recordField=null,this.callback=null,this.treeWrapper=document.getElementById(e),this.recordField=document.getElementById(t),this.callback=r,this.initialize()}initialize(){const t=this.generateRequestUrl(),i=new r,a={dataUrl:t,showIcons:!0,showCheckboxes:!0,readOnlyMode:1===parseInt(this.recordField.dataset.readOnly,10),input:this.recordField,exclusiveNodesIdentifiers:this.recordField.dataset.treeExclusiveKeys,validation:JSON.parse(this.recordField.dataset.formengineValidationRules)[0],expandUpToLevel:this.recordField.dataset.treeExpandUpToLevel};i.initialize(this.treeWrapper,a)&&(i.dispatch.on("nodeSelectedAfter.requestUpdate",this.callback),this.recordField.dataset.treeShowToolbar&&e(["TYPO3/CMS/Backend/FormEngine/Element/TreeToolbar"],e=>{(new e).initialize(this.treeWrapper)}))}generateRequestUrl(){const e={tableName:this.recordField.dataset.tablename,fieldName:this.recordField.dataset.fieldname,uid:this.recordField.dataset.uid,recordTypeValue:this.recordField.dataset.recordtypevalue,dataStructureIdentifier:""!==this.recordField.dataset.datastructureidentifier?JSON.parse(this.recordField.dataset.datastructureidentifier):"",flexFormSheetName:this.recordField.dataset.flexformsheetname,flexFormFieldName:this.recordField.dataset.flexformfieldname,flexFormContainerName:this.recordField.dataset.flexformcontainername,flexFormContainerIdentifier:this.recordField.dataset.flexformcontaineridentifier,flexFormContainerFieldName:this.recordField.dataset.flexformcontainerfieldname,flexFormSectionContainerIsNew:this.recordField.dataset.flexformsectioncontainerisnew,command:this.recordField.dataset.command};return TYPO3.settings.ajaxUrls.record_tree_data+"&"+$.param(e)}}}));
\ No newline at end of file
+define(["require","exports","TYPO3/CMS/Backend/FormEngine/Element/SelectTree"],(function(e,t,r){"use strict";return class{constructor(e,t,r){this.treeWrapper=null,this.recordField=null,this.callback=null,this.treeWrapper=document.getElementById(e),this.recordField=document.getElementById(t),this.callback=r,this.initialize()}initialize(){const t=this.generateRequestUrl(),i=new r,a={dataUrl:t,showIcons:!0,showCheckboxes:!0,readOnlyMode:1===parseInt(this.recordField.dataset.readOnly,10),input:this.recordField,exclusiveNodesIdentifiers:this.recordField.dataset.treeExclusiveKeys,validation:JSON.parse(this.recordField.dataset.formengineValidationRules)[0],expandUpToLevel:this.recordField.dataset.treeExpandUpToLevel};i.initialize(this.treeWrapper,a)&&(i.dispatch.on("nodeSelectedAfter.requestUpdate",this.callback),this.recordField.dataset.treeShowToolbar&&e(["TYPO3/CMS/Backend/FormEngine/Element/TreeToolbar"],e=>{(new e).initialize(this.treeWrapper)}))}generateRequestUrl(){const e={tableName:this.recordField.dataset.tablename,fieldName:this.recordField.dataset.fieldname,uid:this.recordField.dataset.uid,recordTypeValue:this.recordField.dataset.recordtypevalue,dataStructureIdentifier:this.recordField.dataset.datastructureidentifier,flexFormSheetName:this.recordField.dataset.flexformsheetname,flexFormFieldName:this.recordField.dataset.flexformfieldname,flexFormContainerName:this.recordField.dataset.flexformcontainername,flexFormContainerIdentifier:this.recordField.dataset.flexformcontaineridentifier,flexFormContainerFieldName:this.recordField.dataset.flexformcontainerfieldname,flexFormSectionContainerIsNew:this.recordField.dataset.flexformsectioncontainerisnew,command:this.recordField.dataset.command};return TYPO3.settings.ajaxUrls.record_tree_data+"&"+new URLSearchParams(e)}}}));
\ No newline at end of file