How to get property js content edit it and run with puppeteer

Question

im trying to use puppeteer to get property content of an element, edit it and run the edited version. For example: There is this element:

<a href="#" onclick="mojarra.jsfcljs(document.getElementById('j_idt58'),{'j_idt58:j_idt201:0:j_idt203':'j_idt58:j_idt201:0:j_idt203'},'_blank');return false" class="btn btn-info"></a>

What I need is to get the onclick content, remove the _blank parameter and run the rest of the function... Any ideas?

Answer 1

maybe not the most powerful solution out there but if you only need to do this on this specific tag you could set onclick's attribute with JavaScript within page.evalauate like this:

await page.evalauate(() => {
  document
    .querySelector(".btn.btn-info")
    .setAttribute(
      "onclick",
      document
        .querySelector(".btn.btn-info")
        .onclick.toString()
        .split("\n")[1]
        .replace(",'_blank'", "")
    );
});
await page.click(".btn.btn-info");

what's going on here?

1. we run plain JavaScript within the page's scope with page.evaluate
2. we select the tag with document.querySelector
3. and set its onclick attribute (not its property!)
4. getting the node value of onclick as string:

mojarra.jsfcljs(document.getElementById('j_idt58'),{'j_idt58:j_idt201:0:j_idt203':'j_idt58:j_idt201:0:j_idt203'},'_blank');return false

5. using the 2nd line of the function (as we don't need the 1st 'function onclick(event) {' line when we reassign it as the attribute)
6. and replacing ,'_blank' parameter from the original function (string).
7. the result will be:

mojarra.jsfcljs(document.getElementById('j_idt58'),{'j_idt58:j_idt201:0:j_idt203':'j_idt58:j_idt201:0:j_idt203'});return false

8. finally clicking the button with page.click executes the new function

---

alternatively, you can use attributes.onclick.nodeValue if you are not comfortable with toString().split("\n")[1] above:

document.querySelector(".btn.btn-info").attributes.onclick.nodeValue.replace(",'_blank'", "")