Commit 5ff4de8f authored by Nikita Hovratov's avatar Nikita Hovratov
Browse files

[BUGFIX] Toggle inline controls only in own scope

The former approach in #91808 to fix scoped toggling didn't
work with levelLinksPosition "bottom", as the querySelector
could find another control container inside another child
inline field first.

Another solution, which is now possible, works with the
":scope" selector. Only nodes with a direct parent will be
found this way.

In addition, a new helper class is added for the top control
container, as it is wrapped in another div. This enables
toggling of both buttons, in case levelLinksPosition "both"
is set.

Resolves: #97786
Related: #91808
Related: #92382
Releases: main, 11.5
Change-Id: I67146c372d183cd647db847b3e3d83d986585577
Reviewed-on: https://review.typo3.org/c/Packages/TYPO3.CMS/+/74928


Tested-by: core-ci's avatarcore-ci <typo3@b13.com>
Tested-by: Christian Kuhn's avatarChristian Kuhn <lolli@schwarzbu.ch>
Tested-by: Stefan Bürk's avatarStefan Bürk <stefan@buerk.tech>
Tested-by: Nikita Hovratov's avatarNikita Hovratov <nikita.h@live.de>
Reviewed-by: Christian Kuhn's avatarChristian Kuhn <lolli@schwarzbu.ch>
Reviewed-by: Stefan Bürk's avatarStefan Bürk <stefan@buerk.tech>
Reviewed-by: Nikita Hovratov's avatarNikita Hovratov <nikita.h@live.de>
parent 19c30fa4
......@@ -40,6 +40,7 @@ enum Selectors {
uniqueValueSelectors = 'select.t3js-inline-unique',
revertUniqueness = '.t3js-revert-unique',
controlContainer = '.t3js-inline-controls',
controlTopOuterContainer = '.t3js-inline-controls-top-outer-container',
}
enum States {
......@@ -789,13 +790,18 @@ class InlineControlContainer {
* @param {boolean} visible
*/
private toggleContainerControls(visible: boolean): void {
const controlContainer = this.container.querySelector(Selectors.controlContainer);
const controlContainer = this.container.querySelectorAll(
':scope > ' + Selectors.controlContainer + ', '
+ ':scope > ' + Selectors.controlTopOuterContainer + ' ' + Selectors.controlContainer
);
if (controlContainer === null) {
return;
}
const controlContainerButtons = controlContainer.querySelectorAll('button, a');
controlContainerButtons.forEach((button: HTMLElement): void => {
button.style.display = visible ? null : 'none';
controlContainer.forEach((container: HTMLElement): void => {
let controlContainerButtons = container.querySelectorAll('button, a');
controlContainerButtons.forEach((button: HTMLElement): void => {
button.style.display = visible ? null : 'none';
});
});
}
......
......@@ -311,7 +311,7 @@ class InlineControlContainer extends AbstractContainer
// Add the level buttons before all child records:
if (in_array($config['appearance']['levelLinksPosition'] ?? null, ['both', 'top'], true)) {
$html .= '<div class="form-group t3js-formengine-validation-marker">' . $newRecordButton . $localizationButtons . '</div>';
$html .= '<div class="form-group t3js-formengine-validation-marker t3js-inline-controls-top-outer-container">' . $newRecordButton . $localizationButtons . '</div>';
}
// If it's required to select from possible child records (reusable children), add a selector box
......
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