Riot.js 4, how to mount nested tags

Question

I'm creating application in Riot.js 4 and using in-browser compilation (for prototyping), everything was working fine in Riot.js 3. However, when I use nested tags, only the root tag is mounted and not any child tags. If I mount every nested tag separately, they are mounted fine.

Minimal example is here: https://plnkr.co/edit/hxXUvmsjEgE3eDAF

<main>
    <p>main tag</p>
    <footer></footer>
</main>

<footer>
    <p>footer</p>
</footer>

riot.mount('main')

If I mount also nested component, it works, see here: https://plnkr.co/edit/UDkdZ55ynTYz9uxL

riot.mount('main')
riot.mount('footer')

What is the correct way to do this?

Answer 1

in riot you cannot use the same name of another existing tag, so, because footer is an existing tag you should change the name of "footer" component and it will work just fine! ;)