Can select element in devtools but not puppeteer

Question

I'm working with puppeteer. I want to get the node value of a selected element in a textbox . Using dev tools I have copied the selector:

  var mySelector = "div.chosen-container.chosen-container-multi.filter-main-values.fmd-values.chosen-container-active.chosen-with-drop > ul > li.search-choice > span";

I can use this to find it in devtools:

But after running my puppeteer code:

  var selectedCountry = await page.evaluate((mySelector) => {return Array.from(document.querySelectorAll(mySelector))});
  console.log(selectedCountry);

In the vs code debug window, I see:

(0) []

What am I doing wrong?

Answer 1

You are not passing the selector to the evaluate function properly.

var selectedCounty = await page.evaluate((selectedCountySelector) => {

  return Array.from(document.querySelectorAll(selectedCountySelector))

}, selectedCountySelector); // <-- pass it here

console.log(selectedCounty);