Use does not display content on the link, what should I do?

Question

Pug

Hello, I ran into such a problem: I made a separate svg file ...

<svg class="d-none" aria-hidden="true">
    <symbol id="icon-logo" viewBox="0 0 512 512">
        <path d="*секрет*" />
    </symbol>
</svg>

...and inserted it via iframe...

iframe.js-iframeSvg(src="./assets/svg/icons.svg", onload="this.before(this.contentDocument.children[0]); this.remove();")

... eventually use stopped working...

svg(alt="*что-то*").d-block.p-centered.icon-4rem
   use(xlink:href="#icon-logo")

...and looks like this after assembly:

<svg class="d-block p-centered icon-4rem" alt="*что-то*">
    <use xlink:href="#icon-logo">
        #shadow-root (closed)
    </use>
</svg>

It’s still not clear what’s going on, and I also ask you to explain how use works, thanks)