Skip to content

Two-channel photo flashes when enlarged: the channels arrive one after the other — wait for both #159

Description

@Devski

Reported by Dawid, 12.09.2026, from the enlarged photo on a public profile.

What happens

A photo with a second channel (#99, #100) is shown in the lightbox by ChannelReveal
(src/components/ui/channel-reveal.tsx): two plain <img> elements with the 1600 px
sources, the first setting the box's size, the second laid over it and cut at the handle.
Nothing waits for anything, so each channel paints the moment it arrives and the visitor
sees the picture assembled in front of them:

  • the first channel lands first — the whole photo shows undivided, then half of it is
    replaced when the second lands;
  • the second lands first — it has no box to fill yet, so it shows as nothing, and the
    picture appears in two jumps.

Either way it reads as a flash, not as loading. The lightbox preloads nothing, so on a
slow connection the gap between the two is long. Only the enlargement is affected: the
card shows the first channel alone.

What it should do

No flash. The enlargement waits for both channels and shows them together — until both
have loaded and decoded, the pair is not painted; when both are ready they appear at
once, already divided at the handle's position.

To settle while writing it:

  1. What holds the space while we wait — the card's smaller first channel as a poster
    behind the wait, or a plain progress indicator. Whatever it is, the overlay must not
    resize when the pair arrives.
  2. What happens when one of the two never loads: fall back to the channel that did,
    with the slider gone, rather than leaving the visitor with an empty frame for good.
  3. Whether stepping to the next photo with the arrows should hold the previous picture
    until the next pair is ready, for the same reason.

Verification

  • e2e in e2e/db/lightbox.spec.ts: with the second channel's response held back, the
    overlay shows neither channel; once both have answered, the picture appears with the
    divide in place — the first channel is never shown alone at full width.
  • Tried by Dawid on dev, on a laptop and on a phone.

Spec: SPEC.md A12 · Labels: bug, ux

Activity

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

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't workinguxUser experience: everything between the person and the product. Sequenced, never optional.

    Projects

    No projects

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions