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 0d8af0979c0..3cd05e1082a 100644
--- a/core/modules/media_library/src/Plugin/Field/FieldWidget/MediaLibraryWidget.php
+++ b/core/modules/media_library/src/Plugin/Field/FieldWidget/MediaLibraryWidget.php
@@ -146,7 +146,9 @@ class MediaLibraryWidget extends WidgetBase implements ContainerFactoryPluginInt
 
     // Get the configured media types from the field storage.
     $handler_settings = $this->getFieldSetting('handler_settings');
-    $allowed_media_type_ids = $handler_settings['target_bundles'];
+    // The target bundles will be blank when saving field storage settings,
+    // when first adding a media reference field.
+    $allowed_media_type_ids = isset($handler_settings['target_bundles']) ? $handler_settings['target_bundles'] : NULL;
 
     // When there are no allowed media types, return the empty array.
     if ($allowed_media_type_ids === []) {
diff --git a/core/modules/media_library/tests/src/FunctionalJavascript/MediaLibraryTest.php b/core/modules/media_library/tests/src/FunctionalJavascript/MediaLibraryTest.php
index eff1fde6f03..f8b0f175be4 100644
--- a/core/modules/media_library/tests/src/FunctionalJavascript/MediaLibraryTest.php
+++ b/core/modules/media_library/tests/src/FunctionalJavascript/MediaLibraryTest.php
@@ -1582,4 +1582,36 @@ class MediaLibraryTest extends WebDriverTestBase {
     $assert_session->elementExists('css', '.media-library-menu');
   }
 
+  /**
+   * Tests field UI integration for media library widget.
+   */
+  public function testFieldUiIntegration() {
+    $page = $this->getSession()->getPage();
+    $assert_session = $this->assertSession();
+    $this->drupalCreateContentType(['type' => 'article']);
+    $user = $this->drupalCreateUser([
+      'access administration pages',
+      'administer node fields',
+      'administer node form display',
+    ]);
+    $this->drupalLogin($user);
+
+    $this->drupalGet('/admin/structure/types/manage/article/fields/add-field');
+    $page->selectFieldOption('new_storage_type', 'field_ui:entity_reference:media');
+    $this->assertTrue($assert_session->waitForField('label'));
+    $page->fillField('label', 'Shatner');
+    $this->assertTrue($assert_session->waitForText('field_shatner'));
+    $page->pressButton('Save and continue');
+    $page->pressButton('Save field settings');
+    $assert_session->pageTextNotContains('Undefined index: target_bundles');
+    $page->checkField('settings[handler_settings][target_bundles][type_one]');
+    $assert_session->assertWaitOnAjaxRequest();
+    $page->checkField('settings[handler_settings][target_bundles][type_two]');
+    $assert_session->assertWaitOnAjaxRequest();
+    $page->checkField('settings[handler_settings][target_bundles][type_three]');
+    $assert_session->assertWaitOnAjaxRequest();
+    $page->pressButton('Save settings');
+    $assert_session->pageTextContains('Saved Shatner configuration.');
+  }
+
 }