I want to click an element which is under shadow root also based on some condition like if the element have some specific text and with some value. To find that element I need to run a for loop to check each and every element to meet the expected condition. I tried with script method to click that element but the position of the element keeps changing so it can be handled from loop only and I am not able to select the element by using below JS function while if I run the same function in console it selects perfectly the desire element and click it as well.
* def jsfun =
"""
function ()
{
let modal =(document.querySelectorAll(".global-overlays__overlay-container")) //get Modal container node
let cardsWrapper = modal[0].children[0].children[2].children;
if(cardsWrapper.length && cardsWrapper[0].children) {
let cards = cardsWrapper[0].children;
for(let i = 0; i < cards.length; i++) {
//console.log(cards[i]);
let srChildChild = cards[i];
let opAcc = srChildChild.shadowRoot.querySelector('.option-account');
let accountAlias = srChildChild.shadowRoot.querySelector('.option-account__alias')
let amountNode = opAcc.querySelector('.option-account__amount');
//console.log(amountNode, "test")
let isNumber;
if(amountNode) {
let numbersInsideAmountNOde = amountNode.querySelectorAll('.option-account__amount--number');
//console.log(numbersInsideAmountNOde, "test");
//isNumber = checkAmount(numbersInsideAmountNOde);
let arr = [];
let flag = false;
for (let j = 0; j < numbersInsideAmountNOde.length; j++) {
//console.log(numbersInsideAmountNOde, "=>>", "inside first loop");
numbersInsideAmountNOde.forEach((ele) => {
arr.push(ele.textContent)
})
let filtered = arr.filter(function(value, index, arr){
return value !== ",";
}).filter(function(value, index, arr){
return value !== " ";
}).filter(function(value, index, arr){
return value !== ".";
});
let zeroAmount = filtered.every(item => item === 0);
console.log(filtered, zeroAmount, accountAlias.textContent, "===")
if(!zeroAmount && accountAlias.textContent === 'Beleggingsrekening - Eenvoudig Beleggen') {
flag = true;
numbersInsideAmountNOde[j].click();
console.log('yes')
break;
}
}
if(flag) { break; }
}
//console.log(isNumber, accountAlias, "test");
}
}
}
"""
* call jsfun
ERROR:-
js failed:
>>>>
01: function ()
02: {
03: let modal =(document.querySelectorAll(".global-overlays__overlay-container")) //get Modal container node
04: let cardsWrapper = modal[0].children[0].children[2].children;
05: if(cardsWrapper.length && cardsWrapper[0].children) {
06: let cards = cardsWrapper[0].children;
07: for(let i = 0; i < cards.length; i++) {
08: //console.log(cards[i]);
09: let srChildChild = cards[i];
10: let opAcc = srChildChild.shadowRoot.querySelector('.option-account');
11: let accountAlias = srChildChild.shadowRoot.querySelector('.option-account__alias')
12: let amountNode = opAcc.querySelector('.option-account__amount');
13: //console.log(amountNode, "test")
14: let isNumber;
15: if(amountNode) {
16: let numbersInsideAmountNOde = amountNode.querySelectorAll('.option-account__amount--number');
17: //console.log(numbersInsideAmountNOde, "test");
18: //isNumber = checkAmount(numbersInsideAmountNOde);
19: let arr = [];
20: let flag = false;
21: for (let j = 0; j < numbersInsideAmountNOde.length; j++) {
22: //console.log(numbersInsideAmountNOde, "=>>", "inside first loop");
23: numbersInsideAmountNOde.forEach((ele) => {
24: arr.push(ele.textContent)
25: })
26: let filtered = arr.filter(function(value, index, arr){
27: return value !== ",";
28: }).filter(function(value, index, arr){
29: return value !== " ";
30: }).filter(function(value, index, arr){
31: return value !== ".";
32: });
33: let zeroAmount = filtered.every(item => item === 0);
34: console.log(filtered, zeroAmount, accountAlias.textContent, "===")
35: if(!zeroAmount && accountAlias.textContent === 'Beleggingsrekening - Eenvoudig Beleggen') {
36: flag = true;
37: numbersInsideAmountNOde[j].click();
38: console.log('yes')
39: break;
40: }
41: }
42: if(flag) { break; }
43: }
44: //console.log(isNumber, accountAlias, "test");
45: }
46: }
47: }
<<<<
org.graalvm.polyglot.PolyglotException: ReferenceError: "document" is not defined
- <js>.:anonymous(Unnamed:3)