Skip to content

Support SVG icons and previews - #1021

Open
yharby wants to merge 6 commits into
radiantearth:mainfrom
yharby:svg-support
Open

yharby wants to merge 6 commits into
radiantearth:mainfrom
yharby:svg-support

Conversation

@yharby

@yharby yharby commented Sep 24, 2026 •

Copy link
Copy Markdown

Proposed Changes

Shows SVG (image/svg+xml) icons, thumbnails and previews. The detection lives in stac-js, see moregeo-it/stac-js#26. Draft until that is released, then this PR bumps stac-js.

Hardening from review:

  • authMedia.js serves SVG as a data: URL instead of a blob URL (opaque origin)
  • HrefActions.vue keeps "Download" instead of "Open" for image/svg+xml
  • AuthImage hides images that fail to load, cards fall back to the next thumbnail
  • docs/options.md recommends serving SVG data from a different origin and a CSP without unsafe-inline

A shared SVG loader for previews on the map follows in ol-stac.

Checklist

  • Added changelog entry
  • Added translations for new or changed UI strings (none)
  • Executed linter (npm run lint)
  • Added and executed tests (npm test) (e2e, integration tests unchanged)

@m-mohr m-mohr added this to the 5.2.0 milestone Sep 24, 2026
@m-mohr

m-mohr commented Sep 24, 2026 •

Copy link
Copy Markdown
Collaborator

We may consider the following as SVG seem to have a security problem with scripts potentially and render in a generic (non-size) image tag usually worse than a raster image:

stac-browser

  • authMedia.js: serve SVG as a data: URL instead of a blob URL (opaque origin, so its scripts can't reach stac-browser storage or cookies)
  • HrefActions.vue: keep "Download" instead of "Open" for image/svg+xml
  • AuthImage: handle @error (hide icons and logo, fall back to the next thumbnail)

ol-stac

  • Add a shared SVG loader (fetch, check it's an SVG, add width/height from viewBox, return a data: URL) and use it for SVG previews in addPreviewImage_; stac-browser can reuse it to retry failed SVGs

Docs

  • Recommend serving SVG data from a different origin than stac-browser, and a CSP without unsafe-inline

See also moregeo-it/stac-js#26 (comment)

@yharby

yharby commented Sep 25, 2026

Copy link
Copy Markdown
Author

Done up to 18de977. SVG now loads as a data: URL, Download is kept for SVG, AuthImage hides failed images and cards fall back to the next thumbnail, and docs/options.md has a note on origin and CSP. The ol-stac loader will follow as a separate PR there.

@yharby
yharby marked this pull request as ready for review October 6, 2026 22:14
@yharby
yharby requested a review from m-mohr as a code owner October 6, 2026 22:14

This branch has not been deployed

No deployments
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.

2 participants