Puppeteer - Using page.select() when the ID starts with a digit

Question

I want to select an option in this dropdown list.

<select id="2a08e407-30aa-4c0f-9786-d94246cc524c" name="hours">
  <option value="00">00</option>
  <option value="01">01</option>
</select>

I've tried doing it as followed.

await page.select('#2a08e407-30aa-4c0f-9786-d94246cc524c', '00']); 

But it fails.

UnhandledPromiseRejectionWarning: Error: Evaluation failed: DOMException: Failed to execute 'querySelector' on 'Document': '#308091e2-9283-4663-9e87-5fb1137fb433' is not a valid selector.

I think this is because the ID starts with a digit. How could I solve this?

Some more details:

• This ID is generated every time I'm loading the page (so it's different at each run). I'm extracting it every time I'm loading the page with the following:

const selectorHour = (await page.$x(
   "//select[@name='hours']"
))[0];
const idSelectorHour = await (await selectorHour.getProperty('id')).jsonValue();
await page.select('#' + idSelectorHour, '00']); 

• I'm pretty sure the problem comes from the fact it starts with a digit, because every time the ID starts with a letter, it works perfectly fine.

Answer 1

yes, it's because number is not a valid CSS selector.

Try attribute selector:

await page.select(`[id="${idSelectorHour}"]`, '00');