Skip to content

Render GitHub user-attachments videos in module READMEs (currently shown as plain links) #2275

Description

@Dino0204

Description

On module pages, a bare https://github.com/user-attachments/assets/<id> URL in the upstream README (GitHub's drag-and-drop video idiom) renders as a <video> on GitHub, but on nuxt.com it falls through as an autolink and shows as a plain link.

Image

Example: the demo on https://nuxt.com/modules/studio appears as a bare link instead of the video (source: the nuxt-studio README at https://github.com/nuxt-content/nuxt-studio/blob/main/README.md).

Details

These asset URLs are publicly reachable anonymously — https://github.com/user-attachments/assets/<id> returns a 302 to an S3 URL that serves Content-Type: video/mp4 and supports range requests (verified: 206 Partial Content with Accept-Ranges: bytes) — so a native <video controls> pointing at the URL should work without any proxy.

Proposed approaches

Detecting autolinked user-attachments asset URLs and rendering them as video would cover this.

Two possible approaches:

  1. Render bare user-attachments autolinks (as opposed to ![]() images) as <video>, since the bare-URL form is GitHub's video idiom.
  2. Resolve each user-attachments asset URL (HEAD/GET) and branch on the response Content-Type<video> for video/*, <img> for image/*.

I'd appreciate it if you could let me know which direction you'd prefer.

I'd be happy to implement this, but I'd appreciate a maintainer confirming the approach (or preferred direction) before I open a PR.

References

Originally raised in nuxt-content/nuxt-studio#479.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions