Function diffProps

packages/rrdom/src/diff.ts:332–371

(
  oldTree: HTMLElement,
  newTree: IRRElement,
  rrnodeMirror: Mirror,
)

}

function diffProps(
  oldTree: HTMLElement,
  newTree: IRRElement,
  rrnodeMirror: Mirror,
) {
  const oldAttributes = oldTree.attributes;
  const newAttributes = newTree.attributes;

  for (const name in newAttributes) {
    const newValue = newAttributes[name];
    const sn = rrnodeMirror.getMeta(newTree) as elementNode | null;
    if (sn?.isSVG && NAMESPACES[name])
      oldTree.setAttributeNS(NAMESPACES[name], name, newValue);
    else if (newTree.tagName === 'CANVAS' && name === 'rr_dataURL') {
      const image = document.createElement('img');
      image.src = newValue;
      image.onload = () => {
        const ctx = (oldTree as HTMLCanvasElement).getContext('2d');
        if (ctx) {
          ctx.drawImage(image, 0, 0, image.width, image.height);
        }
      };
    } else if (newTree.tagName === 'IFRAME' && name === 'srcdoc') continue;
    else {
      try {
        oldTree.setAttribute(name, newValue);
      } catch (err) {
        // We want to continue diffing so we quietly catch
        // this exception. Otherwise, this can throw and bubble up to
        // the `ReplayerEvents.Flush` listener and break rendering
        console.warn(err);
      }
    }
  }

  for (const { name } of Array.from(oldAttributes))
    if (!(name in newAttributes)) oldTree.removeAttribute(name);
  newTree.scrollLeft && (oldTree.scrollLeft = newTree.scrollLeft);
  newTree.scrollTop && (oldTree.scrollTop = newTree.scrollTop);
}

function diffChildren(
  oldTree: Node,