Commit 563788c4 authored by Andreas Fernandez's avatar Andreas Fernandez Committed by Oliver Bartsch
Browse files

[TASK] Get rid of TBE_EDITOR.fieldChanged

TBE_EDITOR has some old code still managing FormEngine today, even with
substitutions available since at least TYPO3 v7. This patch replaces the
last occurrences of TBE_EDITOR.fieldChanged() and deprecates the method.

Resolves: #93975
Releases: master
Change-Id: I58b9e40284495a15e327d2ab2c8caaebc0107e95
Reviewed-on: https://review.typo3.org/c/Packages/TYPO3.CMS/+/68757

Reviewed-by: Christian Kuhn's avatarChristian Kuhn <lolli@schwarzbu.ch>
Reviewed-by: Anja Leichsenring's avatarAnja Leichsenring <aleichsenring@ab-softlab.de>
Reviewed-by: Oliver Bartsch's avatarOliver Bartsch <bo@cedev.de>
Tested-by: default avatarTYPO3com <noreply@typo3.com>
Tested-by: Christian Kuhn's avatarChristian Kuhn <lolli@schwarzbu.ch>
Tested-by: Anja Leichsenring's avatarAnja Leichsenring <aleichsenring@ab-softlab.de>
Tested-by: Oliver Bartsch's avatarOliver Bartsch <bo@cedev.de>
parent a85bac03
......@@ -423,7 +423,7 @@ class InlineControlContainer {
if (hiddenValueCheckBox !== null && hiddenValueInput !== null) {
hiddenValueCheckBox.checked = !hiddenValueCheckBox.checked;
hiddenValueInput.value = hiddenValueCheckBox.checked ? '1' : '0';
TBE_EDITOR.fieldChanged(this.container.dataset.localTable, this.container.dataset.uid, this.container.dataset.localField, hiddenFieldName);
FormEngineValidation.markFieldAsChanged(hiddenValueCheckBox);
}
const hiddenClass = 't3-form-field-container-inline-hidden';
......@@ -674,8 +674,6 @@ class InlineControlContainer {
FormEngine.reinitialize();
FormEngineValidation.initializeInputFields();
FormEngineValidation.validate(this.container);
TBE_EDITOR.fieldChanged(this.container.dataset.localTable, this.container.dataset.uid, this.container.dataset.localField, formField);
}
/**
......
......@@ -23,10 +23,9 @@ class ValueSlider {
*/
private static updateValue(element: HTMLInputElement): void {
const foreignField = document.querySelector(`[data-formengine-input-name="${element.dataset.sliderItemName}"]`) as HTMLInputElement;
const sliderCallbackParams = JSON.parse(element.dataset.sliderCallbackParams);
foreignField.value = element.value;
TBE_EDITOR.fieldChanged.apply(TBE_EDITOR, sliderCallbackParams);
foreignField.dispatchEvent(new Event('change', {bubbles: true, cancelable: true}));
}
/**
......
......@@ -85,10 +85,6 @@ declare namespace TYPO3 {
}
}
declare namespace TBE_EDITOR {
export let fieldChanged: Function;
}
/**
* Current AMD/RequireJS modules are returning *instances* of ad-hoc *classes*, make that known to TypeScript
*/
......
......@@ -126,12 +126,6 @@ class FormFlexAjaxController extends AbstractFormEngineAjaxController
// JavaScript code for event handlers:
// @todo: see if we can get rid of this - used in group elements, and also for the "reload" on type field changes
$formData['parameterArray']['fieldChangeFunc'] = [];
$formData['parameterArray']['fieldChangeFunc']['TBE_EDITOR_fieldChanged'] = 'TBE_EDITOR.fieldChanged('
. GeneralUtility::quoteJSvalue($tableName)
. ',' . GeneralUtility::quoteJSvalue($formData['databaseRow']['uid'])
. ',' . GeneralUtility::quoteJSvalue($fieldName)
. ',' . GeneralUtility::quoteJSvalue($formData['parameterArray']['itemFormElName'])
. ');';
// @todo: check GroupElement for usage of elementBaseName ... maybe kick that thing?
......
......@@ -119,12 +119,6 @@ class SingleFieldContainer extends AbstractContainer
// JavaScript code for event handlers:
$parameterArray['fieldChangeFunc'] = [];
$parameterArray['fieldChangeFunc']['TBE_EDITOR_fieldChanged'] = 'TBE_EDITOR.fieldChanged('
. GeneralUtility::quoteJSvalue($table) . ','
. GeneralUtility::quoteJSvalue($row['uid']) . ','
. GeneralUtility::quoteJSvalue($fieldName) . ','
. GeneralUtility::quoteJSvalue($parameterArray['itemFormElName'])
. ');';
// Based on the type of the item, call a render function on a child element
$options = $this->data;
......
......@@ -213,7 +213,6 @@ class InputTextElement extends AbstractFormElement
$valueType = 'double';
$itemValue = (double)$itemValue;
}
$callbackParams = [ $table, $row['uid'], $fieldName, $parameterArray['itemFormElName'] ];
$rangeAttributes = [
'id' => $id,
'type' => 'range',
......@@ -227,7 +226,6 @@ class InputTextElement extends AbstractFormElement
'data-slider-id' => $id,
'data-slider-value-type' => $valueType,
'data-slider-item-name' => (string)($parameterArray['itemFormElName'] ?? ''),
'data-slider-callback-params' => (string)json_encode($callbackParams),
];
$valueSliderHtml[] = '<div class="slider-wrapper">';
$valueSliderHtml[] = '<input ' . GeneralUtility::implodeAttributes($rangeAttributes, true) . '>';
......
......@@ -10,4 +10,4 @@
*
* The TYPO3 project - inspiring people to share!
*/
define(["require","exports","TYPO3/CMS/Core/Event/ThrottleEvent"],(function(e,t,a){"use strict";class n{constructor(e){this.controlElement=null,this.handleRangeChange=e=>{const t=e.target;n.updateValue(t),n.updateTooltipValue(t)},this.controlElement=document.getElementById(e),new a("input",this.handleRangeChange,25).bindTo(this.controlElement)}static updateValue(e){const t=document.querySelector(`[data-formengine-input-name="${e.dataset.sliderItemName}"]`),a=JSON.parse(e.dataset.sliderCallbackParams);t.value=e.value,TBE_EDITOR.fieldChanged.apply(TBE_EDITOR,a)}static updateTooltipValue(e){let t;const a=e.value;switch(e.dataset.sliderValueType){case"double":t=parseFloat(a).toFixed(2);break;case"int":default:t=parseInt(a,10)}e.title=t.toString()}}return n}));
\ No newline at end of file
define(["require","exports","TYPO3/CMS/Core/Event/ThrottleEvent"],(function(e,t,a){"use strict";class n{constructor(e){this.controlElement=null,this.handleRangeChange=e=>{const t=e.target;n.updateValue(t),n.updateTooltipValue(t)},this.controlElement=document.getElementById(e),new a("input",this.handleRangeChange,25).bindTo(this.controlElement)}static updateValue(e){const t=document.querySelector(`[data-formengine-input-name="${e.dataset.sliderItemName}"]`);t.value=e.value,t.dispatchEvent(new Event("change",{bubbles:!0,cancelable:!0}))}static updateTooltipValue(e){let t;const a=e.value;switch(e.dataset.sliderValueType){case"double":t=parseFloat(a).toFixed(2);break;case"int":default:t=parseInt(a,10)}e.title=t.toString()}}return n}));
\ No newline at end of file
......@@ -58,6 +58,8 @@ var TBE_EDITOR = {
},
fieldChanged: function(table, uid, field, el) {
var theField = 'data[' + table + '][' + uid + '][' + field + ']';
console.warn('The method `TBE_EDITOR.fieldChanged()` is deprecated, consider dispatching the `change` event instead: document.querySelector(\'[name="' + theField + '"]\').dispatchEvent(new Event(\'change\', {bubbles: true, cancelable: true}));');
TBE_EDITOR.isChanged = 1;
// modify the "field has changed" info by adding a class to the container element (based on palette or main field)
......
.. include:: ../../Includes.txt
==========================================================
Deprecation: #93975 - Deprecated TBE_EDITOR.fieldChanged()
==========================================================
See :issue:`93975`
Description
===========
The JavaScript function :js:`TBE_EDITOR.fieldChanged()` is a precursor of the
rewritten FormEngine that started with TYPO3 v7 already.
Now, FormEngine has proper change handling which renders the function
:js:`TBE_EDITOR.fieldChanged()` obsolete, thus this function became marked as
deprecated.
Impact
======
Using :js:`TBE_EDITOR.fieldChanged()` will trigger a deprecation entry in the
browser's console.
Affected Installations
======================
Every installation with 3rd-party extensions installed using this function is
affected.
Migration
=========
It is possible to trigger the :js:`change` event on the given field, if
FormEngine is unable to detect changes automatically.
Example:
.. code-block:: javascript
// Previous invocation
TBE_EDITOR.fieldChanged('table', 'field_name', 42);
// Migrate to event-based handling
document
.querySelector('[name="data[table][field_name][42]"]')
.dispatchEvent(new Event('change', {bubbles: true, cancelable: true}));
.. index:: Backend, JavaScript, NotScanned, ext:backend
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment