Skip to content

Lyrics broken on current Spotify client: "NO LYRICS AVAILABLE" on lyrics page and full screen display #45

Description

@vrtg25

Note: this issue and the fixes were produced with the help of Claude Code . The diagnosis is based on direct inspection of the client bundles and runtime testing, not speculation.

Spotify for Windows (64 bit)
1.3.0.277.g5441bb3e
Spicetify v2.45.0

Fix: "NO LYRICS AVAILABLE" on the lyrics page and full screen display

Date: 2026-09-15
Affected: With the PioneerVFD theme active, both lyrics surfaces show "NO LYRICS AVAILABLE" while native Spotify lyrics work fine without the theme:

  1. Lyrics page (/lyrics route) — the theme's overlay covers the native lyrics that are actually rendering fine underneath
  2. Full screen display (cinema) — the theme's own lyrics fetch fails and there is no fallback

Root cause 1: lyrics page

Spotify redesigned the lyrics page DOM in the current client:

  1. All old selectors are dead. The theme extension (pioneerVFD.js) detects lyric lines via class names such as lyrics-lyricsContent-lyric. In the current client those classes no longer exist — lyric line class names are now build-time hashes (e.g. rzOQhNuCNTsDR8rE8ss1) and the lines carry no data-testid at all (the "":"lyrics-line" prop visible in the minified bundle is dropped at render time).
  2. With no lines detected, syncNoLyricsPanel() (pioneerVFD.js ~line 6962) declares "no lyrics" 1400 ms after entering the /lyrics route, sets data-pvfd-nolyrics="on" on <body>, and the CSS shows the "NO LYRICS AVAILABLE" overlay on top of the perfectly fine native lyrics.

Fix 1 — Extensions/pioneerVFD.js (core)

PVFD_LYRIC_LINE_SELECTOR gains a selector for the new DOM (old selectors kept for backwards compatibility):

// New lyric lines: no testid, hashed class names, but every line carries
// dir="auto" inside the container Spotify stamps with inline
// --lyrics-color-active variables
"div[style*='--lyrics-color-active'] div[dir='auto']"

PVFD_LYRIC_ACTIVE_SELECTOR also gains [data-active="true"].

Fix 1 — Themes/PioneerVFD/user.css (LCD styling)

The 4 lyric LCD rules gain the new container/line selectors to restore the theme's look: color variables (--lyrics-color-*), LCD panel background, pixel font + glow, large font size (clamp(26px, 3.6vw, 44px)).

Known limitation: the active line's class is a build-time hash, so static CSS cannot target it — active-line highlight/scale-up does not currently apply. Could be restored with runtime sampling in the extension (the class that appears on exactly one line at a time = active line).

Root cause 2: full screen display

The full screen display does not read the native DOM at all — it has its own pipeline:

  • fetchPvfdLyrics() (pioneerVFD.js ~line 5608) calls 3 Spotify endpoints directly via Spicetify.CosmosAsync (color-lyrics/v2 + 2 legacy fallbacks).
  • Measured on the current client: all three endpoints fail — wg://lyrics-views/v2 fails with error code -1 (Resolver not found) (the wg:// scheme resolver has been removed from the new client), and both spclient endpoints return request errors.
  • showPvfdLyricsOrFallback() (pioneerVFD.js ~line 5940) shows "NO LYRICS AVAILABLE" on null with no fallback path.

Fix 2 — Extensions/pioneerVFD.js

fetchPvfdLyrics now falls back in this order:

  1. Spotify endpoints (3, original path) — kept for when they work again
  2. lrclib.net public lyrics provider (new fetchLrclibLyrics() + parsePvfdLrc()) — requests https://lrclib.net/api/get with track/artist/album/duration and parses LRC [mm:ss.xx] into {time, dur, text}, so timed synced scrolling works. Verified: CORS open (Access-Control-Allow-Origin: *), reachable, with 2 retries on 503
  3. Native lyrics page DOM scrape (showPvfdLyricsOrFallback failure branch) — grabs line text via PVFD_LYRIC_LINE_SELECTOR and renders statically (only when the lyrics page is mounted in the background)
  4. "NO LYRICS AVAILABLE" only when everything fails

Note: lrclib.net is a free public service; step 2 sends the track/artist names to it (same provider the Lyrics Plus extension uses). Remove that layer if unwanted.

Deploy steps

D:\PioneerVFD-5.1 is only the source directory; changes must be synced to the running copies:

cp Extensions/pioneerVFD.js "$APPDATA/spicetify/Extensions/pioneerVFD.js"
cp Extensions/pioneerVFD.js "$APPDATA/Spotify/Apps/xpui/extensions/pioneerVFD.js"
cp Themes/PioneerVFD/user.css "$APPDATA/spicetify/Themes/PioneerVFD/user.css"
spicetify apply

Then fully restart Spotify.

Verification / future debugging

The lyrics-page verdict logic (syncNoLyricsPanel, pioneerVFD.js ~line 6962):

  • Entering the /lyrics route drops the cover ("wait")
  • Each tick checks whether PVFD_LYRIC_LINE_SELECTOR matches any lyric lines
  • 1400 ms of no lines → data-pvfd-nolyrics="on" → overlay stays

For diagnostics, temporarily inject a banner at the end of attach() (a document.body div + setInterval counting selector hits), or inspect the lyrics page with DevTools (install the DevTools extension from Spicetify Marketplace, or run spicetify enable-devtools).

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions