The starter fails to show Icons

[olli-quartal]

In windows platform, at least with umlauts in User naem / path, the starter project fails to show icons for Nodes.

Steps to reproduce:

• Take the sample as-is
• Install on a Windows computer where user name contains umlauts (e.g. "ä" or probably an special characters).
  • Not sure if this is needed for the bug to appear, but assume it would have been found otherwise.
• Build and run npm run dev
• In Add node, search for "Example" or "Git"
• Observe that the icon is missing

Reason:

The image uses full system path, in my case /icons/CUSTOM/C:\Users\OlliPerttilä\.n8n-node-cli\.n8n\custom\node_modules\n8n-nodes-quartal-hub\dist\nodes\Example\example.svg which is URL encoded automatically by the browser as http://localhost:5678/icons/CUSTOM/C:/Users/OlliPerttil%C3%A4/.n8n-node-cli/.n8n/custom/node_modules/n8n-nodes-quartal-hub/dist/nodes/Example/example.svg. Fetching this URL fails probably because there is no URL decoding on the receiving side.

Suggestions to fix:

• Allow external URLs (starting with "https://") for icons so we can use icons from CDN
• Implement the fix described here: Icons are not showing in custom nodes n8n#12944 (comment)
  • This bug was closed by @Joffcom in February. Based on comments, this bug is clearly still an issue, probably not only for these circumstanses but in many cases where there is something special in the path.
  • I have not tested the solution, but it makes sense to me
• At least URI-encode the path
  • Though generally having the full path like this in the URL is probably quite a bad idea

[Joffcom]

This doesn't appear to be an issue that can be resolved in this repository, However I can take a very quick look. Can you share the value you have set for the icon path in your node?

[olli-quartal]

I did not make any changes to the code, just package.json author etc. changes and then npm build + npm run dev

So icons are as they are in the repo:
icon: { light: 'file:example.svg', dark: 'file:example.dark.svg' },
icon: { light: 'file:../../icons/github.svg', dark: 'file:../../icons/github.dark.svg' },

...both fail

[olli-quartal]

In n8n-io/n8n#12944, there is a lot of different examples where the icon resolving is failing with CUSTOM, so perhaps it would just make sense to reopen that.

[Joffcom]

That issue looks to have been closed because there was very little information provided at the time, Also looking at it there was no information on how to actually reproduce it. We know paths generally work as seen in all the community nodes that do work and in the screenshots shared the paths have been edited to hide the information.

This is the first time we actually have a report with enough information to reproduce the problem, I have managed to do it by changing the name of one of the icon files to include a special character. Now that it can be reproduced it can be fixed.