Javascript working in browser, but not when run by KM?

Hi! New user here. I'm very excited about KM and I can't believe I've used Macs for decades without trying it out.

I have a webpage, with the following <div> that I need to click on:

<div class="fold-bar"><label>View More</label></div>

This javascript works every time in the Javascript console in Chrome:

var elements = document.querySelectorAll('.fold-bar');
var targetElement = null;

// Loop through all elements with the class "fold-bar"
elements.forEach(function(element) {
    // Check if the element has only the "fold-bar" class
    if (element.classList.length === 1 && element.classList.contains('fold-bar')) {
        // If it has only the "fold-bar" class, set it as the target element
        targetElement = element;
    }
});

// If a target element with only the "fold-bar" class was found, click it
if (targetElement) {
    targetElement.click();
} else {
    console.error('Target element with only "fold-bar" class not found.');
}

(I have to do a loop because a few <div>s use the fold-bar class, but this is the only one that ONLY uses class "fold-bar")
But when I run it in an "Execute JavaScript in Google Chrome" action in KM, I get an error every time:
"Target element with only "fold-bar" class not found."

I have determined that the javascript in the console obtains a list of the relevant elements (document.querySelectorAll('.fold-bar'), but the action in KM does not - var elements is empty when KM runs the javascript.

I'm at a loss for why KM would seem to be sending the correct JavaScript to the browser but it doesn't work. If I do the same thing manually it does work.

Any suggestions! TIA!

You should probably try the Press a Button action and use its scan feature for your browser to see if "View More" qualifies as a button or not. If so, I think that's a reliable solution. If not, there should be other solutions, but I'm choosing this one first because it will probably be best for you.

So I don't think JavaScript will be needed. But if you still want to use it, you will have to wait for others to comment, as I'm quite lame with it.

Chrome does have a history of randomly breaking then fixing its AppleScript integration in the weirdest of ways -- have you tested the same in Safari?

That was a good thought. I get the same result (no result) in Safari, with the same error output in the javascript console.

You're right - I can also click on this particular spot using "Click on Found Image".
That's a good tip.

But once I do, there is more of a page revealed that I need to fill in using javascript. So although there are a few ways to click on this particular link, so I do want to figure out why the javascript is getting passed to the browsers intact but isn't able to grab any values.

I have realized that the HTML I'm trying to work on is contained in an iframe. Searching the forum, I don't see much information about how to deal with that in KM.

But I'm also unclear on why the same javascript works directly in the browser, but not when sent by KM.

I solved it! (with grit and determination) :muscle:
:grinning:

It was a nightmare, and to be honest I relied on ChatGPT to troubleshoot for hours.
The webpage I am trying to interact with is a complex, very outdated set of code that I have no control over. It involves multiple iframes, nested iframes, a frameset containing nested iframes, lots of arcane javascript of its own, etc. Fortunately the iframes, etc, are all coming from the same domain and there are no security restrictions, etc.

So with a complex series of logic to drill down through the iframes, frameset, and then more iframes, and select the element using the xpath of the single element "View More", the javascript code can click() on that element.

This now works in the browser javascript console AND in KM. :+1:

It's such a unique webpage that I don't think it will be helpful to share the details (and I can't actually share the HTML for security reasons anyway).

But... it IS possible to access this in KM in this case. You have to be sure to drill down to an iFrame, access it's content, drill down to the next iFrame, access it's content, and keep going in this way until you get to the level containing the element you need to access.

I want to share that it is possible, but it is complicated.

I appreciate everyone's suggestions!! I could have done it with "Click on Found Image", for example, but I wanted to be more precise and quicker, and also figure out how to do it for other parts of the webpage that aren't so easy to interact with "Click on Found Image" or key presses like "tab".

1 Like