Spotify Web Playback SDK example playback buttons don't work

[Kiminchi]

Plan

Premium

Country USA

Device

Macbook Pro 2021

Operating System

macOs Monterey

My Question or Issue

I was following the tutorial for Web Playback SDK at https://developer.spotify.com/documentation/web-playback-sdk/guide/

But the playback buttons for togglePlay, previousTrack, nextTrack, all return an Uncaught TypeError: Cannot read properties of null (reading 'togglePlay'). I can't seem to find what exactly is null, because the player object is not null when it's being called.

[Kiminchi · Accepted solution]

So it turns out based on how you render the DOM in index.js under src affects the state of the player. 

If you use 

ReactDOM.render(

<React.StrictMode>

<App />

</React.StrictMode>,

document.getElementById('root')

);

The player works fine, but if you use

const root = ReactDOM.createRoot(document.getElementById('root'));

root.render(

<React.StrictMode>

<App />

</React.StrictMode>

The player doesn't work.

[jfk52917]

I can't believe this is also the solution to my problem. A big, big thanks for posting this, I've been tearing my hair out trying to solve this.

[lebaguettex]

Is there any communcation from Spotify when or if they will upgrade the Web Playback SDK? It's been 2 years since React 18 was released.