[Bug]: The <use> element support

[pavlogavryliuk]

Preflight Checklist

• I have searched the issue tracker for a bug report that matches the one I want to file, without success.

What package is this bug report for?

rrweb-snapshot

Expected Behavior

The element takes nodes from within the SVG document, and duplicates them somewhere else.

Example:

<svg viewBox="0 0 30 10" xmlns="http://www.w3.org/2000/svg">
  <circle id="myCircle" cx="5" cy="5" r="4" stroke="blue"/>
  <use href="#myCircle" x="10" fill="blue"/>
  <use href="#myCircle" x="20" fill="white" stroke="red"/>
</svg>

href - should not change to absolute path in this case.

Actual Behavior

RRWeb transform this href attribute to absolute path:

 // relative path in attribute
  if (name === 'src' || (name === 'href' && value)) {
    return absoluteToDoc(doc, value);
  }

All elements with is broken in replayer:

<use href="https://cas2.pipedrive.com/pipeline/1/user/everyone#icon-sm-cross" xlink:href="#icon-sm-cross"></use>

Testcase Gist URL

No response

Additional Information

I've add this changes localy to fix this.

// element should ignore href transform
if (tagName === 'use') {
  const element = n as HTMLImageElement;
  const href = element.getAttribute('href');
  if (href) {
    attributes.href = href;
  }
}

[lele0108]

@Yuyz0112 @Juice10 @pavlogavryliuk I have fixed this issue in #938