×
INTELLIGENT WORK FORUMS
FOR COMPUTER PROFESSIONALS

Log In

Come Join Us!

Are you a
Computer / IT professional?
Join Tek-Tips Forums!
  • Talk With Other Members
  • Be Notified Of Responses
    To Your Posts
  • Keyword Search
  • One-Click Access To Your
    Favorite Forums
  • Automated Signatures
    On Your Posts
  • Best Of All, It's Free!

*Tek-Tips's functionality depends on members receiving e-mail. By joining you are opting in to receive e-mail.

Posting Guidelines

Promoting, selling, recruiting, coursework and thesis posting is forbidden.

Students Click Here

How to load JavaScript files to enable DOM element click

How to load JavaScript files to enable DOM element click

How to load JavaScript files to enable DOM element click

(OP)
Hello:
In one of my projects, I need to visit one web site and click on some DOM elements to submit some forms to the web server. The web site contains one root page, one main page, and about 100 children pages. All the pages are in hierarchy structure, being the root is the top node, main page is the middle node, and children pages are the lowest level nodes.
All the DOM elements I need to click are in the children pages.
From my testing, I can visit specific child page, and run the following JavaScript to click on certain DOM element, and submit the form.

document.getElementsByClassName('class_name1')[0].click();
document.getElementsByClassName('class_name2')[0].value = 1;
var forms = dom.querySelectorAll('form');
if (forms.length == 2)
{
document.querySelectorAll('form')[1].submit();
}

However, as there are almost 100 children pages, it is not easy to visit each page using browser. Therefore, I want to visit the main page (the middle node), and stay there, but use XHR JavaScript to visit any of the children page, and run the above JavaScript to submit some forms.
I have the following JavaScript to run from the main page:

function child1_submit(child_url1, class_name1, class_name2)
{
let xhr = new XMLHttpRequest();
xhr.open('GET', child_url1, true);
xhr.onload = function()
{
var parser = new DOMParser();
var dom = parser.parseFromString(xhr.responseText, 'text/html');
var button1 = dom.getElementsByClassName(class_name1)[0];
if (button1)
{
console.log(bet1);
button1.click();
}
};
xhr.send();
}

But my code did not work, but I can see the button1 return the correct value of the DOM element.
I used Chrome Developer Tools to check the working JavaScript snippet, and I found that on the child page, the DOM click was initiated by two different extra JavaScript files (mini_js1.js and mini_js2.js), and they are rather big, about 600KB to 1MB in size.
Therefore, I understand the reason why my JavaScript function child1_submit didn’t work, because I have to download the those mini_js1.js and mini_js2.js.
how I can download and set up the small environment with 2 JavaScript files (mini_js1.js and mini_js2.js), in order to make my JavaScript function works. My code works if I visit the child page, as in mini_js1.js and mini_js2.js are there too, but when I used XHR request to load the child page, inside the XHR.onload function, those mini_js1.js & mini_js2.js are missing. In short, how I can set up a mini environment to run my JavaScript code.
Please advice!

RE: How to load JavaScript files to enable DOM element click

you are probably better using some kind of tool like Selenium or JMeter to automate the action rather than Javascript for this as you are likely to have all sorts of issues (see Same Origin Security Model) making interactions from one site to another.

If you have control of both sites, i would suggest using an IFrame to load the second site in and then you can use the DOM model to traverse from your main page into the other page for population and submission, but you may encounter access issues as mentioned above.

another option is to look at what is being submitted and then replicate the submission package (usually a HTML Form) in your own code pointing at the same destination as the client site one.

Greg Griffiths
Livelink Certified Developer & ECM Global Star Champion 2005 & 2006
http://www.greggriffiths.org/livelink/

Red Flag This Post

Please let us know here why this post is inappropriate. Reasons such as off-topic, duplicates, flames, illegal, vulgar, or students posting their homework.

Red Flag Submitted

Thank you for helping keep Tek-Tips Forums free from inappropriate posts.
The Tek-Tips staff will check this out and take appropriate action.

Reply To This Thread

Posting in the Tek-Tips forums is a member-only feature.

Click Here to join Tek-Tips and talk with other members! Already a Member? Login

Close Box

Join Tek-Tips® Today!

Join your peers on the Internet's largest technical computer professional community.
It's easy to join and it's free.

Here's Why Members Love Tek-Tips Forums:

Register now while it's still free!

Already a member? Close this window and log in.

Join Us             Close