I have some entry level JavaScript experience, and I’ve been trying to get a script to login and click some buttons on a website, but have reached a tough hurdle where I am unable to find an element using document.getElementByID() or document.contains() and remove it using .remove() .

With each, the console returns the element as “null”. I have tried setTimeout, which does delay properly, but the DOM nodes I’m interested in removing only appear after I present the web view.

See my code below (code that is specific to website has been removed for confidentiality):

var wv = new WebView();
await wv.loadURL("loginwebsite.com");

await wv.evaluateJavaScript(`

var emailTextBox = document.getElementById("username");
emailTextBox.value = "xxxxxx"

var pwTextBox = document.getElementById("password");
pwTextBox.value = "yyyyyy";

var submitBtn =
document.querySelector("body > form > div.ping-buttons > a");

submitBtn.click();`);

await wv.waitForLoad();

await wv.loadURL("SecondWebsite.com");

await wv.waitForLoad();

await wv.evaluateJavaScript(`function removeDivs () {
var divOne = document.getElementById('mydialog');
var divTwo = document.getElementById('mydialog-cover');
divOne.remove();
divTwo.remove();

}

setTimeout(removeDivs, 5000);`);


await wv.present(fullscreen=false);

I also tried a different technique for waiting for the elements to appear before trying to remove them, as shown below:

await wv.evaluateJavaScript(`function removeDivs () {
var divOne = document.getElementById('mydialog');
var divTwo = document.getElementById('mydialog-cover');
  if (document.body.contains(divOne)) {
divOne.remove();
  } else {
  setTimeout(removeDivs, 300); 
}
  if (document.body.contains(divOne)) {
divTwo.remove();
  } else {
  setTimeout(removeDivs, 300); 
}
}

removeDivs();`);

Neither work as anticipated. When the web view presents, even after a 5 second timeout, the original webpage’s JavaScript THEN runs on the page, and the divs I’m looking for are created.

Perhaps there is a way I can present the web view, let the elements populate dynamically, then evaluate my JavaScript to remove the divs? Or maybe there is something simple I am missing.

In any case, thank you all in advance. I’ve been stuck on this issue for days now. And please bear with me, I’m still learning about scriptable.