puppeteerにmutationobserverを注入するには

Question

ヘッドレスクロムでmutationobserverのようなトレースを変更したDOMを欲しいです。 私は人形劇の図書館を学んでいますが、その使い方はわかりません。

人形の中でDOMの変化を追跡することは可能ですか？ありがとう

Answer 1

まあ、カスタムコードをブラウザに注入できます。

一つの方法：あなたのノードのスクリプトで

await page.evaluate(() => { 
    const observer = new MutationObserver(
    function() { 
    // communicate with node through console.log method 
    console.log('__mutation') 
    } 
    ) 
    const config = { 
    attributes: true, 
    childList: true, 
    characterData: true, 
    subtree: true 
    } 
    observer.observe(target, config) 
}) 

：

page.on('console', async (msg) => { 
    if (msg.text === '__mutation') { 
    // do something... 
    } 
})