Verified Commit 5b7e07a2 authored by Lauri Timmanee's avatar Lauri Timmanee
Browse files

Issue #2911932 by bnjmnm, arnaud-brugnon, EthanT, leslie.cordell, Gauravvvv,... 

Issue #2911932 by bnjmnm, arnaud-brugnon, EthanT, leslie.cordell, Gauravvvv, smustgrave, lauriii, nod_: Correct vertical tab does not focus on form validation
parent 50450028

core/misc/vertical-tabs.es6.js

+15 −0
Original line number Diff line number Diff line
@@ -118,6 +118,21 @@ 
          }

        },

      );



      // If a validation error is within a vertical tab, open that tab.

      context.querySelectorAll('details .form-item .error').forEach((item) => {

        const details = item.closest('details');



        if (details.style.display === 'none') {

          const tabSelect = document.querySelector(

            "[href='#".concat(details.id, "']"),

          );



          if (tabSelect) {

            tabSelect.click();

          }

        }

      });

    },

  };

core/misc/vertical-tabs.js

+9 −0
Original line number Diff line number Diff line
@@ -55,6 +55,15 @@ 
          tabFocus.data('verticalTab').focus();

        }

      });

      context.querySelectorAll('details .form-item .error').forEach(function (item) {

        var details = item.closest('details');

        if (details.style.display === 'none') {

          var tabSelect = document.querySelector("[href='#".concat(details.id, "']"));

          if (tabSelect) {

            tabSelect.click();

          }

        }

      });

    }

  };

  Drupal.verticalTab = function (settings) {

core/modules/ckeditor5/js/ckeditor5.admin.es6.js

+0 −17
Original line number Diff line number Diff line
@@ -1049,21 +1049,4 @@ 
    // Call the original behavior.

    originalFilterStatusAttach(context, settings);

  };



  // Activates otherwise-inactive tabs that have form elements with validation

  // errors.

  // @todo Remove when https://www.drupal.org/project/drupal/issues/2911932 lands.

  Drupal.behaviors.tabErrorsVisible = {

    attach(context) {

      context.querySelectorAll('details .form-item .error').forEach((item) => {

        const details = item.closest('details');

        if (details.style.display === 'none') {

          const tabSelect = document.querySelector(`[href='#${details.id}']`);

          if (tabSelect) {

            tabSelect.click();

          }

        }

      });

    },

  };

})(Drupal, drupalSettings, jQuery, JSON, once, Sortable, tabbable);

core/modules/ckeditor5/js/ckeditor5.admin.js

+0 −13
Original line number Diff line number Diff line
@@ -513,17 +513,4 @@ function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input == 
    $(filterStatusCheckboxes).off('click.filterUpdate');

    originalFilterStatusAttach(context, settings);

  };

  Drupal.behaviors.tabErrorsVisible = {

    attach: function attach(context) {

      context.querySelectorAll('details .form-item .error').forEach(function (item) {

        var details = item.closest('details');

        if (details.style.display === 'none') {

          var tabSelect = document.querySelector("[href='#".concat(details.id, "']"));

          if (tabSelect) {

            tabSelect.click();

          }

        }

      });

    }

  };

})(Drupal, drupalSettings, jQuery, JSON, once, Sortable, tabbable);
 
 No newline at end of file

core/modules/system/tests/modules/form_test/src/Form/FormTestGroupVerticalTabsForm.php

+13 −0
Original line number Diff line number Diff line
@@ -44,9 +44,22 @@ public function buildForm(array $form, FormStateInterface $form_state) { 
      '#type' => 'textfield',

      '#title' => 'Second nested element in details element',

    ];

    $form['submit'] = [

      '#type' => 'submit',

      '#value' => 'Save',

    ];

    return $form;

  }



  /**

   * {@inheritdoc}

   */

  public function validateForm(array &$form, FormStateInterface $form_state) {

    if ($form_state->getValue('element_2') === 'bad') {

      $form_state->setErrorByName('element_2', $this->t('there was an error'));

    }

  }



  /**

   * {@inheritdoc}

   */