Skip to main content

 

I am trying to automate the year selection slider on the CroplandCROS website (https://croplandcros.scinet.usda.gov/) using Run JavaScript in Automation Anywhere (AA).

Approach Tried:

I wrote the following JavaScript code to move the slider dynamically by calculating the correct position based on the target year:

 

 

(function() { var slider = document.querySelector("divdrole='slider']"); var track = document.querySelector(".esri-slider__track"); if (slider && track) { var targetYear = 2015, minYear = 1997, maxYear = 2023; var trackRect = track.getBoundingClientRect(); var posX = ((targetYear - minYear) / (maxYear - minYear)) * trackRect.width; var targetX = trackRect.left + posX; var sliderRect = slider.getBoundingClientRect(); var startX = sliderRect.left + sliderRect.width / 2; function moveSlider(stepX) { var eventMove = new PointerEvent("pointermove", { bubbles: true, cancelable: true, composed: true, clientX: stepX, clientY: trackRect.top + trackRect.height / 2 }); slider.dispatchEvent(eventMove); } var pointerDown = new PointerEvent("pointerdown", { bubbles: true, cancelable: true, composed: true, clientX: startX, clientY: trackRect.top + trackRect.height / 2 }); slider.dispatchEvent(pointerDown); let currentX = startX, stepSize = (targetX - startX) / 20; function animateMove() { if (Math.abs(currentX - targetX) < Math.abs(stepSize)) { moveSlider(targetX); setTimeout(() => { var pointerUp = new PointerEvent("pointerup", { bubbles: true, cancelable: true, composed: true, clientX: targetX, clientY: trackRect.top + trackRect.height / 2 }); slider.dispatchEvent(pointerUp); }, 100); } else { currentX += stepSize; moveSlider(currentX); setTimeout(animateMove, 10); } } setTimeout(animateMove, 50); } else { console.error("Slider or track element not found."); } })();

Observations:

  • If I open the website in a New Tab, select Last used browser tab, and choose Google Chrome, the script works fine, and the slider moves correctly.

  • However, when I open the browser using New Window, select Google Chrome, and pass the website link, the script does not execute and gives the following error in Run JavaScript:

    Error:

    Browser: Run JavaScript Executes JavaScript function in a web page or in an iFrame within a web page (Supported browsers only) To run JavaScript in iFrame, use Recorder package 2.5.0 or above (Chrome and Edge only) Required bot agent version: 21.210 or above

Troubleshooting Attempts:

  • Assigned the CroplandCROS website to a window variable ($Window3$) and passed it to Run JavaScript, but the error still persists.
  • Ensured the bot agent version and Recorder package are up to date.

Expected Outcome:

  • When opening the browser using New Window and passing the website link, it should allow Run JavaScript to execute properly within the same window.

Help Needed:

  1. How can I make sure Run JavaScript executes properly in a new browser window in AA?
  2. Are there any AA-specific configurations required to allow JavaScript execution in a newly opened window?
  3. Are there better approaches to automate this slider, perhaps using a different method within AA?

Any guidance or alternative solutions would be greatly appreciated! 🚀

Ps: I am attaching the screenshots of both working and not working approach.

This is the Screenshot of the slider i want to autmate:
 

 

@arpit45 , you can use a wildcard character (like *) in the window variable. For example, to match any window title containing "chrome," you can use *chrome.


Can you please show me an example for that?


 

 

Hi ​@DK 964 , 

I tried the solution you gave me but it is still not working as expected, see in the first step , I am opening in new Window and in the second step I am using wildcard, but the JS is not being applied to the new Window. Instead of *CropLandCros i tried using *chrome also, please suggest me what should I do ?


thanks,
Arpit


Hi ​@arpit45 ,

 

For me its working. 

 

check the parameters in the attached screenshots.

Make sure on line 2 you have seletected Browser Tab as “Browser” not “application”.

Also check the browser package and AA bot agent version.

(function() { 
var slider = document.querySelector("divyrole='slider']");
var track = document.querySelector(".esri-slider__track");
if (slider && track) {
var targetYear = 2015, minYear = 1997, maxYear = 2023;
var trackRect = track.getBoundingClientRect();
var posX = ((targetYear - minYear) / (maxYear - minYear)) * trackRect.width;
var targetX = trackRect.left + posX;
var sliderRect = slider.getBoundingClientRect();
var startX = sliderRect.left + sliderRect.width / 2;

function moveSlider(stepX) {
var eventMove = new PointerEvent("pointermove", {
bubbles: true,
cancelable: true,
composed: true,
clientX: stepX,
clientY: trackRect.top + trackRect.height / 2
});
slider.dispatchEvent(eventMove);
}

var pointerDown = new PointerEvent("pointerdown", {
bubbles: true,
cancelable: true,
composed: true,
clientX: startX,
clientY: trackRect.top + trackRect.height / 2
});
slider.dispatchEvent(pointerDown);

let currentX = startX,
stepSize = (targetX - startX) / 20;

function animateMove() {
if (Math.abs(currentX - targetX) < Math.abs(stepSize)) {
moveSlider(targetX);
setTimeout(() => {
var pointerUp = new PointerEvent("pointerup", {
bubbles: true,
cancelable: true,
composed: true,
clientX: targetX,
clientY: trackRect.top + trackRect.height / 2
});
slider.dispatchEvent(pointerUp);
}, 100);
} else {
currentX += stepSize;
moveSlider(currentX);
setTimeout(animateMove, 10);
}
}

setTimeout(animateMove, 50);
} else {
console.error("Slider or track element not found.");
}
})();

 

 


Can we connect ​@DK 964 , I would really appreciate your help, I really want to learn these things.
 I tried this solution but it is not working in the new Window.
Here is the Browser I already had CroplandCROS opened so I selected that.

You can message  me on LinkedIn: https://www.linkedin.com/in/arpit-parekh-9944aa185/

 


 

I am trying to automate a slider movement on a website using Automation Anywhere's "Run JavaScript" action. The goal is to dynamically update the slider based on a Number variable $Year$, which changes in a loop from 2007 to 2010.

Issue:

  • The JavaScript script below works perfectly when I manually enter a year (e.g., var targetYear = 2007;).
  • However, when I try to pass Automation Anywhere's $Year$ variable, the script throws an error, indicating that targetYear is NaN.
  • The issue seems to be that Automation Anywhere is not injecting $Year$ correctly into JavaScript, or it is treating it as a string rather than a number.

Code I am using:

 
(function() { 
var slider = document.querySelector("divirole='slider']");
var track = document.querySelector(".esri-slider__track");
if (slider && track) {
var targetYear = `$Year$`, minYear = 1997, maxYear = 2023;
var trackRect = track.getBoundingClientRect();
var posX = ((targetYear - minYear) / (maxYear - minYear)) * trackRect.width;
var targetX = trackRect.left + posX;
var sliderRect = slider.getBoundingClientRect();
var startX = sliderRect.left + sliderRect.width / 2;
function moveSlider(stepX) {
var eventMove = new PointerEvent("pointermove", { bubbles: true, cancelable: true, composed: true, clientX: stepX, clientY: trackRect.top + trackRect.height / 2 });
slider.dispatchEvent(eventMove);
}
var pointerDown = new PointerEvent("pointerdown", { bubbles: true, cancelable: true, composed: true, clientX: startX, clientY: trackRect.top + trackRect.height / 2 });
slider.dispatchEvent(pointerDown);
let currentX = startX, stepSize = (targetX - startX) / 20;
function animateMove() {
if (Math.abs(currentX - targetX) < Math.abs(stepSize)) {
moveSlider(targetX);
setTimeout(() => {
var pointerUp = new PointerEvent("pointerup", { bubbles: true, cancelable: true, composed: true, clientX: targetX, clientY: trackRect.top + trackRect.height / 2 });
slider.dispatchEvent(pointerUp);
}, 100);
} else {
currentX += stepSize;
moveSlider(currentX);
setTimeout(animateMove, 10);
}
}
setTimeout(animateMove, 50);
} else {
console.error("Slider or track element not found.");
}
})();

Console Error in Chrome DevTools:

Uncaught TypeError: Failed to construct 'MouseEvent': Failed to read the 'clientX' property from 'MouseEventInit': The provided double value is non-finite. at triggerEvent ((index):14:25) at animateMove ((index):40:17)

 

Invalid targetYear: NaN

Troubleshooting Done:

✔️ Verified $Year$ is a Number Variable in AA (Default: 2007)
✔️ Checked "Use as Input" for $Year$
✔️ Manually replacing $Year$ with a number works
✔️ Console logs confirm AA is not injecting $Year$ correctly

Has anyone else faced this issue in Automation Anywhere's "Run JavaScript" action? How can I properly inject $Year$ as a number into JavaScript?

 

 


Hi ​@arpit45,

to pass in variables you should write these to a JavaScript file like below.

Create a list and loop through that list with your years and assign this to a variable and re-write the JavaScript file.

 

This should do the triick I guess.

 

What do you think?

 

Cheers

Marc

 

 

 


Hi ​@arpit45,

if  it is not working try to use targetYear = parseInt('$Year$') in your JavaScript code.

 

Let me know if this worked for you please. 😊

 

Cheers

Marc


Hi ​@arpit45,

I tested your code on that particular website and it works as expected → see screens below 😎 👇👀

 

Cheers

Marc

 

Bot Code:

 

Botrun as a GIF:

 


@arpit45, ​@Dineshkumar Muthu  have you been able to connect and figure it out? We’d love to hear how you solved it!


Hi ​@Shreya.Kumar,

I already answered this question with a Botrun here: 👇👀

Cheers

Marc


@Marc 1985 Thank you! Just came across the duplicate post and got a strong sense of Deja Vu 🤣

Merging the conversations now.


Reply