在干凈的chrome / puppeteer上下文中運行JavaScript

Question

我試圖在內容抓取作為目標的頁面上下文中運行JavaScript。 使用puppeteer，我可以輕松調用evaluate()並在頁面上下文中運行一段JavaScript。 所以我基本上只是評估頁面上的document.querySelector ：

const puppeteer = require('puppeteer');
const url = 'file:///C:/Users/roel/puppettest/index.html';

puppeteer.launch({headless: false}).then(async browser => {
    const page = await browser.newPage();
    await page.goto(url, {waitUntil: 'domcontentloaded'});
    const value = await page.evaluate(() => document.querySelector('div').textContent);
    if (value === 'Hello') {
        console.log('Works');
    } else {
        console.log('Nope :-(');
    }
});

這是我提到的頁面：

<html>
    <body>
        <div>Hello</div>
        <script>
            var div = document.createElement('div');
            div.textContent = 'Whooh!';
            document.body.appendChild(div);
            document.querySelector = null;
        </script>
    </body>
</html>

所以這就是問題所在：我評估的代碼運行了一個document.querySelector ，但我加載的頁面將其設置為null 。 隨之而來的是混亂。 所以...... 我想確保我運行的JavaScript運行在干凈的上下文中 。

第一個想法：

我可以檢索生成的HTML並圍繞DOM創建一個新的JavaScript上下文。 運行page.content()來檢索HTML和...哦，它不是當前的HTML，它是最初的HTML（例如， document.createElement()沒有執行）。 運行page.evaluate(() => document.body.innerHTML)可以正常工作，假設頁面沒有在document body屬性上添加Object.defineProperty 。 但是沒有這樣的保證。 有沒有辦法在不觸及JS上下文的情況下檢索當前的HTML？

第二個想法：

Chrome擴展程序在自己的JavaScript上下文中運行，可以訪問DOM，只能訪問DOM。 這正是我所追求的。 查看puppeteer文檔，沒有跡象表明在木偶操縱者本身中創建這樣的上下文。 或者在那里我錯過了嗎？

...

那么我該如何獲得一個干凈的JS上下文來運行查詢呢？

編輯我讀了.content()的輸出錯誤。 包含HTML。 所以，第一個想法確實有效。 如果第二個想法可以實現，我仍然很好奇，因為它更受歡迎。

Answer 1

您可以使用.content()在當前時間點檢索HTML。 編輯前的問題錯誤地認為.content()返回了原文。 將生成的HTML運行到jsdom允許您在DOM上執行JS而不受原始頁面的影響。

在干凈的chrome / puppeteer上下文中運行JavaScript

問題描述

第一個想法：

第二個想法：

1 個解決方案

解決方案1
0 已采納 2018-01-23 19:59:53

在干凈的chrome / puppeteer上下文中運行JavaScript

問題描述

第一個想法：

第二個想法：

1 個解決方案

解決方案1 0 已采納 2018-01-23 19:59:53

解決方案1
0 已采納 2018-01-23 19:59:53