Issue #3103812 by raman.b, rromore, tim.plunkett: Layout Builder's...

Issue #3103812 by raman.b, rromore, tim.plunkett: Layout Builder's ConfigureSectionForm forms do not display validation errors on submit

(cherry picked from commit 832592c1)

core/modules/layout_builder/src/Form/ConfigureSectionForm.php

@@ -2,6 +2,7 @@
 
 namespace Drupal\layout_builder\Form;
 
+use Drupal\Component\Utility\Html;
 use Drupal\Core\Ajax\AjaxFormHelperTrait;
 use Drupal\Core\Form\FormBase;
 use Drupal\Core\Form\FormStateInterface;
@@ -132,6 +133,15 @@ public function buildForm(array $form, FormStateInterface $form_state, SectionSt
     ];
     if ($this->isAjax()) {
       $form['actions']['submit']['#ajax']['callback'] = '::ajaxSubmit';
+      // @todo static::ajaxSubmit() requires data-drupal-selector to be the same
+      //   between the various Ajax requests. A bug in
+      //   \Drupal\Core\Form\FormBuilder prevents that from happening unless
+      //   $form['#id'] is also the same. Normally, #id is set to a unique HTML
+      //   ID via Html::getUniqueId(), but here we bypass that in order to work
+      //   around the data-drupal-selector bug. This is okay so long as we
+      //   assume that this form only ever occurs once on a page. Remove this
+      //   workaround in https://www.drupal.org/node/2897377.
+      $form['#id'] = Html::getId($form_state->getBuildInfo()['form_id']);
     }
     $target_highlight_id = $this->isUpdate ? $this->sectionUpdateHighlightId($delta) : $this->sectionAddHighlightId($delta);
     $form['#attributes']['data-layout-builder-target-highlight-id'] = $target_highlight_id;

core/modules/layout_builder/tests/src/FunctionalJavascript/LayoutBuilderTest.php

@@ -306,6 +306,21 @@ public function testConfigurableLayoutSections() {
     $assert_session->pageTextContains('Default');
     $assert_session->linkExists('Add block');
 
+    // Ensure validation error is displayed for ConfigureSectionForm.
+    $assert_session->linkExists('Add section');
+    $this->clickLink('Add section');
+    $assert_session->waitForElementVisible('named', ['link', 'Layout plugin (with settings)']);
+    $this->clickLink('Layout plugin (with settings)');
+    $this->assertOffCanvasFormAfterWait('layout_builder_configure_section');
+    $page->fillField('layout_settings[setting_1]', 'Test Validation Error Message');
+    $page->pressButton('Add section');
+    $assert_session->waitForElement('css', '.messages--error');
+    $assert_session->pageTextContains('Validation Error Message');
+    $page->fillField('layout_settings[setting_1]', 'Setting 1 Value');
+    $page->pressButton('Add section');
+    $assert_session->assertNoElementAfterWait('css', '#drupal-off-canvas');
+    $assert_session->pageTextContains('Setting 1 Value');
+
     // Configure the existing section.
     $assert_session->linkExists('Configure Section 1');
     $this->clickLink('Configure Section 1');

core/modules/system/tests/modules/layout_test/src/Plugin/Layout/LayoutTestPlugin.php

@@ -49,6 +49,9 @@ public function buildConfigurationForm(array $form, FormStateInterface $form_sta
    * {@inheritdoc}
    */
   public function validateConfigurationForm(array &$form, FormStateInterface $form_state) {
+    if ($form_state->getValue('setting_1') === 'Test Validation Error Message') {
+      $form_state->setErrorByName('setting_1', 'Validation Error Message');
+    }
   }
 
   /**