Javascript Puppeter等待页面/DOM更新-响应初始加载后添加的新项目

我想使用Puppeter来响应页面更新。 页面显示项目，当我离开页面打开时，新项目会随着时间的推移出现。 例如，每10秒添加一个新项目

我可以使用以下命令等待页面初始加载的项目：

await page.waitFor(".item");
console.log("the initial items have been loaded")

我如何等待/捕获未来的项目？ 我希望实现类似这样的功能（伪代码）：

您可以使用公开本地函数：

wait page.exposeFunction（'getItem'，函数（a）{
控制台日志（a）；
});

然后，可以使用创建并侦听在父节点内创建的新节点

本例将抓取（这只是一个想法，不是最终工作）并打印聊天中创建的新项目

var baseurl='1〕https://chat.stackoverflow.com/rooms/6/python';
const browser=wait puppeter.launch（{headless:false}）；
const page=wait browser.newPage（）；
等待page.goto（baseurl）；
等待page.exposeFunction（'getItem'，函数（a）{
控制台日志（a）；
});
等待页面。评估（（）=>{
var observer=新的突变观察者（（突变）=>{
for（突变的var突变）{
if（突变、加节点、长度）{
getItem（mutation.addedNodes[0].innerText）；
}
}
});
observer.observe（document.getElementById（“chat”），{attributes:false，childList:true，subtree:true}）；
});

谢谢！变异观察者让我走上了正确的道路。这让我想到了另一个有用的例子：

await page.goto('http://mysite');
await page.waitFor(".item");
// check items (=these initial items)

// event when receiving new items:
// check item(s) (= the additional [or all] items)