Autocapture captures the SVG tags for icons inside buttons

[apteryxxyz]

As most here will probably know, buttons and a tags can often have SVG icons in them (I'm looking at the GitHub interface right now). Currently PostHog autocapture will capture thoses SVG related elements instead of the actual button that they are within.

(This comes from my website which has a button to toggle the theme between light and dark. That button has an SVG icon and screen reader only span with "Toggle Theme", I wanna see "clicked button with text "Toggle Theme"" in PostHog logs)

What I am requesting is for when the autocapture _captureEvent function encounters a SVG element, that it bubble up until it finds one of the autocaptureCompatibleElements, and instead use that as the target.

I currently use my own fork of posthog-js with this implemented, I'd open a PR but as I see you are trying to support IE8 and I don't believe ownerSVGElement is supported there, but heres my code anyway so you get the idea.

// src/autocapture-utils.ts, uses the existing autocaptureCompatibleElements and isTag
export function isSvgElement(el: Element): boolean {
    return (
        autocaptureCompatibleElements.indexOf(el.tagName.toLowerCase()) === -1 &&
        (isTag(el, 'svg') || !!(el as any).ownerSVGElement)
    )
}

// src/autocapture.ts, inside the _captureEvent function
while (target && isSvgElement(target)) {
  target = target.parentNode as Element | null
}