[PP-1] drupal_image() should provide the required #alt parameter

Created on 10 May 2023, over 1 year ago
Updated 11 February 2024, 10 months ago

Split-off from 🐛 drupal_image() needs #width / #height values for fully working image cache scale, lazy-loading and img attributes RTBC see the issue summary for details.

Problem/Motivation

TL;DR:
Drupal expects image to have an #alt value at first-level and not only (as currently shown in docs) as HTML attribute:

/**
 * Implements hook_theme().
 */
function image_theme() {
  return [
    // Theme functions in image.module.
    'image_style' => [
      // HTML 4 and XHTML 1.0 always require an alt attribute. The HTML 5 draft
      // allows the alt attribute to be omitted in some cases. Therefore,
      // default the alt attribute to an empty string, but allow code using
      // '#theme' => 'image_style' to pass explicit NULL for it to be omitted.
      // Usually, neither omission nor an empty string satisfies accessibility
      // requirements, so it is strongly encouraged for code using '#theme' =>
      // 'image_style' to pass a meaningful value for the alt variable.
      // - http://www.w3.org/TR/REC-html40/struct/objects.html#h-13.8
      // - http://www.w3.org/TR/xhtml1/dtds.html
      // - http://dev.w3.org/html5/spec/Overview.html#alt
      // The title attribute is optional in all cases, so it is omitted by
      // default.
      'variables' => [
        'style_name' => NULL,
        'uri' => NULL,
        'width' => NULL,
        'height' => NULL,
        'alt' => '',
        'title' => NULL,
        'attributes' => [],
      ],
    ],

Hooks and modules depending on that value, also check for that, e.g. responsive_image:

$attributes['alt'] = $item->alt;

Setting the alt attribute as HTML attribute is passing around the Drupal Core logic and should not be done.

Steps to reproduce

Proposed resolution

  • Introduce a new $alt parameter for drupal_image(), which sadly has to be added to the end to not break existing installations, but can be used with Twig Named Arguments, which mitigates the problem.
  • Change the doc examples accordingly to use that parameter instead of the HTML attribute

Remaining tasks

User interface changes

API changes

Data model changes

📌 Task
Status

Postponed

Version

3.0

Component

Code

Created by

🇩🇪Germany Anybody Porta Westfalica

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

  • Issue created by @Anybody
  • Open on Drupal.org →
    Core: 10.1.x + Environment: PHP 8.1 & MariaDB 10.3.22
    last update over 1 year ago
    Not currently mergeable.
  • @anybody opened merge request.
  • Open in Jenkins → Open on Drupal.org →
    Core: 10.1.x + Environment: PHP 8.1 & MariaDB 10.3.22
    last update over 1 year ago
    11 pass
  • Open in Jenkins → Open on Drupal.org →
    Core: 10.1.x + Environment: PHP 8.1 & MariaDB 10.3.22
    last update over 1 year ago
    10 pass, 1 fail
  • Status changed to Needs review over 1 year ago
  • 🇩🇪Germany Anybody Porta Westfalica

    Here we go! :)

    Once 🐛 Fix failing test since Drupal 10.1.x Closed: outdated is merged, the test will work and the alt attribute will be placed correctly for all of the three image types.

  • Status changed to Postponed over 1 year ago
  • 🇩🇪Germany Anybody Porta Westfalica

    Let's postpone this on the more important parent issue for now. Afterwards this will need a rebase to integrate.

  • 🇷🇺Russia Chi

    alt is not required as it has default value which is empty string.

    The alternative text could be easily set via attribute parameter.

    {{ drupal_image('public://ocean.jpg', {alt: "The ocean"}) }}
    

    If we add a dedicated parameter for alt attribute then we have to do same for other attributes listed in image_theme()

    • width
    • height
    • title

    I think it's better just copy the values from attribute array to top level.
    Something like this

    $build['#alt'] = $attributes['alt'] ?? '';
    
Production build 0.71.5 2024