Icons not working in Vue3 while rendering with v-html

################################ index.hml #######################################
<!DOCTYPE html>
<html>
    <head>
        <title>Test</title>
    </head>
    <body>
        <div id="app">
            Element not rendered: <span v-html="faElem"></span>
            <br>
            While simple usage is working: <fa icon="fa-solid fa-envelope" />
        </div>
        <script src="js/app.js"></script>
    </body>
</html>

################################ app.js #######################################
import './bootstrap';
import { createApp } from 'vue';

// FontAwesome
import { library } from '@fortawesome/fontawesome-svg-core';
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
import { faEnvelope } from '@fortawesome/free-solid-svg-icons';
library.add(faEnvelope);

createApp({
    data() {
        return {
             faElem: `<fa icon="fa-solid fa-envelope" />`
        }
    }
})
    .component('fa', FontAwesomeIcon)
    .mount('#app');

That's what rendered

FortAwesome / vue-fontawesome

Icons not working in Vue3 while rendering with v-html #412