fix: Remove loading attributes from cloned iframes

This attribute causes asset discovery to hang and eventually timeout since we
don't scroll the page. Removing the attribute is ideally what we want (to load
the iframe).

src/percy-agent-client/dom.ts

@@ -169,7 +169,9 @@ class DOM {
       // rerendered and do not effect the visuals of a page
       if (clonedDOM.head.contains(cloned)) {
         cloned!.remove()
-
+      // Remove any lazy loading attributes, since they hang asset discovery
+      } else if (cloned!.getAttribute('loading')) {
+        cloned!.removeAttribute('loading')
       // if the frame document is accessible, we can serialize it
       } else if (frame.contentDocument) {
         // js is enabled and this frame was built with js, don't serialize it

test/unit/percy-agent-client/dom.test.ts

@@ -336,6 +336,7 @@ describe('DOM -', () => {
         createExample(`
           <iframe id="frame-external" src="https://example.com"></iframe>
           <iframe id="frame-input" srcdoc="<input/>"></iframe>
+          <iframe id="frame-lazy" srcdoc="<input/>" loading="lazy"></iframe>
           <iframe id="frame-js" src="javascript:void(
             this.document.body.innerHTML = '<p>made with js src</p>'
           )"></iframe>
@@ -386,6 +387,10 @@ describe('DOM -', () => {
         expect($dom('#frame-js-inject')).to.not.have.length
       })
 
+      it('removes loading attributes on iframes', () => {
+        expect($dom('#frame-lazy').attr('loading')).to.be.undefined
+      })
+
       it('does not serialize iframes with CORS', () => {
         expect($dom('#frame-external').attr('src')).to.equal('https://example.com')
         expect($dom('#frame-external').attr('srcdoc')).to.be.undefined