Problem/Motivation
In Layout Builder when placing a block field, I want the to use component as field formatter.
When settings the slots in my component, I choose "Field formatter", then Ajax request and I am redirected on the block configuration URL instead of refreshing the form.
The problem was not present on 2.0.0-beta6.
| Comment | File | Size | Author |
|---|---|---|---|
| #16 | Capture d’écran du 2025-01-15 18-30-38.png | 23.6 KB | grimreaper |
| #12 | Capture d’écran du 2024-12-27 11-06-28.png | 28.51 KB | grimreaper |
Issue fork ui_patterns-3495984
Show commands
Start within a Git clone of the project using the version control instructions.
Or, if you do not have SSH keys set up on git.drupalcode.org:
Comments
Comment #2
just_like_good_vibesPlease note, it seems it is not happening with theme ui_suite_dsfr for example.
Comment #3
just_like_good_vibesjust a question, i am not sure about it : would it be related to how dropdown buttons are managed in bootstrap?
Comment #4
just_like_good_vibesYes, because in fact, no matter which block is used in Layout builder, as soon as we have a slot (for example in a component block in LB), and the dropdown button to add a source, it does not work anymore.
If i desactiveate the dropdown button, and repace it to a list of buttons, then ajax works again.
so the problem you encountered is clearly related to how dropdown are handled here in ui_suite_bootstrap.
Maybe we are not constructing well the dropdown ? i don't have the final answer yet
Comment #5
just_like_good_vibeswould you have some feedbacks about dropdowns please :) ?
Comment #6
grimreaperI will recheck, but the problem did not occur on 2.0.0-beta6, so something changed between 2.0.0-beta6 and 2.0.0-rc1, I would guess related to link prop type normalization.
Comment #7
grimreaperNope, not there.
I compared the HTML in both cases of the button:
beta6:
<button type="submit" id="settings-formatter-settings-wrapper-settings-ui-patterns-slots-items-itemssettings-formatter-settings-wrapper-settings-ui-patterns-slots-items-field-formatternodewebsitefield-website-types-add-more" name="itemssettings_formatter_settings_wrapper_settings_ui_patterns_slots_items_field_formatternodewebsitefield_website_types_add_more" value="Mise en forme de champ" class="button js-form-submit form-submit btn-outline-dark btn" data-once="drupal-ajax">Mise en forme de champ</button>rc1:
<button type="submit" id="settings-formatter-settings-wrapper-settings-ui-patterns-slots-items-itemssettings-formatter-settings-wrapper-settings-ui-patterns-slots-items-field-formatternodewebsitefield-website-types-add-more" name="itemssettings_formatter_settings_wrapper_settings_ui_patterns_slots_items_field_formatternodewebsitefield_website_types_add_more" value="Mise en forme de champ" class="button js-form-submit form-submit btn-outline-dark btn">Mise en forme de champ</button>So the problem is that some JS behavior is no more attached in rc1.
I checked, "drupal-ajax" is put by app/core/misc/ajax.js, in the attach method (which is not overridden by UI Suite Bootstrap by the way)
So I put a console.log just before
once('drupal-ajax', $(elementSettings.selector)):beta6: I have plenty of debug in browser console.
rc1: 0 console.log.
So it means that in the case of rc1 Drupal ajax settings are not present or erased or not correctly built.
I searched in UI Patterns history in the diff between beta6 and rc1 and I have no idea where it is coming from.
Comment #8
pdureau commentedComment #9
just_like_good_vibes@grimreaper, would you try something for me ?
in the
src/Element/ComponentSlotForm.php, in functionbuildComponentDropbutton(around line 400),add a first line
return $elements;.Then it seems everythings works, could you confirm please?
Comment #10
just_like_good_vibesComment #11
grimreaperOk, thanks.
I am testing.
Also during the night, I need to check if it is a side effect of pwa:pwa_service_worker which potentially has an extremely aggressive cache and that some Layout Builder endpoints should be excluded from the cache.
Comment #12
grimreaperSo, not PWA, as Layout Builder path starts with admin and admin path is excluded from cache.
So I tried like you asked:
Then I have:
And yes, then it works.
Strange because in the diff https://git.drupalcode.org/project/ui_patterns/-/compare/2.0.0-beta6...2... I don't see change on this method or class.
Comment #13
grimreaperHello,
I think it would be better to convert the source dropdown into a select.
1: it will ensure the theming is easier/out-of-the-box.
2: I think it will solve this ajax bug
3: personally, when I see the arrow of the dropdown, I click on it and then I forget that there is the "Add component" option first.
Comment #15
just_like_good_vibesComment #16
grimreaperThanks!
I confirm the fix. RTBC.
I let you merge if you want.
Comment #17
pdureau commentedOK for me because:
Christian, if you are OK too, we merge:
Comment #18
pdureau commentedDecided collectively during the weekly.
Instead of a list of buttons inside a fieldset, let's try with a
selectform element with:- Select a source to add -as empty option of the form elementComment #19
just_like_good_vibesComment #20
christian.wiedemann commentedComment #21
christian.wiedemann commented