Clicking button using inner text

Question

I am using puppeteer to click a button that does not have a generic id. I have attached a screenshot of the DOM with an arrow showing the button element. I have tried the following code to no avail:

    await page.evaluate(() => {
  let btns1 = [...document.querySelector("typeaheadDropdownWrapped-0").querySelectorAll("button")];
  btns1.forEach(function (btn) {
    if (btn.innerText == "@jubaitca")
              btn.click();

  });
  });

@jubaitca is a known text that can be used to identify the button. Can anyone help?

DOM

Does this answer your question? [Puppeteer: Click on element with text](https://stackoverflow.com/questions/47407791/puppeteer-click-on-element-with-text) — Thomas Dondorf, Dec 22 '19 at 18:46
No it doesn't because the text is not a inner text of the button but rather a few levels underneath the button element — sayan, Dec 22 '19 at 18:58
Please select my answer in the previous question as correct. Thank you — Edi Imanto, Dec 23 '19 at 08:57
That does not work. Please refer to the DOM I attached. I am trying to click the button node that has a children node with innertext "@jubaitca" — sayan, Dec 24 '19 at 03:02

Edi Imanto · Accepted Answer · 2019-12-25T15:36:47.167

0

I don't see any @jubaitca inside the HTML DOM screenshot. But if it's inside this selector, then maybe this code will work. Your selector should be like this:

await page.evaluate(() => {
    document.querySelectorAll('[role="progressbar"] ~ div > [role="button"]').forEach(elem => {
        if (elem.innerText.search('jubaitca') > -1) {
            elem.click()
        }
    })
})

edited Dec 25 '19 at 15:36

answered Dec 24 '19 at 05:51

Edi Imanto

2,119
1
11
17

@jubaitca is in the very last line in the dom – sayan Dec 24 '19 at 14:41
also the code doesn't work, i get the following error: `(node:25908) UnhandledPromiseRejectionWarning: ReferenceError: typeaheadFocus is not defined at c:\Users\sayan\Documents\pup test\index.js:62:7 at processTicksAndRejections (internal/process/task_queues.js:85:5)` – sayan Dec 24 '19 at 14:50
Please write more detailed code, because i don't see any typeaheadFocus inside your code above. – Edi Imanto Dec 24 '19 at 15:01
Sorry please ignore that error. I do not get any error but the button does not get clicked. – sayan Dec 24 '19 at 16:12
I'm sorry, but if you're not provide more code, or any URL, i can't see the bug in detailed perspective/context and can't find any solutions for you. – Edi Imanto Dec 24 '19 at 16:26
Sorry, i am trying to write a code that will select user in twitter when replying to a tweet message. Would you like to see the entire DOM? The section of the DOM that shows the list of user when you type in the textbox was attached. The only user on the list in this particular case is @jubaitca. – sayan Dec 24 '19 at 17:10
I've edited my code, please try it, and if find my code run smoothly, please select it as the correct answer. Thanks – Edi Imanto Dec 25 '19 at 00:52
I get the following error when run your new code: "Unexpected token if" – sayan Dec 25 '19 at 14:21
I'm sorry, a bit of mistake sometimes happen. It is fixed now. – Edi Imanto Dec 25 '19 at 15:39
sure, my pleasure. – Edi Imanto Dec 25 '19 at 19:13

Clicking button using inner text

1 Answers1