木偶人无法选择属性tabindex

问题描述

在puppeteer page.select with multiple class doesn't seem to work之后，我现在想按tabindex选择第二个下拉列表，但它不起作用

      await page.goto('https://jsitor.com/c0rM-YohL', {
         waitUntil: 'networkidle0',
      });

      const iframeSelector = '.iframe-container iframe';

      await page.waitForSelector(iframeSelector, {
          visible: true
      });

      const frameHandle = await page.$(iframeSelector);
      const frame = await frameHandle.contentFrame();

      await frame.type(".test-element.Input", "test input");
      let selected = await frame.select(".test-element.Dropdown [tabindex='2']", "test4");
      console.log('selected', selected);

推荐答案

请确保class selectors和attribute selectors之间没有空格：

这样：

let selected = await frame.select(".test-element.Dropdown[tabindex='2']", 'test4')

结果为：

selected [ 'test4' ]

注意：您可以通过在$()中键入选择器在Chrome DevTools控制台中自己测试CSS选择器。例如，如果您在IFRAME(！)内单击键入$(".test-element.Dropdown [tabindex='2']")它将返回null，而$(".test-element.Dropdown[tabindex='2']")将返回select.test-element.Dropdown。