Skip to content

Conversation

crisbeto
Copy link
Member

@crisbeto crisbeto commented Sep 3, 2025

Currently the way we render the buffer dots in the progress bar is by using a data: URL with an inline SVG. The problem with this approach is that it can trigger CSP errors and require users to allow all data: URLs, even if they don't use the buffer mode.

These changes work around the issue by rendering the dots using a radial gradient instead.

Fixes #31808.

Currently the way we render the buffer dots in the progress bar is by using a `data:` URL with an inline SVG. The problem with this approach is that it can trigger CSP errors and require users to allow all `data:` URLs, even if they don't use the buffer mode.

These changes work around the issue by rendering the dots using a radial gradient instead.

Fixes angular#31808.
@crisbeto crisbeto requested a review from a team as a code owner September 3, 2025 07:48
@crisbeto crisbeto added the target: patch This PR is targeted for the next patch release label Sep 3, 2025
@crisbeto crisbeto requested review from adolgachev and ok7sai and removed request for a team September 3, 2025 07:48
@crisbeto crisbeto added the action: merge The PR is ready for merge by the caretaker label Sep 4, 2025
@crisbeto crisbeto merged commit 878700d into angular:main Sep 4, 2025
29 checks passed
crisbeto added a commit to crisbeto/material2 that referenced this pull request Sep 8, 2025
…lar#31818)

Currently the way we render the buffer dots in the progress bar is by using a `data:` URL with an inline SVG. The problem with this approach is that it can trigger CSP errors and require users to allow all `data:` URLs, even if they don't use the buffer mode.

These changes work around the issue by rendering the dots using a radial gradient instead.

Fixes angular#31808.
adolgachev pushed a commit that referenced this pull request Sep 8, 2025
Currently the way we render the buffer dots in the progress bar is by using a `data:` URL with an inline SVG. The problem with this approach is that it can trigger CSP errors and require users to allow all `data:` URLs, even if they don't use the buffer mode.

These changes work around the issue by rendering the dots using a radial gradient instead.

Fixes #31808.
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Oct 5, 2025
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

action: merge The PR is ready for merge by the caretaker area: material/progress-bar target: patch This PR is targeted for the next patch release

Projects

None yet

Development

Successfully merging this pull request may close these issues.

bug(mat-progress-bar): Use of data: URI for buffer SVG is a regression that complicates strict CSP implementation

2 participants