Issue #3291622 by smustgrave, g-brodiei, ameymudras, ambikahirode, danflanagan8, catch, Lendude: Formatter 'URL to image' from ImageUrlFormatter shows PHP warning due to the newly introduced loading attribute on image field

(cherry picked from commit b8ad2d90b4)

core/modules/image/src/Plugin/Field/FieldFormatter/ImageUrlFormatter.php

@@ -3,8 +3,14 @@
 namespace Drupal\image\Plugin\Field\FieldFormatter;
 
 use Drupal\Core\Cache\CacheableMetadata;
+use Drupal\Core\Entity\EntityStorageInterface;
+use Drupal\Core\Field\FieldDefinitionInterface;
 use Drupal\Core\Field\FieldItemListInterface;
 use Drupal\Core\Form\FormStateInterface;
+use Drupal\Core\Link;
+use Drupal\Core\Session\AccountInterface;
+use Drupal\Core\Url;
+use Symfony\Component\DependencyInjection\ContainerInterface;
 
 /**
  * Plugin implementation of the 'image_url' formatter.
@@ -17,7 +23,66 @@ use Drupal\Core\Form\FormStateInterface;
  *   }
  * )
  */
-class ImageUrlFormatter extends ImageFormatter {
+class ImageUrlFormatter extends ImageFormatterBase {
+
+  /**
+   * The image style entity storage.
+   *
+   * @var \Drupal\image\ImageStyleStorageInterface
+   */
+  protected $imageStyleStorage;
+
+  /**
+   * The current user.
+   *
+   * @var \Drupal\Core\Session\AccountInterface
+   */
+  protected $currentUser;
+
+  /**
+   * Constructs an ImageFormatter object.
+   *
+   * @param string $plugin_id
+   *   The plugin_id for the formatter.
+   * @param mixed $plugin_definition
+   *   The plugin implementation definition.
+   * @param \Drupal\Core\Field\FieldDefinitionInterface $field_definition
+   *   The definition of the field to which the formatter is associated.
+   * @param array $settings
+   *   The formatter settings.
+   * @param string $label
+   *   The formatter label display setting.
+   * @param string $view_mode
+   *   The view mode.
+   * @param array $third_party_settings
+   *   Any third party settings.
+   * @param \Drupal\Core\Entity\EntityStorageInterface $image_style_storage
+   *   The image style storage.
+   * @param \Drupal\Core\Session\AccountInterface $current_user
+   *   The current user.
+   */
+  public function __construct($plugin_id, $plugin_definition, FieldDefinitionInterface $field_definition, array $settings, $label, $view_mode, array $third_party_settings, EntityStorageInterface $image_style_storage, AccountInterface $current_user) {
+    parent::__construct($plugin_id, $plugin_definition, $field_definition, $settings, $label, $view_mode, $third_party_settings);
+    $this->imageStyleStorage = $image_style_storage;
+    $this->currentUser = $current_user;
+  }
+
+  /**
+   * {@inheritdoc}
+   */
+  public static function create(ContainerInterface $container, array $configuration, $plugin_id, $plugin_definition) {
+    return new static(
+      $plugin_id,
+      $plugin_definition,
+      $configuration['field_definition'],
+      $configuration['settings'],
+      $configuration['label'],
+      $configuration['view_mode'],
+      $configuration['third_party_settings'],
+      $container->get('entity_type.manager')->getStorage('image_style'),
+      $container->get('current_user'),
+    );
+  }
 
   /**
    * {@inheritdoc}
@@ -36,6 +101,22 @@ class ImageUrlFormatter extends ImageFormatter {
 
     unset($element['image_link'], $element['image_loading']);
 
+    $image_styles = image_style_options(FALSE);
+    $description_link = Link::fromTextAndUrl(
+      $this->t('Configure Image Styles'),
+      Url::fromRoute('entity.image_style.collection')
+    );
+    $element['image_style'] = [
+      '#title' => $this->t('Image style'),
+      '#type' => 'select',
+      '#default_value' => $this->getSetting('image_style'),
+      '#empty_option' => $this->t('None (original image)'),
+      '#options' => $image_styles,
+      '#description' => $description_link->toRenderable() + [
+        '#access' => $this->currentUser->hasPermission('administer image styles'),
+      ],
+    ];
+
     return $element;
   }
 
@@ -43,8 +124,22 @@ class ImageUrlFormatter extends ImageFormatter {
    * {@inheritdoc}
    */
   public function settingsSummary() {
-    $summary = parent::settingsSummary();
-    return [$summary[0]];
+    $summary = [];
+
+    $image_styles = image_style_options(FALSE);
+    // Unset possible 'No defined styles' option.
+    unset($image_styles['']);
+    // Styles could be lost because of enabled/disabled modules that defines
+    // their styles in code.
+    $image_style_setting = $this->getSetting('image_style');
+    if (isset($image_styles[$image_style_setting])) {
+      $summary[] = $this->t('Image style: @style', ['@style' => $image_styles[$image_style_setting]]);
+    }
+    else {
+      $summary[] = $this->t('Original image');
+    }
+
+    return array_merge($summary, parent::settingsSummary());
   }
 
   /**

core/modules/image/tests/src/Functional/ImageFieldDisplayTest.php

@@ -216,6 +216,9 @@ class ImageFieldDisplayTest extends ImageFieldTestBase {
       $this->drupalLogout();
       $this->drupalGet(ImageStyle::load('thumbnail')->buildUrl($image_uri));
       $this->assertSession()->statusCodeEquals(403);
+
+      // Log in again.
+      $this->drupalLogin($this->adminUser);
     }
 
     // Test the image URL formatter without an image style.
@@ -230,6 +233,18 @@ class ImageFieldDisplayTest extends ImageFieldTestBase {
     $display_options['settings']['image_style'] = 'thumbnail';
     $expected_url = \Drupal::service('file_url_generator')->transformRelative(ImageStyle::load('thumbnail')->buildUrl($image_uri));
     $this->assertEquals($expected_url, $node->{$field_name}->view($display_options)[0]['#markup']);
+
+    // Test the settings summary.
+    $display_options = [
+      'type' => 'image_url',
+      'settings' => [
+        'image_style' => 'thumbnail',
+      ],
+    ];
+    $display = \Drupal::service('entity_display.repository')->getViewDisplay('node', $node->getType(), 'default');
+    $display->setComponent($field_name, $display_options)->save();
+    $this->drupalGet("admin/structure/types/manage/" . $node->getType() . "/display");
+    $this->assertSession()->responseContains('Image style: Thumbnail (100×100)');
   }
 
   /**