Commit 96d32831 authored by Andreas Fernandez's avatar Andreas Fernandez Committed by Daniel Goerz
Browse files

[BUGFIX] Use hashed object identifier in IRRE for nprogress

nprogress is used to indicate activity when a collapsed IRRE node is
about to get loaded. In case of FlexForms the id attribute may contain a
dot which is not an issue if handled correctly.
However, nprogress doesn't treat this value as an id, but rather as a
full CSS selector which causes issues and breaks loading the IRRE node.

To work around this issue, the id of the container used to render the
progress bar is now MD5 hashed.

Resolves: #91585
Releases: master, 10.4
Change-Id: I893d0cf24ea0f384d9ffff4d84f83b0fa35341b7
Reviewed-on: https://review.typo3.org/c/Packages/TYPO3.CMS/+/64783

Tested-by: default avatarTYPO3com <noreply@typo3.com>
Tested-by: Anja Leichsenring's avatarAnja Leichsenring <aleichsenring@ab-softlab.de>
Tested-by: Daniel Goerz's avatarDaniel Goerz <daniel.goerz@posteo.de>
Reviewed-by: Anja Leichsenring's avatarAnja Leichsenring <aleichsenring@ab-softlab.de>
Reviewed-by: Oliver Hader's avatarOliver Hader <oliver.hader@typo3.org>
Reviewed-by: Daniel Goerz's avatarDaniel Goerz <daniel.goerz@posteo.de>
parent 8682397b
......@@ -536,7 +536,7 @@ class InlineControlContainer {
const isLoaded = recordFieldsContainer !== null && !recordContainer.classList.contains(States.notLoaded);
if (!isLoaded) {
const progress = this.getProgress(objectId);
const progress = this.getProgress(objectId, recordContainer.dataset.objectIdHash);
if (!isLoading) {
const ajaxRequest = this.ajaxDispatcher.newRequest(this.ajaxDispatcher.getEndpoint('record_inline_details'));
......@@ -772,9 +772,10 @@ class InlineControlContainer {
/**
* @param {string} objectId
* @param {string} objectIdHash
*/
private getProgress(objectId: string): any {
const headerIdentifier = '#' + objectId + '_header';
private getProgress(objectId: string, objectIdHash: string): any {
const headerIdentifier = '#' + objectIdHash + '_header';
let progress: any;
if (typeof this.progessQueue[objectId] !== 'undefined') {
......@@ -851,10 +852,11 @@ class InlineControlContainer {
}
records.forEach((recordUid: string, index: number): void => {
const headerIdentifier = objectId + Separators.structureSeparator + recordUid + '_header';
const recordContainer = InlineControlContainer.getInlineRecordContainer(objectId + Separators.structureSeparator + recordUid);
const headerIdentifier = recordContainer.dataset.objectIdHash + '_header';
const headerElement = document.getElementById(headerIdentifier);
const sortUp = headerElement.querySelector('[data-action="sort"][data-direction="' + SortDirections.UP + '"]');
if (sortUp !== null) {
let iconIdentifier = 'actions-move-up';
if (index === 0) {
......
......@@ -198,11 +198,15 @@ class InlineRecordContainer extends AbstractContainer
// in case of site_language we don't have the full form engine options, so fallbacks need to be taken into account
$originalUniqueValue = ($uniqueValueValues['table'] ?? $foreignTable) . '_' . ($uniqueValueValues['uid'] ?? $uniqueValueValues);
}
// The hashed object id needs a non-numeric prefix, the value is used as ID selector in JavaScript
$hashedObjectId = 'hash-' . md5($objectId);
$containerAttributes = [
'id' => $objectId . '_div',
'class' => 'form-irre-object panel panel-default panel-condensed ' . trim(implode(' ', $classes)),
'data-object-uid' => $record['uid'],
'data-object-id' => $objectId,
'data-object-id-hash' => $hashedObjectId,
'data-field-name' => $appendFormFieldNames,
'data-topmost-parent-table' => $data['inlineTopMostParentTableName'],
'data-topmost-parent-uid' => $data['inlineTopMostParentUid'],
......@@ -211,7 +215,7 @@ class InlineRecordContainer extends AbstractContainer
$html = '
<div ' . GeneralUtility::implodeAttributes($containerAttributes, true) . '>
<div class="panel-heading" data-toggle="formengine-inline" id="' . htmlspecialchars($objectId) . '_header" data-expandSingle="' . ($inlineConfig['appearance']['expandSingle'] ? 1 : 0) . '">
<div class="panel-heading" data-toggle="formengine-inline" id="' . htmlspecialchars($hashedObjectId) . '_header" data-expandSingle="' . ($inlineConfig['appearance']['expandSingle'] ? 1 : 0) . '">
<div class="form-irre-header">
<div class="form-irre-header-cell form-irre-header-icon">
<span class="caret"></span>
......
Markdown is supported
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