puppeteer 评估不接受 JSHandles 或 ElementHandles 作为变量的函数

Question

我可以很好地传递本机对象（字符串、列表、数字等），但是每当我尝试传递 JSHandle 或 ElementHandle 时，我都会收到以下错误消息：“ TypeError: Converting circular structure to JSON Are you pass a nested JSHandle?在 JSON.stringify() "

这是我的代码：

    async getColumnsNames(id='dashboardGrid') {

    await this.loadObjects();

    const grid = this.table

    const detectedColumns = await this.page.evaluate(({grid}) => {

        //const grid = document.getElementById(id)

        const header = grid.getElementsByClassName('ag-header-viewport')[0]

        const labelRow = header.getElementsByClassName('ag-header-row')[0]

        const cells = labelRow.getElementsByClassName('ag-header-cell-text')

        var children = []

        for(x = 0; x < cells.length; x++) {

             cells[x].innerText.length > 0 ? children.push(cells[x].innerText) : null

        }

        return children

    }, {grid});

    console.log(detectedColumns)

}

所以如果我通过'id'来获取'grid'元素内部，没问题（它是一个CSS选择器），但如果我尝试直接传递一个句柄（grid），我会得到那个错误消息。

所说的句柄正是这样的：

this.table = await this.page.$(this.tableID);

这完全适用于检测相应的 DOM 元素（this.tableID 是'[id="dashboardGrid"]'），所以我知道句柄不是问题。

Answer 1

问题是，当您像这样构建第一个参数时{grid}，生成的对象不是 的实例JSHandle，因此评估不会正确处理它。这应该工作const detectedColumns = await this.page.evaluate(grid => {//Some code}, grid);