diff --git a/core/modules/media_library/src/Plugin/Field/FieldWidget/MediaLibraryWidget.php b/core/modules/media_library/src/Plugin/Field/FieldWidget/MediaLibraryWidget.php index ac9cb3b51056162853bff281656505527f8de941..f957b77fddb5ca3c6f6fb28d72e877c6ebb069e2 100644 --- a/core/modules/media_library/src/Plugin/Field/FieldWidget/MediaLibraryWidget.php +++ b/core/modules/media_library/src/Plugin/Field/FieldWidget/MediaLibraryWidget.php @@ -508,8 +508,19 @@ public function formElement(FieldItemListInterface $items, $delta, array $elemen // JavaScript by adding the 'data-disabled-focus' attribute. // @see Drupal.behaviors.MediaLibraryWidgetDisableButton if (!$cardinality_unlimited && $remaining === 0) { - $element['open_button']['#attributes']['data-disabled-focus'] = 'true'; - $element['open_button']['#attributes']['class'][] = 'visually-hidden'; + $triggering_element = $form_state->getTriggeringElement(); + if ($triggering_element && ($trigger_parents = $triggering_element['#array_parents']) && end($trigger_parents) === 'media_library_update_widget') { + // The widget is being rebuilt from a selection change. + $element['open_button']['#attributes']['data-disabled-focus'] = 'true'; + $element['open_button']['#attributes']['class'][] = 'visually-hidden'; + } + else { + // The widget is being built without a selection change, so we can just + // set the item to disabled now, there is no need to set the focus + // first. + $element['open_button']['#disabled'] = TRUE; + $element['open_button']['#attributes']['class'][] = 'visually-hidden'; + } } // This hidden field and button are used to add new items to the widget. diff --git a/core/modules/media_library/tests/src/FunctionalJavascript/EntityReferenceWidgetTest.php b/core/modules/media_library/tests/src/FunctionalJavascript/EntityReferenceWidgetTest.php index 4d8ee6060f99e68f400216d8afb5ffa783141131..3240d8bf678c90c771f71973a942d30556b16b7b 100644 --- a/core/modules/media_library/tests/src/FunctionalJavascript/EntityReferenceWidgetTest.php +++ b/core/modules/media_library/tests/src/FunctionalJavascript/EntityReferenceWidgetTest.php @@ -14,6 +14,13 @@ class EntityReferenceWidgetTest extends MediaLibraryTestBase { */ protected static $modules = ['field_ui']; + /** + * Test media items. + * + * @var \Drupal\media\MediaInterface[] + */ + protected $mediaItems = []; + /** * {@inheritdoc} */ @@ -21,7 +28,7 @@ protected function setUp() { parent::setUp(); // Create a few example media items for use in selection. - $this->createMediaItems([ + $this->mediaItems = $this->createMediaItems([ 'type_one' => [ 'Horse', 'Bear', @@ -48,6 +55,31 @@ protected function setUp() { $this->drupalLogin($user); } + /** + * Tests that disabled media items don't capture focus on page load. + */ + public function testFocusNotAppliedWithoutSelectionChange() { + // Create a node with the maximum number of values for the field_twin_media + // field. + $node = $this->drupalCreateNode([ + 'type' => 'basic_page', + 'field_twin_media' => [ + $this->mediaItems['Horse'], + $this->mediaItems['Bear'], + ], + ]); + $this->drupalGet($node->toUrl('edit-form')); + $open_button = $this->assertElementExistsAfterWait('css', '.js-media-library-open-button[name^="field_twin_media"]'); + // The open button should be disabled, but not have the + // 'data-disabled-focus' attribute. + $this->assertFalse($open_button->hasAttribute('data-disabled-focus')); + $this->assertTrue($open_button->hasAttribute('disabled')); + // The button should be disabled. + $this->assertJsCondition('jQuery("#field_twin_media-media-library-wrapper .js-media-library-open-button").is(":disabled")'); + // The button should not have focus. + $this->assertJsCondition('jQuery("#field_twin_media-media-library-wrapper .js-media-library-open-button").not(":focus")'); + } + /** * Tests that the Media library's widget works as expected. */ diff --git a/core/modules/media_library/tests/src/FunctionalJavascript/MediaLibraryTestBase.php b/core/modules/media_library/tests/src/FunctionalJavascript/MediaLibraryTestBase.php index c49002c185105325b349544f5f6ea493869721ab..5f00f96baff2166c561eb5ff068abc0a531f86c0 100644 --- a/core/modules/media_library/tests/src/FunctionalJavascript/MediaLibraryTestBase.php +++ b/core/modules/media_library/tests/src/FunctionalJavascript/MediaLibraryTestBase.php @@ -25,8 +25,12 @@ abstract class MediaLibraryTestBase extends WebDriverTestBase { * * @param array $media_items * A nested array of media item names keyed by media type. + * + * @return \Drupal\media\MediaInterface[] + * An array of media entities keyed by the names passed in. */ protected function createMediaItems(array $media_items) { + $created_items = []; $time = time(); foreach ($media_items as $type => $names) { foreach ($names as $name) { @@ -39,8 +43,10 @@ protected function createMediaItems(array $media_items) { ->getSourceFieldDefinition($media->bundle->entity) ->getName(); $media->set($source_field, $name)->setCreatedTime(++$time)->save(); + $created_items[$name] = $media; } } + return $created_items; } /**