search

spicetify / cli

Command-line tool to customize Spotify client. Supports Windows, MacOS, and Linux.
https://spicetify.app
GNU Lesser General Public License v2.1
18.17k stars 716 forks source link

CSS Map reset 1.1.72 #1249

Closed ToasterDEV closed 2 years ago

ToasterDEV commented 2 years ago

ℹ Computer information

📝 Provide detailed reproduction steps (if any)

  1. Upgrade to spicetify 2.7.3 via spicetify upgrade
  2. Apply spicetify through spicetify restore backup apply enable-devtool
  3. Spotify will fail to load, reporting missing source maps.

✔️ Expected result

Spotify would load as per the previous version of both the app and spicetify.

❌ Actual result

The source maps being missing leads to Spotify failing to load at all.

📷 Screenshots

image image

Also attaching text output of DevTools:

vendor~xpui.js:29 EmeEncryptionSchemePolyfill: Waiting to detect encryptionScheme support.
vendor~xpui.js:29 McEncryptionSchemePolyfill: Waiting to detect encryptionScheme support.
spicetifyWrapper.js:857 [Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.
vendor~xpui.js:29 Error: Minified React error #267; visit https://reactjs.org/docs/error-decoder.html?invariant=267&args[]=null for the full message or use the non-minified dev environment for full errors and additional helpful warnings. 
    at Object.cloneElement (vendor~xpui.js:29)
    at Object.Spicetify._cloneSidebarItem (spicetifyWrapper.js:879)
    at xpui.js:1
    at Ro (vendor~xpui.js:29)
    at ra (vendor~xpui.js:29)
    at xs (vendor~xpui.js:29)
    at Ts (vendor~xpui.js:29)
    at Os (vendor~xpui.js:29)
    at gs (vendor~xpui.js:29)
    at Ks (vendor~xpui.js:29)
xpui.js:1 Error: Minified React error #267; visit https://reactjs.org/docs/error-decoder.html?invariant=267&args[]=null for the full message or use the non-minified dev environment for full errors and additional helpful warnings. 
    at Object.cloneElement (vendor~xpui.js:29)
    at Object.Spicetify._cloneSidebarItem (spicetifyWrapper.js:879)
    at xpui.js:1
    at Ro (vendor~xpui.js:29)
    at ra (vendor~xpui.js:29)
    at xs (vendor~xpui.js:29)
    at Ts (vendor~xpui.js:29)
    at Os (vendor~xpui.js:29)
    at gs (vendor~xpui.js:29)
    at Ks (vendor~xpui.js:29)
DevTools failed to load source map: Could not load content for https://xpui.app.spotify.com/vendor~xpui.js.map: Connection error: net::ERR_NAME_NOT_RESOLVED
DevTools failed to load source map: Could not load content for https://xpui.app.spotify.com/xpui.js.map: Connection error: net::ERR_NAME_NOT_RESOLVED
DevTools failed to load source map: Could not load content for https://xpui.app.spotify.com/xpui-desktop-routes-homepage-takeover-ad.js.map: Connection error: net::ERR_NAME_NOT_RESOLVED
DevTools failed to load source map: Could not load content for https://xpui.app.spotify.com/566.js.map: Connection error: net::ERR_NAME_NOT_RESOLVED
DevTools failed to load source map: Could not load content for https://xpui.app.spotify.com/xpui-routes-home.js.map: Connection error: net::ERR_NAME_NOT_RESOLVED
DevTools failed to load source map: Could not load content for https://xpui.app.spotify.com/xpui-desktop-modals.js.map: Connection error: net::ERR_NAME_NOT_RESOLVED

Network is able to reach spotify.com itself:

❯ ping spotify.com

Pinging spotify.com [2600:1901:1:c36::] with 32 bytes of data:
Reply from 2600:1901:1:c36::: time=8ms
Reply from 2600:1901:1:c36::: time=7ms
Reply from 2600:1901:1:c36::: time=10ms
Reply from 2600:1901:1:c36::: time=8ms

Ping statistics for 2600:1901:1:c36:::
    Packets: Sent = 4, Received = 4, Lost = 0 (0% loss),
Approximate round trip times in milli-seconds:
    Minimum = 7ms, Maximum = 10ms, Average = 8ms

But not xpui.app.spotify.com:

❯ ping xpui.app.spotify.com
Ping request could not find host xpui.app.spotify.com. Please check the name and try again.
dig xpui.app.spotify.com

; <<>> DiG 9.16.6-Ubuntu <<>> xpui.app.spotify.com
;; global options: +cmd
;; Got answer:
;; ->>HEADER<<- opcode: QUERY, status: NXDOMAIN, id: 25312
;; flags: qr rd ra; QUERY: 1, ANSWER: 0, AUTHORITY: 0, ADDITIONAL: 1

;; OPT PSEUDOSECTION:
; EDNS: version: 0, flags:; udp: 1232
;; QUESTION SECTION:
;xpui.app.spotify.com.          IN      A

;; Query time: 10 msec

Perhaps the location of the source map has changed?

TheGeeKing commented 2 years ago

Can you run Spicetify.test() in devtool and send a screenshot of the result?

itsmeow commented 2 years ago

xpui.app.spotify.com is local routing, the source map errors are meaningless. The actual error here is a React minified error - the error is un-minified at this URL: https://reactjs.org/docs/error-decoder.html?invariant=267&args[]=null

It's likely Spicetify.React is broken again, probably a quick fix.

ToasterDEV commented 2 years ago

Spicetify.test()

Sure! image

Spicetify.test()
spicetifyWrapper.js:156 25/25 Spicetify methods and objects are OK.
spicetifyWrapper.js:165 34/34 Spicetify.Player methods and objects are OK.
spicetifyWrapper.js:169 Spicetify method version exists but is not in the method list. Consider adding it.
spicetifyWrapper.js:169 Spicetify method expFeatureOverride exists but is not in the method list. Consider adding it.
spicetifyWrapper.js:175 Spicetify.Player method playUri exists but is not in the method list. Consider adding it.
undefined
ToasterDEV commented 2 years ago

xpui.app.spotify.com is local routing, the source map errors are meaningless. The actual error here is a React minified error - the error is un-minified at this URL: https://reactjs.org/docs/error-decoder.html?invariant=267&args[]=null

It's likely Spicetify.React is broken again, probably a quick fix.

Alright then, will keep an eye out for next time. Thanks!

itsmeow commented 2 years ago

Got the update link, it works just fine on my machine. I would say reinstall Spotify and run spicetify backup apply (do not restore)

itsmeow commented 2 years ago

Nevermind custom apps are indeed broken. Forgot to enable them on my laptop.

itsmeow commented 2 years ago

The CSS map has reset image

This means Lyrics Plus cannot match main-navbar-navbarItem, causing error

Temporary fix: disable lyrics plus

itsmeow commented 2 years ago

@khanhas How did you regenerate the CSS map in 4fa2aca70e8a0cdeafbfb87e83acae7c4223cfb6? Can it be reproduced on the new version, or was it manual?

Here's the force update link btw https://upgrade.scdn.co/upgrade/client/win32-x86/spotify_installer-1.1.72.439.gc253025e-33.exe

TheGeeKing commented 2 years ago

We need @khanhas to reveal if he has a secret css remapper or if I need to do it again🥲😭

CharlieS1103 commented 2 years ago

If you don't have an automated script for the CSS remap @khanhas I do have a bit of an idea for a shitty semi-automatic one to take a majority of the workload off.

TheGeeKing commented 2 years ago

@khanhas How did you regenerate the CSS map in 4fa2aca70e8a0cdeafbfb87e83acae7c4223cfb6? Can it be reproduced on the new version, or was it manual?

Here's the force update link btw https://upgrade.scdn.co/upgrade/client/win32-x86/spotify_installer-1.1.72.439.gc253025e-33.exe

Some people found code that seem like a css remapper maker in preprocess

TheGeeKing commented 2 years ago

If you don't have an automated script for the CSS remap @khanhas I do have a bit of an idea for a shitty semi-automatic one to take a majority of the workload off.

My method was pretty fast and good at the end so should be ok even if it was a bit boring.

If the HTML is exactly the same (no new elements in it) a simple script can do the trick.

CharlieS1103 commented 2 years ago

@khanhas How did you regenerate the CSS map in 4fa2aca? Can it be reproduced on the new version, or was it manual? Here's the force update link btw https://upgrade.scdn.co/upgrade/client/win32-x86/spotify_installer-1.1.72.439.gc253025e-33.exe

Some people found code that seem like a css remapper maker in preprocess

That code was not a CSS remapper, it was the initialization of the CSS map and fetcher of the CSS map per version.

khanhas commented 2 years ago

Damn. Now they reset every new Spotify version. I don't have script to it. I used vscode regexp search and multiple cursor feature and I can do it manually fairly quick. But do it every version would be hell. Can you guys check if CSS IDs changed completely or just some of them?

TheGeeKing commented 2 years ago

Damn. Now they reset every new Spotify version. I don't have script to it. I used vscode regexp search and multiple cursor feature and I can do it manually fairly quick. But do it every version would be hell. Can you guys check if CSS IDs changed completely or just some of them?

I did like that for >=1.1.66

@itsmeow found that https://open.scdn.co/cdn/build/web-player/web-player.95528e5d.css

We were discussing about that on the discord btw

itsmeow commented 2 years ago

I am writing a remapper using two xpui.css files from 71 and 72 and diff + regex processing.

khanhas commented 2 years ago

@itsmeow I will leave it to you then. I'm probably busy till next weekends so if you can make an update on css map that would be awesome. Also please append new new, instead of replacing. I still want to keep backward compatible with v1.1.69 and 1.1.71.

I have an idea or two to automate for future-proof but I need more time.

itsmeow commented 2 years ago

@khanhas We already added backwards compat for the css map! See #1026 We just have to make a minor (2.8) release with the new map immediately after merge