Puppeteer 截取上一页而不是当前页面

Question

这个 Meteor 代码假设导航到 url 并截取包含列表的最后一页的屏幕截图。它按原样工作正常，但这段代码的奇怪之处在于它调用了 page.screenshot 两次，第一次没有 await，然后在 await Promise.all 中。如果我更改任何内容，它将不起作用，例如在第一个语句的开头插入 await，或删除其中一个 page.screenshot 语句，或重新排列它们。

知道为什么会发生这种情况以及如何解决这个问题吗？

import { Template } from 'meteor/templating';
import './main.html';


Template.info.events({
  'blur #approvalNo'(e, instance) {
    let approvalNo = $(e.target).val()
    Meteor.call('post99RVD', approvalNo)
  },
});


import { Meteor } from 'meteor/meteor';
const puppeteer = require('puppeteer'); //maybe change const to let

const xPath = {
  'post99':   '//*[@id="LMi3L"]',
  'inputCPA': '//*[@id="searchRVDCpaNo"]',
  'type':     '//*[@id="searchRVDType"]'
}

Meteor.methods({
  'post99RVD': async function (approvalNo='34230') {

    const browser = await puppeteer.launch({headless: false})
    const page    = await browser.newPage()    
  
    let url = 'https://myrta.com/rvd/'
    await page.goto(url)
    await page.waitForXPath(xPath.post99)

    const post1999 = await page.$x("//a[contains(., 'Post-1999 RVD search')]");
    await post1999[0].click()
    await page.waitForXPath(xPath.type)

    //Select Car in the Type drop down manu
    await Promise.all([
      page.waitForNavigation(),
      page.select("select#searchRVDType", "Car") 
    ]);
    
    //Type the approval number and click the searh button
    await page.click('#searchRVDCpaNo')
    await page.keyboard.type(approvalNo)
    
    let searchLink = await page.$('input[alt="Search"]')
    await searchLink.click()
    
    // the next line took the shot that belongs to the previous page
    page.screenshot({path: '/screen_shots/page.png'})
    await Promise.all ([
      page.waitForNavigation(),
      page.screenshot({path: '/screen_shots/page.png'})
    
    ])
    
    // browser.close()
  }
})

<template name="info">
  <input type="text" id="approvalNo" placeholder="Approval No...">

</template>

Answer 1

我怀疑您误解了 Promise.all 的工作原理。它不保证数组中元素之间的任何顺序。我怀疑你想要的只是删除 Promise.all 和 await 按顺序执行的步骤：

await page.waitForNavigation();
// only take a screenshot once navigation has completed
await page.screenshot({path: '/screen_shots/page.png'});

Puppeteer 截取上一页而不是当前页面

Puppeteer screenshot the previous instead of current page

javascript

node.js

meteor