Creating a Cockpit JavaScript action to click a button inside a widget

Hi,

I want to create an action that clicks a button inside a widget when I am in cockpit. Is this possible? I am not sure how to structure my JavaScript code. If I use document.getElementById("my-button") it returns null.

I also don’t know if there is a way to view console.log output or to view the document tree. I found out the value was null because I called alert(). Hope someone can help me :slight_smile:

Hi @rutger-seascape,

What kind of widget is the button in? Is it a normal button “Input” widget, inside some kind of container widget, or is this a button from some other webpage being displayed inside an iframe or something?

More generally, programatically clicking a button is rarely a good idea. What is the button supposed to do, and could you make your Action do that instead?

You should be able to press CTRL/CMD+SHIFT+I to open the normal dev tools, and if I’m remembering correctly that’s also available in the menu bar at the top.

You may need to disable Cockpit’s system logging via the Settings / Dev menu to enable things to show up in the console.

Hey @EliotBR ,

Thanks for your reply. I am developing a custom extension to control a gimbal camera and I loaded it as a widget by configuring the register_service endpoint, which works. I believe it’s called an automatic external iframe in the docs. I agree that it might not be the best idea but I’m not sure if I can make it work with http. The button sends a websocket message to my backend which makes it move on the yaw axis for example.

I can add some http endpoints to my backend but I am not sure if I can set the correct port to use in the Action. Because I let BlueOS assign an available port for my Extension container I don’t know the port beforehand. Thanks, I can get the dev tools to work!