Access to path of icon (ha-svg-icon)

[AmoebeLabs]

Intro

I have no idea where to post this question, but I think this can only be answered by a developer 😄

If it should be posted elsewhere, let me know!

Background

While developing svg based cards, Icons are a problem in Safari caused by long-standing bugs (9 years or more), so probably no chance that Apple will suddenly solve these problems/bugs/features.

One example of the rendering bugs with icons:

Bugs:

• All squares (div with border color) should be white, instead of black or partially being black/white
• The right icon should also be orange, but just doesn't update/render properly. If I draw a hidden circle around it, it DOES render!

To solve this, I need access to the svg path of the icon:

The code:

return html`
  <ha-card>
    <div class="container" id="container">
      <div class="icon">
        <ha-icon id="flash" icon="mdi:flash"></ha-icon>
	<ha-icon id="lock" icon="mdi:lock-outline"></ha-icon>								
      </div>
    </div>
  </ha-card>
    `;

Problem

I can't access the path, as the shadowRoot appears to be empty using Javascript, but contains data according to the Chrome inspector:

  // Works:
  this.icons = {};
  this.icons.lock = this.shadowRoot.getElementById("lock");
  this.icons.lock.shadow = this.shadowRoot.getElementById("lock").shadowRoot;

  // Does NOT work, returns null		
  this.icons.lock.svg = this.icons.lock.shadowRoot.querySelector("*");
  childNodes = Array.from(this.icons.lock.shadowRoot.childNodes);
  classname = this.icons.lock.shadowRoot.getElementsByClassName("ha-svg-con");

If have absolutely NO idea what is going wrong. I know the ha-icon is a custom LitElement class with properties like path.
It might be my limited knowledge of html though...

I hope anyone can help me...

[bramkragten]

This belongs in our dev discord channel, not in the feature requests section (or issues)

Something like:

this.querySelector("ha-icon").shadowRoot.querySelector("ha-svg-icon").path

You could also get them from the indexed db:

[AmoebeLabs]

Thanx Bram. I will check this, and go to the discord channel if I have more questions. Never been there, as I always could find my answers on stackexchange or mozilla's help pages...