menu_link_attributes 8.x-1.10

Menu Link Attributes 8.x-1.10

How we got here

• 8.x-1.8 was a security release. Update 8004 removes attribute definitions whose names are not valid HTML attribute names, so they can no longer be rendered unsafely. It also removed two kinds of attributes it should have kept:
  • Container attributes such as container_class.
  • Attributes whose names were only invalid because of underscores, such as menu_color.
• 8.x-1.9 restores the container attributes removed by 8.x-1.8 (#3590635).
• 8.x-1.10 handles attribute names with underscores. Instead of removing them, it renames them to use hyphens, for example menu_color → menu-color (#3590636).

What happens when you update

After running drush updb, export your configuration (drush cex) and check the attributes in your menu_link_attributes.config. If you spot any updated attribute names, front-end changes might be needed (see below).

Coming from 8.x-1.7 or earlier:

• Update 8004 renames attribute definitions with underscores in place, keeping their labels, options and order.
• A post update renames the values stored on menu links, including translations.

Coming from 8.x-1.8 or 8.x-1.9, where 8004 already ran:

• A post update renames the values stored on menu links, including translations.
• It also re-adds the definitions that were removed. Their labels, descriptions and options were lost in 8.x-1.8 and had to be re-entered on the configuration form.
• Empty duplicate container_* definitions created by 8.x-1.9 were removed.

The update output lists every renamed attribute. A warning is also logged to watchdog for sites that do not read update output.

⚠️ Front-end changes may be needed

If you in the past used Menu Link Attributes to set custom attributes with names with underscores, the rendered HTML now changes automatically:

<!-- Before -->
<a href="/about" menu_color="red">About</a>
<!-- After -->
<a href="/about" menu-color="red">About</a>

Any front-end code targeting the old names stops working. This includes CSS selectors ([menu_color]), JavaScript (getAttribute('menu_color'), dataset) and Twig templates. If these attributes are used for anything important, such as styling, tracking or behaviour, update those references manually.

The config form no longer accepts underscores in attribute names. It suggests the hyphenated name instead.

Name collisions

If both versions of a name exist, for example menu_color and menu-color, only the hyphenated one is kept:

• In configuration: the definition with the underscore is removed, and the update output lists it under "Removed unsafe menu link attributes".
• On menu links: if a link has values under both names, the value stored under the hyphenated name is kept and the one with the underscore is dropped.