LotusGuild/cinny
3
0
Fork 0
Code Issues 55 Pull Requests 2 Actions Packages Projects Releases Wiki Activity

[QA] §Q Inline media embeds: facade, one of each provider, TikTok portrait, post self-resize, Bluesky/Loom/Kick, toggle + cap #186

New Issue
Closed
opened 2026-09-17 23:24:09 -04:00 by jared · 1 comment
jared commented 2026-09-17 23:24:09 -04:00
Owner
Copy Link
Copy Source

Migrated from LOTUS_TESTING.md §Q on 2026-09-17 — the file is now reference-only.

How to report: tick each item as it passes; on FAIL comment with what you saw vs expected, browser/OS, web (chat.lotusguild.org) vs desktop (Tauri), theme, and any browser-console errors. Screenshots for anything visual.

Checklist

  • Q1. Facade + one of each kind plays in place
  • Q2. TikTok (the tricky one) + portrait fill
  • Q3. Post self-resize + Close / Fullscreen controls
  • Q4. New providers (unverified) + the toggle + the cap

The whole feature is behind Settings → General → "Inline Media Players" (default on). Everything loads from the homeserver's cached thumbnail first; the third-party player only mounts on Play. Test on the web build first, then re-check the video ones on desktop (Tauri) since the CSP differs. On any failure, grab the browser console (F12) — a blocked embed shows as a CSP frame-src violation naming the host.

Q1. Facade + one of each kind plays in place

Paste each of these into a room and confirm a media tile (not a plain link) with a thumbnail + play button, and that clicking Play mounts the player inline:

  • 16:9 video: a YouTube watch link, a Vimeo link, a Dailymotion link, a Streamable link, a Twitch VOD/clip, a Loom share link.
  • 9:16 portrait: a YouTube Shorts link (renders tall, not letterboxed).
  • Audio player: a Spotify track, a SoundCloud track, an Apple Music album, a Tidal album/track.
  • Post embed: an X/Twitter post, an Instagram post, a Reddit post.

Expected: ✅ tile shows the thumbnail; no request to the third party until you press Play (check DevTools → Network); the player then plays inline. ❌ tell me any that stay a plain link, show a blank frame, or hit the network before you click.

Q2. TikTok (the tricky one) + portrait fill

  1. Paste a full TikTok URL and a short copy-link (vm.tiktok.com/… or tiktok.com/t/…).
  2. Press Play on each.

Expected: both resolve to a clean 9:16 player that fills the box (no big empty band on the right). The short link shows a brief spinner while it resolves via oEmbed, then plays. ❌ tell me if a short link shows only the TikTok logo/♫ and never a play button, or if the player has dead space beside it.

Q3. Post self-resize + Close / Fullscreen controls

  1. Play a Reddit, Instagram, and X/Twitter post embed.
  2. Watch the card height as the embed loads.

Expected: the card grows to fit the post (no clipped/scrollbarless content, no giant empty box). A Close button (✕) collapses the player back to the thumbnail; video players also show a ⛶ Fullscreen control that works. Keyboard: Tab to the play button → it shows a visible focus ring.

Q4. New providers (unverified) + the toggle + the cap

  • Bluesky / Loom / Kick — these are freshly added and unverified live. Paste a bsky.app/profile/…/post/…, a loom.com/share/…, and a live kick.com/{channel} link. ✅ good if each plays/renders inline; ❌ if any is a broken frame (for Bluesky especially, note whether a handle URL resolves or only a DID one does — grab the console).
  • Toggle off: Settings → General → Inline Media Players off → every media link reverts to a plain link tile (no player).
  • Cap: paste a message with 8+ media links → at most 6 preview cards render (the rest are suppressed), and the page stays responsive.
_Migrated from `LOTUS_TESTING.md` §Q on 2026-09-17 — the file is now reference-only._ **How to report:** tick each item as it passes; on FAIL comment with what you saw vs expected, browser/OS, web (chat.lotusguild.org) vs desktop (Tauri), theme, and any browser-console errors. Screenshots for anything visual. **Checklist** - [ ] Q1. Facade + one of each kind plays in place - [ ] Q2. TikTok (the tricky one) + portrait fill - [ ] Q3. Post self-resize + Close / Fullscreen controls - [ ] Q4. New providers (unverified) + the toggle + the cap --- The whole feature is behind **Settings → General → "Inline Media Players"** (default **on**). Everything loads from the homeserver's cached thumbnail first; the third-party player only mounts on **Play**. Test on the **web** build first, then re-check the video ones on **desktop (Tauri)** since the CSP differs. On any failure, grab the **browser console** (F12) — a blocked embed shows as a CSP `frame-src` violation naming the host. ### Q1. Facade + one of each kind plays in place Paste each of these into a room and confirm a media tile (not a plain link) with a thumbnail + play button, and that clicking Play mounts the player **inline**: - **16:9 video:** a YouTube `watch` link, a Vimeo link, a Dailymotion link, a Streamable link, a Twitch VOD/clip, a Loom `share` link. - **9:16 portrait:** a YouTube **Shorts** link (renders tall, not letterboxed). - **Audio player:** a Spotify track, a SoundCloud track, an Apple Music album, a Tidal album/track. - **Post embed:** an X/Twitter post, an Instagram post, a Reddit post. **Expected:** ✅ tile shows the thumbnail; **no** request to the third party until you press Play (check DevTools → Network); the player then plays inline. ❌ tell me any that stay a plain link, show a blank frame, or hit the network before you click. ### Q2. TikTok (the tricky one) + portrait fill 1. Paste a **full** TikTok URL and a **short** copy-link (`vm.tiktok.com/…` or `tiktok.com/t/…`). 2. Press Play on each. **Expected:** both resolve to a clean **9:16** player that **fills the box** (no big empty band on the right). The short link shows a brief spinner while it resolves via oEmbed, then plays. ❌ tell me if a short link shows only the TikTok logo/♫ and never a play button, or if the player has dead space beside it. ### Q3. Post self-resize + Close / Fullscreen controls 1. Play a **Reddit**, **Instagram**, and **X/Twitter** post embed. 2. Watch the card height as the embed loads. **Expected:** the card **grows to fit** the post (no clipped/scrollbarless content, no giant empty box). A **Close** button (✕) collapses the player back to the thumbnail; video players also show a **⛶ Fullscreen** control that works. Keyboard: Tab to the play button → it shows a visible **focus ring**. ### Q4. New providers (unverified) + the toggle + the cap - **Bluesky / Loom / Kick** — these are freshly added and unverified live. Paste a `bsky.app/profile/…/post/…`, a `loom.com/share/…`, and a live `kick.com/{channel}` link. ✅ good if each plays/renders inline; ❌ if any is a broken frame (for **Bluesky** especially, note whether a **handle** URL resolves or only a DID one does — grab the console). - **Toggle off:** Settings → General → **Inline Media Players** off → every media link reverts to a plain link tile (no player). - **Cap:** paste a message with **8+** media links → at most **6** preview cards render (the rest are suppressed), and the page stays responsive. ---
jared added this to the Manual QA backlog milestone 2026-09-17 23:24:09 -04:00
jared added the securityarea: mediaqa labels 2026-09-17 23:24:09 -04:00
jared commented 2026-09-18 19:11:16 -04:00
Author
Owner
Copy Link
Copy Source

Verified on the local dev homeserver with Playwright (URL previews enabled on the dev Synapse so the facades get their homeserver-proxied thumbnails), counting every non-local host the page contacts:

check result
Q1 facade for YouTube, Vimeo, Spotify, TikTok (portrait), Twitch, Reddit, Bluesky, Loom, Kick each renders a card with the provider badge, title and a Play control; 0 <iframe> in the timeline before any click ✓
Q1 thumbnails served from the homeserver (localhost media thumbnail of the URL preview), not the provider ✓
Q1 no third-party network until Play external hosts contacted on load: none of the providers ✓ (the only external hosts were Google Fonts — separate finding, #214)
Q1 Play YouTube facade swaps to an <iframe> on www.youtube-nocookie.com; only then is that host contacted; Fullscreen + Close controls appear ✓ (the video itself said "unavailable" because YouTube refuses embeds from a 127.0.0.1 origin — not a client issue)
Q4 Bluesky / Loom / Kick facades render (title resolved through the homeserver preview: "Bluesky", "Check out loom.com…", "xQc Stream - Watch Live on Kick"); playback not exercised
Q3 post self-resize / Q2 TikTok playback / toggle + cap not exercised (need the provider frame to load, which the dev origin blocks)

Prod CSP for the player frames (frame-src 'self' https:) is unchanged. Closing; the Google Fonts leak is #214.

Verified on the local dev homeserver with Playwright (URL previews enabled on the dev Synapse so the facades get their homeserver-proxied thumbnails), counting every non-local host the page contacts: | check | result | |---|---| | Q1 facade for YouTube, Vimeo, Spotify, TikTok (portrait), Twitch, Reddit, Bluesky, Loom, Kick | each renders a card with the provider badge, title and a Play control; **0 `<iframe>`** in the timeline before any click ✓ | | Q1 thumbnails | served from the **homeserver** (`localhost` media thumbnail of the URL preview), not the provider ✓ | | Q1 no third-party network until Play | external hosts contacted on load: **none of the providers** ✓ (the only external hosts were Google Fonts — separate finding, #214) | | Q1 Play | YouTube facade swaps to an `<iframe>` on `www.youtube-nocookie.com`; only then is that host contacted; Fullscreen + Close controls appear ✓ (the video itself said "unavailable" because YouTube refuses embeds from a `127.0.0.1` origin — not a client issue) | | Q4 Bluesky / Loom / Kick | facades render (title resolved through the homeserver preview: "Bluesky", "Check out loom.com…", "xQc Stream - Watch Live on Kick"); playback not exercised | | Q3 post self-resize / Q2 TikTok playback / toggle + cap | not exercised (need the provider frame to load, which the dev origin blocks) | Prod CSP for the player frames (`frame-src 'self' https:`) is unchanged. Closing; the Google Fonts leak is #214.
jared closed this issue 2026-09-18 19:11:16 -04:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
a11y
Accessibility: keyboard, screen reader, contrast, motion
 area: appearance
Client area: appearance
 area: auth-session
Client area: auth-session
 area: build-ci
Client area: build-ci
 area: calls
Client area: calls
 area: desktop
Client area: desktop
 area: media
Client area: media
 area: messaging
Client area: messaging
 area: mobile
Client area: mobile
 area: moderation
Client area: moderation
 area: navigation
Client area: navigation
 area: notifications
Client area: notifications
 area: settings
Client area: settings
 area: threads
Client area: threads
 bug
Something is not working
 dependencies
Third-party package versions and advisories
 docs
README / LOTUS_* docs wrong or missing
 duplicate
This issue or pull request already exists
 enhancement
New feature
 help wanted
Need some help
 invalid
Something is wrong
 needs-human-review
performance
Re-render storms, leaks, heavy work on hot paths
 planning
priority: critical
Data loss, security hole, or crash on a main path
 priority: high
Broken feature or serious usability problem
 priority: low
Minor issue or polish
 priority: medium
Wrong behaviour in an edge case or notable degradation
 qa
Manual QA: shipped, needs a human in a real environment
 question
More information is needed
 research
security
XSS, unsafe URLs, data leaks, auth/session
 tech-debt
Code health, dead code, fragile patterns
 ux
Usability or visual inconsistency
 wontfix
This won't be fixed
No labels area: media qa security
Milestone
No items
No Milestone Manual QA backlog
Projects
Clear projects
No projects
Assignees
Clear assignees
cole (Cole Keller) jared (Jared Vititoe) nathan (Nathan Vititoe)
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: LotusGuild/cinny#186