Custom element icon classes no longer work properly

[UndefinedOffset]

Module version(s) affected

6.2.0

Description

When implementing an element if you defined a custom icon class such as my-custom-icon it would be applied to both the add new list and the list of blocks in use. With v6.2.0 this no longer works, in the resulting rendered button in the add new list the icon class ends up being rendered as font-icon-my-custom-icon rather than my-custom-icon, however in the existing blocks list it works fine. So css expecting that no longer matches unless you adjust either your styles to account for this change or prefix the icon in the element definition with a space.

The window.ss.config appears to have the icons correct so the issue seems to be happening somewhere downstream from there.

How to reproduce

1. Create a test block, i.e:

   class MyCustomElement extends BaseElement
   {
       private static $icon = 'my-custom-icon';
   }

2. Load an extra stylesheet into the cms to implement the custom icon, i.e:

   .my-custom-icon::before {
       background: url(path/to/my-custom-icon.svg) no-repeat center center;
   
       display: inline-block;
   
       content: "";
   
       width: 1em;
       height: 1em;
   
       vertical-align: middle;
   }

3. Note the difference between elemental 6.1.x vs 6.2.x, 6.1.x works fine in the add new menu.

Possible Solution

No response

Additional Context

Elemental 6.1.6:

Elemental 6.2.0:

Validations

• Check that there isn't already an issue that reports the same bug
• Double check that your reproduction steps work in a fresh installation of silverstripe/installer (with any code examples you've provided)