Skip to content

Playlist Track: Show upload spinner inline - #81445

Draft
scruffian wants to merge 1 commit into
trunkfrom
scruffian/fix/playlist-loader
Draft

Playlist Track: Show upload spinner inline#81445
scruffian wants to merge 1 commit into
trunkfrom
scruffian/fix/playlist-loader

Conversation

@scruffian

Copy link
Copy Markdown
Contributor

What?

Fixes the Playlist Track upload loading indicator so it appears inline with the uploaded track row instead of on the line above it.

Why?

The spinner was rendered as a sibling before the full-width track button, which caused it to sit on its own line during uploads.

How?

The spinner now renders inside the track button's flex row with scoped spacing, and the existing temporary blob upload unit test verifies the inline placement.

Testing Instructions

  1. Open a post or page.
  2. Insert a Playlist block.
  3. Upload one or more audio files.
  4. Confirm each loading indicator appears on the same line as its track.

Testing Instructions for Keyboard

  1. Open a post or page.
  2. Insert a Playlist block using the keyboard.
  3. Use the block controls to upload an audio file.
  4. Confirm the loading indicator appears inline with the uploading track and the track remains keyboard reachable.

Screenshots or screencast

N/A.

Use of AI Tools

Created with assistance from OpenAI Codex. The changes and tests were reviewed and run locally before opening this PR.

Checks run: npm run test:unit packages/block-library/src/playlist-track/test, npm run lint:js -- packages/block-library/src/playlist-track/edit.js packages/block-library/src/playlist-track/test/edit.js, npm run lint:css -- packages/block-library/src/playlist-track/style.scss, and git diff --check.

@github-actions github-actions Bot added the [Package] Block library /packages/block-library label Aug 11, 2026
@github-actions

github-actions Bot commented Aug 11, 2026

Copy link
Copy Markdown

Size Change: +243 B (0%)

Total Size: 7.71 MB

📦 View Changed
Filename Size Change
build/scripts/block-library/index.min.js 357 kB +6 B (0%)
build/styles/block-library/playlist-track/style-rtl.css 560 B +32 B (+6.06%) 🔍
build/styles/block-library/playlist-track/style-rtl.min.css 529 B +35 B (+7.09%) 🔍
build/styles/block-library/playlist-track/style.css 559 B +30 B (+5.67%) 🔍
build/styles/block-library/playlist-track/style.min.css 528 B +35 B (+7.1%) 🔍
build/styles/block-library/style-rtl.css 22.5 kB +23 B (+0.1%)
build/styles/block-library/style-rtl.min.css 19 kB +28 B (+0.15%)
build/styles/block-library/style.css 22.6 kB +24 B (+0.11%)
build/styles/block-library/style.min.css 18.9 kB +30 B (+0.16%)

compressed-size-action

@scruffian
scruffian force-pushed the scruffian/fix/playlist-loader branch from 66fe0de to 0061ebd Compare August 11, 2026 16:46
@github-actions

Copy link
Copy Markdown

Flaky tests detected in 0061ebd.
Some tests passed with failed attempts. The failures may not be related to this commit but are still reported for visibility. See the documentation for more information.

🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/31514184821
📝 Reported tests:

As a user I want to be able to add multiple close buttons so that users can close the overlay from different positions in /test/e2e/specs/site-editor/navigation-overlay-template-part.spec.js, passed after 1 failed attempt.
Error: expect(locator).toHaveCount(expected) failed

Locator:  getByRole('button', { name: 'Close' })
Expected: 2
Received: 1
Timeout:  5000ms

Call log:
  - Expect "toHaveCount" with timeout 5000ms
  - waiting for getByRole('button', { name: 'Close' })
    14 × locator resolved to 1 element
       - unexpected value "1"

    at /home/runner/work/gutenberg/gutenberg/test/e2e/specs/site-editor/navigation-overlay-template-part.spec.js:198:33

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

Labels

[Package] Block library /packages/block-library

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant