自定义事件不会在Puppeteer中触发

Question

我正在创建一个将HTML输入导出为PDF的工具。要对文件进行分页，我使用的是Paged.js polyfill。此polyfill在加载DOM内容后开始，我需要等待它完成才生成PDF。为此，我在HTML输入文件中定义了一个自定义事件，如下所示：

<script>
    window.PagedConfig = {
        after: (flow) => {
            console.log(`After polyfill | total pages: ${flow.total} | performance: ${flow.performance} `);
            document.dispatchEvent(new CustomEvent('polyfillFinished'));
        }
    };
</script>

在浏览器中打开HTML文件时，此事件会触发，但是当我等待使用Puppeteer的evaluateOnNewDocument函数触发事件时，该事件几乎在事件触发之前就连续进行。人偶代码基于custom event example，如下所示：

try {
    const browser = await puppeteer.launch();
    const page = await browser.newPage();
    page.on("console", (msg) => console.log("Page log:", msg.text()));

    // Define a window.onCustomEvent function on the page.
    await page.exposeFunction("onCustomEvent", (e) => {
        console.log(`${e.type} fired`, e.detail || "");
    });

    /**
     * Attach an event listener to page to capture a custom event on page load/navigation.
     * @param {string} type Event name.
     * @return {!Promise}
     */
    function listenFor(type) {
        return page.evaluateOnNewDocument((type) => {
            document.addEventListener(type, (e) => {
                window.onCustomEvent({ type, detail: e.detail });
            });
        }, type);
    }

    await page.goto(options.input);

    await listenFor("polyfillFinished"); // Listen for "polyfillFinished" custom event on page load.

    /* ... Generate PDF ... */

} catch (err) {
    console.error("An error occurred while generating output: ", err);
}