Jump to content

Interact with browser Javascript via JXA script?

Recommended Posts

I have an Alfred workflow based on a JXA script. It acts as a control mechanism for focusatwill.com (an online music streaming service). It has basic functionality, play/pause, skip track...


This was working fine in an earlier version, interacting with the page using query selectors, e.g.

tab.execute({ javascript: "document.querySelector('.playerControls .playButton').click();" })

This site recently refactored their UI to use React. My basic controls still work (using querySelector), but one part of the setup (changing the genre) has broken. It used to use querySelectorAll for this task, but in the new React UI, the controls I need to reach don't exist unless you click in the UI ... 


In any case, the developers exposed an API in the site code, so I can do stuff like


And doing that in the developer console in Chrome works fine. But if I try to do the same using tab.execute in JXA (from Alfred), nothing happens.


I'm guessing that I'm running afoul of the security model in Chrome. Does anyone know if what I'm trying to do is even possible (from Alfred/JXA)? Or am I going to have to try to do this as a Chrome extension instead?


If it's helpful, here is the repository:



And there's some discussion between me and someone at focusatwill.com on this commit:


Share this post

Link to post
8 hours ago, tangledhelix said:

But if I try to do the same using tab.execute in JXA (from Alfred), nothing happens.


What if you do it from the Script Editor? Does it work?

As someone who has written a fair share of JXA to interact with Chrome, some findings:

  • Some code works fine via execute, while some does not. What seems to work best is instead of tab.execute({javascript: js_code}), doing tab.url = 'javascript:' + js_code (will run like a bookmarklet).
  • Code can have different results when run from the Script Editor vs osascript (either in a Terminal, or Alfred). For one of these cases, to get it to work from outside the Script Editor I had to export the code as an app and it has to appear on the Dock (if I change the plist so that the app does not appear on the Dock, the code behaves differently).

Share this post

Link to post

Thanks, vitor!


To answer your question, no, it did not work any differently in Script Editor. I assume I was simply running afoul of the browser's security model. Your suggestion to use tab.url worked out great, though. I am ready to push out a new version, it is all functional again.

Share this post

Link to post

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...