Play button on playlists not working/appearing

[Georgetheasian]

The play button either does not appear or does not work. This issue only appears to be on daily mixes and playlist tiles.

[Georgetheasian]

[nimsandu]

I have problem while fixing this issue can someone help? 🙃 I would really appreciate it it became something like this👆🏻

[ghost]

Same issue, literally any button would be good

[nimsandu]

@DoctorAnon If you search an artist inside artist page there is the play button just like it suppose to be and then if you go anywhere where once didn't have the play button will now have the perfect play button

I don't know why🥲

[RACECAR69]

in my case it appears but does not work the animation of being clicked plays but it does nothing

[nimsandu]

Im going to leave #110 pr unmerged for someone to contribute to fix this

[leonglo]

hey @nimsandu do you have any ideas on how to fix the play button not working?

[stel-bl]

@leonglo -

Can you send a screenshot from your user interface? Can it be because the interface is borked?

[leonglo]

@windowz414

https://user-images.githubusercontent.com/75845683/196757589-4764d0ef-c978-48d3-bc95-63a0e37c88e7.mp4

[stel-bl]

@leonglo -

Now this one is weird. I'll see if I can reproduce this on my laptop with Windows 10.

[nimsandu]

@leonglo I have no idea cuz sometimes it works but sometimes it's not

Im trying yo figure out why but nothing worked

[nimsandu]

@windowz414 Thanks mate

[leonglo]

Hopefully we find the reason

[stel-bl]

@nimsandu you're always welcome!

[stel-bl]

@leonglo, I cannot reproduce your issue because there's a worse bug on my side about this.

@nimsandu, the play button doesn't appear on my side at all. Alongside, there seems to be some kind of an internal windows container (Even I have no idea how else to describe this.) borders as well.

[leonglo]

Damn!

[stel-bl]

@nimsandu sorry for duplicate ping but I think you're going to want to see this.

I've decided to go through some element inspection using Chrome to see if I can find anything useful. And I did find something useful that might help you through;

The play button does exist but for some odd reason, the vector image doesn't show up. (Missing property? Partial info? The play/pause button of action bar row has less vector paths defined compared to remove from library button.)

[nimsandu]

@windowz414 Yhah thats what i cant understand too

• If you search and go to a artist page play button will appear. Then if you go back to a playlist where, there wasn't a play button previously, will now have play button and if you click it play action wont work but if you manually play a song and if you click the same button pause action will work fine

BTW Update Spotify so you will have old ui for Spotify

[stel-bl]

@nimsandu well, I guess it's time for a rewrite?

Also sure, I'll do so when this Windows update is done. xd

[nimsandu]

@nimsandu well, I guess it's time for a rewrite?

I guess so

Also sure, I'll do so when this Windows update is done. xd

Nice

[nimsandu]

with the introduction of spicetify version 2.14.3 play button appeared again now we have to work regarding making the button accessible again

[otutsukihyuuga]

not just the play button on collection of songs(albums and playlist) and top search result but also shuffle doesnt work (the button on left of previous button) along with the loop (button on right of next button) on hovering it lightens if not already selected but onclick nothing happens

@windowz414 could u tell me how u used inspect element in spotify app??

[miukyo]

i managed to fix the play button issue where the button doesn't do anything when you click it.

Your selector in bloom.js are wrong because you selecting the div element not the button so i change the selector to the button and it works fine

.main-playButton-PlayButton to .main-playButton-PlayButton>button

playButtonStyle.innerHTML = `
      .main-playButton-button[aria-label="${Spicetify.Platform.Translations.play}"],
      .main-playButton-PlayButton>button[aria-label="${Spicetify.Platform.Translations.play}"],
      .main-playPauseButton-button[aria-label="${Spicetify.Platform.Translations.play}"],
      .main-trackList-rowPlayPauseButton[aria-label="${Spicetify.Platform.Translations.play}"] {
        background-color: var(--spice-text) !important;
        -webkit-mask-image: url('https://cdn.jsdelivr.net/gh/nimsandu/spicetify-bloom@master/assets/fluentui-system-icons/ic_fluent_play_24_filled.svg') !important;
      }
      .main-playButton-button[aria-label="${Spicetify.Platform.Translations.pause}"],
      .main-playButton-PlayButton>button[aria-label="${Spicetify.Platform.Translations.pause}"],
      .main-playPauseButton-button[aria-label="${Spicetify.Platform.Translations.pause}"],
      .main-trackList-rowPlayPauseButton[aria-label="${Spicetify.Platform.Translations.pause}"] {
        background-color: var(--spice-text) !important;
        -webkit-mask-image: url('https://cdn.jsdelivr.net/gh/nimsandu/spicetify-bloom@master/assets/fluentui-system-icons/ic_fluent_pause_16_filled.svg') !important;
      }`;

your playButtonStyle.type = 'text/css'; are unnecessary so i remove it

i also change some css to fix the original button overlapping the modded one and changing .main-playButton-PlayButton to .main-playButton-PlayButton>button

/* play buttons */

.main-playButton-button,
.main-playButton-PlayButton > button,
.main-trackList-rowPlayPauseButton {
 background-color: var(--spice-text) !important;
 -webkit-mask-image: url("https://cdn.jsdelivr.net/gh/nimsandu/spicetify-bloom@master/assets/fluentui-system-icons/ic_fluent_play_24_filled.svg");
}

.main-playButton-PlayButton:focus,
.main-playButton-PlayButton:hover {
 background-color: transparent;
}

.main-playButton-PlayButton > button {
 width: var(--size);
 height: var(--size);
}

.main-playButton-PlayButton > button > span {
 display: none;
}

sorry for my bad english i tried my best :D

[miukyo]

@windowz414 sure, i just did it

[otutsukihyuuga]

@miukyo ur work is really great i edited my files and it worked Thanks a lot bro I think now this issue can be closed

[miukyo]

@otutsukihyuuga thank you

[nimsandu]

@windowz414 @miukyo @otutsukihyuuga great work guys! i really appreciate this thank you all to making our themes' future way better day after day! have a nice life!