Like on Spotify Desktop App
The following tutorial shows how to automate a desktop application. As an example we will automatically to like songs in the Spotify desktop application.
Setup
- Follow the AskUI installation guide and write your first instruction
- Open the Spotify desktop application on your screen
- If you have multiple screens, configure the used display by setting the display variable at
test/helpers/askui-helper.ts
- If you have multiple screens, configure the used display by setting the display variable at
Code
After running the npx askui init
command as described in the setup you will have a file test/my-first-askui-test-suite.test.ts
. In this file add a new workflow (it
-code-block) inside the body of the callback passed to the describe
function:
describe(/* a string identifying the test suite */, () => {
... (other tests)
it('should like Spotify song', async () => {
});
});
1. Navigate to the Search Page
First, we need to open the search page where we can look for a song:
it('should like Spotify song', async () => {
await aui.click().icon().withText('search').exec();
});
2. Search for a Song
Then we can use the search field (a textfield) to search a song:
it('should like Spotify song', async () => {
...
await aui.typeIn('Bohemian Rhapsody').textfield().exec();
await aui.pressKey('enter').exec();
});
3. Open Menu for a Song
On the search result page we need to right click a song to open the menu for the song:
it('should like Spotify song', async () => {
...
await aui.moveMouseTo().text('Bohemian Rhapsody').below().text('Songs').exec();
await aui.mouseRightClick().exec();
await aui.clickText({text: 'Save to your Liked Songs', type: 'similar'});
});
As the text "Bohemian Rhapsody" is present on the page multiple times, we are specifying the position of the text we want to click further by saying that it is the one below the text "Songs".
We expect that the song has not yet been liked (although we totally understand if this is the case - we like it, too 😉 - but just for the sake of this workflow, let's unlike it or use another song).
4. Check Whether the Song was Added to Liked Songs
Finally, we want to check whether the song was actually added to the liked songs:
it('should like Spotify song', async () => {
...
await aui.clickText({text: 'Liked Songs', type: 'similar'});
await aui.expect().text('Bohemian Rhapsody').exists().exec();
});
5. Remove Song from Like Songs
To be able to run the workflow again, it is necessary to reset the state of Spotify, or more specifically, your liked songs. One option would be to add the following instructions to your code in order to remove the song from the liked songs.
it('should like Spotify song', async () => {
...
await aui.moveMouseTo().text('Bohemian Rhapsody').below().text('Title').exec();
await aui.mouseRightClick().exec();
await aui.clickText({text: 'Remove from your Liked Songs', type: 'similar'});
});
Result
The following code block shows the complete code for the Spotify automation:
it('should like Spotify song', async () => {
await aui.click().icon().withText('search').exec();
await aui.typeIn('Bohemian Rhapsody').textfield().exec();
await aui.pressKey('enter').exec();
await aui.moveMouseTo().text('Bohemian Rhapsody').below().text('Songs').exec();
await aui.mouseRightClick().exec();
await aui.clickText({text: 'Save to your Liked Songs', type: 'similar'});
await aui.clickText({text: 'Liked Songs', type: 'similar'});
await aui.expect().text('Bohemian Rhapsody').exists().exec();
await aui.moveMouseTo().text('Bohemian Rhapsody').below().text('Title').exec();
await aui.mouseRightClick().exec();
await aui.clickText({text: 'Remove from your Liked Songs', type: 'similar'});
});
To run this workflow use the npm run askui
command.