IntersectionObserver constructor throws TypeError due to document being a proxy

[ato]

Expected behavior

https://www.mirandaluby.com/ (hosted on https://www.journoportfolio.com/) should fully replay

What actually happened

1. Visit https://www.mirandaluby.com/ with pywb in live replay mode (or replay a Browsertrix crawl of it).
2. Page is blank after the nav bar.

Checking the JS console a TypeError is thrown in the following call:

new IntersectionObserver(function(entries, observer) {...}, 
    { root: document, rootMargin: "0px 0px 0px 0px" });

Exception in Chrome:

scripts.js:26 Uncaught TypeError: Failed to construct 'IntersectionObserver': Failed to read the 'root' property from 'IntersectionObserverInit': The provided value is not of type '(Document or Element)'. at scripts.js:26:27 at scripts.js:304:3

Exception in Firefox:

Uncaught TypeError: IntersectionObserver constructor: 'root' member of IntersectionObserverInit could not be converted to any of: Element, Document. journoPortfolio scripts.js:26

scripts.js:304

I set a breakpoint and checked the value of document on both the live site and during replay. During replay it's a Proxy(HTMLDocument) and on live site it's a plain HTMLDocument. So seemingly the problem is we're using a proxy to hook document and IntersectionObserver won't accept Proxy(HTMLDocument) as a value for the root option.

Browser

Desktop

• OS: Linux
• Browser Chrome
• Version 121.0.6167.139

Desktop

• OS: Linux
• Browser Firefox
• Version 123.0b9

[ikreymer]

This is actually wombat issue. This can be fixed similar to other APIs - need to override the IntersectionObserver constructor and 'de-proxy' the options.root parameter.

[ikreymer]

Fixed in 3.7.1. Tested in wabac.js and pywb live proxy modes.

[ato]

Thanks for the fix. Much appreciated. Confirming that with pywb 2.7.4 + wombat 3.7.1 the page content now displays for the WARC we discovered this issue on.