Dr. Woo Posted November 4, 2019 Share Posted November 4, 2019 There are several workflows for controlling the Spotify App, but is there a way to control the Spotify Web Player (in Chrome) via Keyboard shortcuts via Alfred? If not with Alfred, any other suggestions? Checked some Chrome extensions, but those e.g. don't let you use the Mac’s function keys. http://beardedspice.github.io/ seemed to be an option, but somehow doesn't work in Catalina (no updates in 3 years). Link to comment
vitor Posted November 4, 2019 Share Posted November 4, 2019 5 hours ago, Dr. Woo said: but is there a way to control the Spotify Web Player (in Chrome) via Keyboard shortcuts via Alfred? There you go. I haven’t tested it on Catalina (I’m not on it), but it should work provided you gave Alfred the appropriate permissions. You may also need to activate (in Chrome) View → Developer → Allow JavaScript from Apple Events. Keep in mind that due to a limitation in AppleScript, shortcuts may not work if you have more than one instance of Chrome open (i.e. if you have two Chrome icons in your Dock). Link to comment
Dr. Woo Posted November 5, 2019 Author Share Posted November 5, 2019 23 hours ago, vitor said: There you go. I haven’t tested it on Catalina (I’m not on it), but it should work provided you gave Alfred the appropriate permissions. You may also need to activate (in Chrome) View → Developer → Allow JavaScript from Apple Events. Thank you. It works ... but only if Chrome is in front and the Spotify Web Player the front-most tab/window. Kind of pointless. I need it to work work globally, no matter where the Web Play tab currently sits. Possible? Link to comment
deanishe Posted November 5, 2019 Share Posted November 5, 2019 21 minutes ago, Dr. Woo said: Kind of pointless. I wouldn't say that. Vítor has done 99% of the work for you. Why don't you try to figure out the rest for yourself? Link to comment
Dr. Woo Posted November 5, 2019 Author Share Posted November 5, 2019 26 minutes ago, deanishe said: Why don't you try to figure out the rest for yourself? Unfortunately I don't have the skills. Link to comment
vitor Posted November 6, 2019 Share Posted November 6, 2019 2 hours ago, Dr. Woo said: I need it to work work globally, no matter where the Web Play tab currently sits. That’s already how it works. However, in addition to requiring only one Chrome instance it also required there were only one window (or to be more accurate, the window ordering mattered). Download from the same URL, as that version now works on all windows (though the multiple instances limitation remains, there’s nothing we can do about it). Link to comment
Dr. Woo Posted November 6, 2019 Author Share Posted November 6, 2019 Excellent! Works as expected. No worries about having two Web Player instances open at once. Despite browsing with dozens of tabs open in parallel, it happens seldom. Thank you very much. Link to comment
Dr. Woo Posted November 6, 2019 Author Share Posted November 6, 2019 (edited) Uhm... Sorry to bother again: Play/Pause works, but all the other commands for some reason not. Solved. Problem was the button titles in the HTML code are partially different on the german language Web Player: Next = Weiter. Previous = Zurück. Modified the Arguments in the Alfred workflow accordingly. Hmmm... Problem with Previous. It’s "Zurück" in the HTML code but neither of the following works: document.querySelector('button[title="Zurück"]').click() document.querySelector('button[title="Zurück"]').click() I assume the ü (lower case U umlaut) is causing the problem. How to format it? Edited November 6, 2019 by Dr. Woo Link to comment
Dr. Woo Posted November 10, 2019 Author Share Posted November 10, 2019 Any idea how to fix the Umlaut problem? Link to comment
vitor Posted November 10, 2019 Share Posted November 10, 2019 7 hours ago, Dr. Woo said: Any idea how to fix the Umlaut problem? You’re on your own for that one. I’ve already made two throwaway Spotify accounts to make and improve the Workflow, and have no desire to make a third one to debug a localisation issue that may lie out of our ability to fix (e.g. bug in JXA). It’s not your fault you didn’t specify you use Spotify in a non-english language (how would you know that could be relevant?), but that’s also a tad more work than what I feel like dedicating on this endeavour. Link to comment
Dr. Woo Posted December 12, 2019 Author Share Posted December 12, 2019 A good friend and partner in crime has helped me with this. The problem is that – depending on the current page layout – there are multiple buttons titled „Weiter“/„Zurück“ on the page, which don't relate to playback control but for instance the page navigation. As the playback buttons have no ID assigned, we had to identify them through the class. So instead of the argument document.querySelector('button[title="Zurück"]') we are using document.querySelectorAll('button[class="control-button spoticon-skip-back-16"]')[0].click() Advantage is that this is a language independent approach, as the class names don't get translated. Link to comment
vitor Posted December 12, 2019 Share Posted December 12, 2019 1 minute ago, Dr. Woo said: Advantage is that this is a language independent approach, as the class names don't get translated. Disadvantage is that those are way more likely to change when they make updates to the page, as companies like to do. 1 minute ago, Dr. Woo said: document.querySelectorAll('button[class="control-button spoticon-skip-back-16"]')[0].click() If you’re going to use [0], there’s no reason to use querySelectorAll, use querySelector instead: document.querySelector('button[class="control-button spoticon-skip-back-16"]').click(). Link to comment
Dr. Woo Posted December 12, 2019 Author Share Posted December 12, 2019 (edited) 17 minutes ago, vitor said: If you’re going to use [0], there’s no reason to use querySelectorAll, use querySelector instead: document.querySelector('button[class="control-button spoticon-skip-back-16"]').click(). Uhm, actually no. There are two or three instances (at least in case of 'Weiter' (Next)), and without the All it just does NOT work. Go try for yourself. Edited December 12, 2019 by Dr. Woo Link to comment
vitor Posted December 12, 2019 Share Posted December 12, 2019 1 hour ago, Dr. Woo said: There are two or three instances And you’re only picking the first one ([0]), so there’s no need to use querySelectorAll. Documentation for querySelector: Quote The Document method querySelector() returns the first Element within the document that matches the specified selector, or group of selectors. If no matches are found, null is returned. (…) If you need a list of all elements matching the specified selectors, you should use querySelectorAll() instead. 1 hour ago, Dr. Woo said: and without the All it just does NOT work I find that unlikely, as I’ve been using those methods for a long time and they’ve always worked like that. Did you remove the [0]? 1 hour ago, Dr. Woo said: Go try for yourself. No, thank you. I’ve already mentioned I’m not going to make another account. I was trying to improve your code. Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now