Swup with svg xlink

Question

I can't get Swap to work with xlinks.

I tried to create page transitions with Swup. Things work ok with normal <a href="/secondpage.html"> tags, but inside svg I need to use <a xlink:href="/secondpage.html">.

From Swup documentation I found that xlinks should work as a selectors.

'LINK_SELECTOR: 'a[href^="/"]:not([data-no-swup]), a[href^="#"]:not([data-no-swup]), a[xlink\\:href]'

Any ideas on how to get Swup to work with SVG xlinks?

Answer 1

Did you figure this out already? For xlink in svg files use:

svg a[*|href]

So:

linkSelector: 'a[href^="/"]:not([data-no-swup]), a[href^="#"]:not([data-no-swup]), asvg a[*|href]'

Credit goes to daun on the Swup github.