Feather Icons not showing in CMS

[jamiewade]

Describe the bug

When I create an Icon Picker field and use Feather Icons as the icon type, they do not show in the CMS:

The selected icon does sometimes show when the dropdown field is closed:

I'm not seeing any console errors.

Steps to reproduce

1. Create an Icon Picker field with the Feather Icons icon type
2. View the field in the CMS

Craft CMS version

4.5.13

Plugin version

2.0.16

Multi-site?

No

Additional context

No response

[engram-design]

Strange, that's showing correctly for me

One thing that might be an issue is the speed at which the remote font is loaded and initialized. You can see how with initialize the icons here

I'm wondering if the call to feather.replace(); might be not the best approach here.

Just for fun, can you modify the timeout to something like (like 5000 for 5s) here and try again?

[engram-design]

Closing due to inactivity.

[MatoTominac]

I'm confirming this bug. I think it usually happens when the icon fields opens in a slideout:

But even if it's not open in a slideout it gets buggy, I made a recording: https://www.awesomescreenshot.com/video/43230182?key=7d853cb8cd4931fb7ba7451b7096fba4

I have tried changing the timeout like you suggested but it did not help

[engram-design]

Slideouts can be a little problematic for icons, but also something we should be factoring in. Interesting to see that it's also happening outside of a slideout too.

But I think I also know the issue, and that's due to us calling feather.replace() multiple times to replace the data-feather attributes on elements with their actual SVG. Seems like the library doesn't really support that. I'll need to investigate some alternative approaches!