代码之家  ›  专栏  ›  技术社区  ›  unknownymouse

在facebook messenger上使用Puppeter时,没有用于选择器的节点

  •  1
  • unknownymouse  · 技术社区  · 7 年前

    我正在使用Puppeter为我的家庭项目制作一个Facebook messenger api(类似)。

    到目前为止,我可以使用Puppeter成功登录我的帐户。

    当我想在登录后自动操作时,真正的问题就开始了。

    我无法单击任何元素。


    例如 :

    我想点击“我”小图标 :

    enter image description here

    然后我复制了选择器 :

    enter image description here

    我在conso中发现以下错误 le公司 :

    (node:4771) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): AssertionError [ERR_ASSERTION]: No node found for selector: #cch_feb64f1b00e628 > div._5742 > ul > li:nth-child(4) > a > div > svg
    (node:4771) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
    

    密码 :

    const puppeteer = require('puppeteer');
    
    (async function() {
    
        // This function is used to login into the account.
        async function login() {
            console.log('=====In Login=====');
            const email = '#email';
            const pass = '#pass';
            const submit = '#loginbutton';
            await page.waitFor(3000);
            await page.click(email);
            await page.waitFor(2000);
            await page.keyboard.type('not_a_real_email@mail.com');
            await page.waitFor(2000);
            await page.click(pass);
            await page.waitFor(2000);
            await page.keyboard.type('not_a_real_password');
            await page.waitFor(2000);
            await page.click(submit);
            return 0;
        }
    
        const browser = await puppeteer.launch({ headless: false });
        const page = await browser.newPage();
    
    
        page.on('load', () => console.log('=====Page loaded!====='));
    
        await page.goto('https://messenger.com');
        await login();
        await page.waitForNavigation();
        await page.waitFor(3000); // I'm waiting just for safe side to make sure the element is loaded.
    
        // This is the line where the 'i' is clicked.
        // This is the line error occurs.
        await page.click(
            '#cch_feb64f1b00e628 > div._5742 > ul > li:nth-child(4) > a > div > svg'
        );
    
    })();
    

    因此,根据上述错误,我知道选择器是错误的。那么正确的选择器是什么?不仅如此,当我在其他元素(如表情符号元素)上尝试时,也会遇到同样的错误。

    1 回复  |  直到 7 年前
        1
  •  5
  •   bsam    7 年前

    问题似乎是您正在使用的选择器是在运行时动态生成的,并且会在每次页面刷新时更改。假设您只想单击I(info)按钮,下面使用数据testid的单击/选择器对我有效:

    await page.click(
        '[data-testid="info_panel_button"]'
    );
    

    如果您想测试顶部的其他图标,很遗憾,它们似乎没有相同的数据testid,这意味着它们的选择将更具挑战性。

    完整示例

    const puppeteer = require('puppeteer');
    
    (async function() {
    
      // This function is used to login into the account.
      async function login() {
        console.log('=====In Login=====');
        const email = '#email';
        const pass = '#pass';
        const submit = '#loginbutton';
        await page.waitFor(3000);
        await page.click(email);
        await page.waitFor(2000);
        await page.keyboard.type('not_a_real_email@mail.com');
        await page.waitFor(2000);
        await page.click(pass);
        await page.waitFor(2000);
        await page.keyboard.type('not_a_real_password');
        await page.waitFor(2000);
        await page.click(submit);
        return 0;
      }
    
      const browser = await puppeteer.launch({ headless: false });
      const page = await browser.newPage();
    
    
      page.on('load', () => console.log('=====Page loaded!====='));
    
      await page.goto('https://messenger.com');
      await login();
      await page.waitForNavigation();
      await page.waitFor(3000); // I'm waiting just for safe side to make sure the element is loaded.
    
      // This is the line where the 'i' is clicked.
      // This is the line error occurs.
      await page.click(
          '[data-testid="info_panel_button"]'
      );})();