fix: avoid read-only srcdoc assignment in iframe hook

packages/fingerprint-injector/src/utils.js

@@ -113,13 +113,13 @@
                         makeHandler().getterValue(overrideObj[key]),
                     );
                 } catch (e) {
                     console.debug(e);
                     // console.error(`Could not override property: ${key} on ${instance}. Reason: ${e.message} `); // some fingerprinting services can be listening
                 }
             }
         });
     } catch (e) {
         console.error(e);
     }
 }
 
@@ -358,7 +358,7 @@
         addProxy(WebGLRenderingContext.prototype, 'getParameter');
         addProxy(WebGL2RenderingContext.prototype, 'getParameter');
     } catch (err) {
         console.warn(err);
     }
 }
 
@@ -422,7 +422,7 @@
             canPlayType,
         );
     } catch (e) {
         console.warn(e);
     }
 };
 
@@ -445,7 +445,7 @@
             );
         }
     } catch (e) {
         console.warn(e);
     }
 }
 
@@ -468,7 +468,7 @@
             },
         });
     } catch (e) {
         console.warn(e);
     }
 }
 
@@ -507,7 +507,7 @@
     try {
         overrideScreenByReassigning(window, props);
     } catch (e) {
         console.warn(e);
     }
 }
 
@@ -516,7 +516,7 @@
         // FIX THIS = non-zero values here block the injecting process?
         // overrideScreenByReassigning(window.document.body, props);
     } catch (e) {
         console.warn(e);
     }
 }
 
@@ -606,7 +606,7 @@
             });
         }
     } catch (e) {
         console.warn(e);
     }
 }
 
@@ -710,13 +710,14 @@
                 },
                 set(newValue) {
                     addContentWindowProxy(this);
+                    const srcdoc = `${newValue}`;
                     // Reset property, the hook is only needed once
                     Object.defineProperty(iframe, 'srcdoc', {
                         configurable: false,
                         writable: false,
-                        value: _srcdoc,
+                        value: srcdoc,
                     });
-                    _iframe.srcdoc = newValue;
+                    _iframe.setAttribute('srcdoc', srcdoc);
                 },
             });
             return iframe;
@@ -787,7 +788,7 @@
             fixPluginArray();
         }
     } catch (e) {
         console.error(e);
     }
 }
 

test/fingerprint-injector/fingerprint-injector.test.ts

@@ -91,6 +91,48 @@ describe('FingerprintInjector', () => {
         // eslint-disable-next-line dot-notation
         expect(fpInjector['utilsJs']).toBeTruthy();
     });
+
+    test('should preserve iframe srcdoc after installing contentWindow fix', async () => {
+        const browser = await chromium.launch();
+
+        try {
+            const page = await browser.newPage();
+            // eslint-disable-next-line dot-notation
+            const utilsJs = fpInjector['utilsJs'];
+            const result = await page.evaluate((utils) => {
+                const script = document.createElement('script');
+                script.textContent = `${utils}\nfixIframeContentWindow();`;
+                document.documentElement.append(script);
+                script.remove();
+
+                const iframe = document.createElement('iframe');
+                (document.body ?? document.documentElement).append(iframe);
+
+                const srcdoc = '<p id="loaded">loaded</p>';
+                let errorMessage: string | null = null;
+
+                try {
+                    iframe.srcdoc = srcdoc;
+                } catch (error) {
+                    errorMessage =
+                        error instanceof Error ? error.message : String(error);
+                }
+
+                return {
+                    attribute: iframe.getAttribute('srcdoc'),
+                    errorMessage,
+                    property: iframe.srcdoc,
+                };
+            }, utilsJs);
+
+            expect(result.errorMessage).toBeNull();
+            expect(result.attribute).toBe('<p id="loaded">loaded</p>');
+            expect(result.property).toBe('<p id="loaded">loaded</p>');
+        } finally {
+            await browser.close();
+        }
+    });
+
     // @ts-expect-error test only
     describe.each(cases)('%s', (frameworkName, testCases) => {
         // @ts-expect-error test only