Problem/Motivation
There is this button in ContextualFormPanel:
$build['update'] = [
'#type' => 'button',
'#value' => 'Update',
'#submit_button' => FALSE,
'#attributes' => [
'type' => 'button',
'data-wysiwyg-fix' => TRUE,
],
];
Which have its own logic in HtmxEvent::onInstanceUpdateButtonClick().
ContextualFormPanel seems to work well without it now and this create visual noise, some confusion ("do I need to click on it?") and uncessary code.
Proposed resolution
Can we remove it? Is it still useful in some situations? Which ones? Is it useful for accessibility?
Use case where needed
Example with an entity view on node type articles with Tags reference field.
- Librairies > Blocks > Referenced entities > Tags (Taxonomy term) referenced by Tags
- Move to display, publish appear, click publish
- Click the Tags field in the builder or layer
- Select source: [Entity] -> [Field]
- Field : Name
- Select source: [Field Item] Text value
The Publish button is not available, no HTMX request is performed.
Click "Update" button, then the HTMX request is triggered and "Publish" is available.
| Comment | File | Size | Author |
|---|---|---|---|
| #13 | 04-after-annotated.png | 86.9 KB | andres alvarez |
| #13 | 02-before-annotated.png | 91.85 KB | andres alvarez |
| #11 | 3554416 after 2.png | 919.28 KB | csakiistvan |
| #11 | 3554416 after.png | 792.68 KB | csakiistvan |
| #11 | 3554416 before.png | 708.95 KB | csakiistvan |
Issue fork display_builder-3554416
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
pdureau commentedComment #3
pdureau commented"Update" button is still useful with the "entity -> field" source.
Comment #4
mogtofu33 commentedComment #5
pdureau commentedSome additional tests from #3626043: Config panel loses source settings on AJAX actions and saves raw values
Setup:
Add a widget source (so without opening a modal):
Inside an inline modal, the preview behavior change according to the source:
We have similar behavior with "Cancel" button, but it may be just another effect of the same cause.
Comment #6
pdureau commentedI will give a try, in 2 steps:
components/display_builder/js/display_builder.jschangeevent, so we cover Cancel, Remove and "Add content". Check we are not creating unexpected revisionsContextualFormPaneland the related logic inHtmxEventsAnd the related tests.
Comment #8
pdureau commentedMR created: https://git.drupalcode.org/project/display_builder/-/merge_requests/510
Setup:
Add a widget source (so without opening a modal):
Inside an inline modal, the preview behavior change according to the source:
So it seems to work well.
However, let's also check:
Comment #9
pdureau commentedThey look legit, because they are in reality only 2 changes:
contextual_form_updateduration.blur()tests/src/Playwright/Tests/contextual_form.spec.tstests/src/Playwright/Tests/preview.spec.tstests/src/Playwright/Tests/textarea.spec.tstests/src/Playwright/objects/DisplayBuilder.tsWe create more revision, because we don't wait to push an "Update" button to propagate change, but as far as I tested, the revision are added each time I am doing an impactful change (switch component, add a label...), not at every action (pick a formatter...). So it looks good.
The only problem is all the revisions being titled "Update [Entity] ➜ [Field] configuration"
We can do better (#3534427: Add details in instance update logs) but it is out of scope of this ticket.
Open for review. It is more convenient to do the review with Entity View Display.
Comment #10
csakiistvanComment #11
csakiistvan❌ Does not fix the issue — applied MR !510, rebuilt caches and configured a Tags referenced-entities block on the article Entity View Display: the Update button is gone and the preview updates on its own, but clicking "Add content" under the field now saves the empty nested source and the builder preview crashes with
Error: Call to a member function getValue() on nulluntil a source is picked. Without the MR the same click does not crash the preview, and the Update button was not needed there to get the preview updated.Prerequisites
node.article.defaultwith thedefaultprofile.[Entity] ➜ [Field], FieldName, then "Add content" and leave the new Source on "- Select -".Actual results
DerivableContextSourceBase::getPropValue()(ui_patterns, line 106); picking[Field item] Text valuerecovers it.[Field item] Text valueupdated the preview without clicking Update, so the use case in the issue summary did not reproduce.Code review
d9f6ce62, rebased on 1.0.x, pipeline green.Drupal.Ajax.prototype.successnow triggers a save after every#ajaxresponse, not onlychangeevents, so the "Add content" click persists an incomplete source.Comment #12
andres alvarez commentedComment #13
andres alvarez commentedFollow-up to comment #11 by @csakiistvan.
I added a fix in
ApiController::update(). A newremoveEmptySlotRows()method drops, beforesetSource(), anysourcesrow with an emptysource_id. The automatic save that fires after every#ajaxresponse therefore no longer persists incomplete rows. The Update button removal and the JS are unchanged.ContextualFormPanelRoundTripTest(testEmptySlotRowIsNotPersistedandtestCompleteSlotRowIsPersisted). They fail without the fix and pass with it. Thecontextual_form,previewandtextareaPlaywright specs pass with the fix (13/13, Firefox only).source_idwas empty.What I could not verify:
Call to a member function getValue() on nullerror, neither before nor after the fix. From the ui_patterns code,getSourcePlugins()only does anisset()check onsource_id, so an empty value reachescreateSourcePlugin(''), which returns NULL. But I did not execute that path. In my test setup the builder does not offer theentity_fieldsource in that block's slot.@csakiistvan, could you share which component, context and steps you used to reach the nested source? With that I can reproduce it and confirm the fix covers the error.
Comment #14
andres alvarez commentedComment #15
csakiistvanThanks @andres alvarez for the follow-up fix and the new Kernel tests.
❌ Does not fix the issue — applied MR !510, rebuilt caches and repeated the steps from comment #11 on the article Entity View Display: the
getValue() on nullcrash is gone, but leaving the new nested Source on "- Select -" now showsWarning: Undefined array key 0 in DerivableContextSourceBase->getSourcePlugins()(ui_patterns, line 166) twice in the preview and as a message. Picking[Field item] Text valueclears it and the preview updates without the Update button, so the empty-source path still needs handling.Suggestion
Drop the key once no row is left, so ui_patterns takes its existing
!isset($source_configuration['source_id'])early return (not tested here):Alternatively, guard it in ui_patterns with
!empty($sources['sources'])instead ofisset().Comment #16
pdureau commentedThansk. I will do that and redo the tests from comment #9.
Comment #17
pdureau commented