Skip to content

Fix: add waveform-is-placeholder class to container on analysis failure - #20

Merged
arraypress merged 2 commits into
arraypress:mainfrom
Intenzi:fix/waveform-placeholder-class
Jul 30, 2026
Merged

Fix: add waveform-is-placeholder class to container on analysis failure#20
arraypress merged 2 commits into
arraypress:mainfrom
Intenzi:fix/waveform-placeholder-class

Conversation

@Intenzi

@Intenzi Intenzi commented Jul 29, 2026

Copy link
Copy Markdown
Contributor

Closes #19

Summary

This PR adds a CSS state class waveform-is-placeholder to the player container when the waveform generation fails and falls back to placeholder peaks (such as on CORS blocked tracks).

Details

  • Removes the .waveform-is-placeholder class at the start of load() to reset the player state when loading new tracks.
  • Adds the .waveform-is-placeholder class inside the load() catch block when analysis fails.
  • Adds unit tests in test/player.test.js to verify class toggling on load and failure.

Why this is needed

This class allows integrating applications (such as the WordPress Gutenberg editor) to identify when a decorative waveform is being shown and conditionally restyle it (e.g. flat-lining it to look like a standard progress bar instead of displaying randomised audio peaks).

Use of AI Tools

AI assistance: Yes
Tool(s): Antigravity IDE
Model(s): Gemini 3.5 Flash (Low)
Used for: Help in identifying and locating the relevant code lines to fix, approach of fixing. Tests were implemented via it. Final implementation was reviewed and tested by me.

@arraypress

Copy link
Copy Markdown
Owner

Thanks @Intenzi — clean, well-tested contribution. Merged and released in 1.24.0, live on npm now, and the new class is documented on the styling page.

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

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Placeholder waveforms are indistinguishable from real waveforms in the DOM

2 participants