Skip to content

[BUG] Position/Size/Opacity/Weight preset buttons don't expose selected state to assistive tech #1769

Open
#1808
Open
[BUG] Position/Size/Opacity/Weight preset buttons don't expose selected state to assistive tech#1769
#1808
Labels
accessibilityAccessibility improvement (a11y)bugSomething isn't working correctlygssoc'26GirlScript Summer of Code 2026level:beginnerBeginner level - 20 ptstype:accessibilityAccessibilitytype:bugBug fix

Description

@magic-peach
magic-peach
opened on Sep 15, 2026

Bug description
Several button groups that function as toggle/selection controls (visually highlighting the active choice) don't set aria-pressed, so screen reader users have no way to know which option is currently selected.

Steps to reproduce

  1. Open the Image Overlay panel, upload an overlay image
  2. Inspect the Position grid (src/components/ImageOverlay.tsx:144), Size row (:167, :178, :189), and Opacity row (:207, :218, :229)
  3. Also check the Font Weight buttons in src/components/TextControls.tsx:196-215
  4. None of these buttons have aria-pressed, despite visually indicating an active state via background/border color

Expected behavior
Each button in these groups should set aria-pressed={isActive} so assistive tech announces the current selection.

Actual behavior
No aria-pressed attribute anywhere in these four button groups — a screen reader user has no way to know which position/size/opacity/weight is currently active.

Browser and OS info
Any — this is a screen-reader-observable issue, reproducible via axe DevTools or VoiceOver/NVDA on any platform.

Note: related to but distinct from #33 (audio toggle button focus state) — that issue is about a single specific button's visual focus ring; this one is about four separate button groups lacking the ARIA attribute entirely.

Activity

  1. magic-peach
    added
    bugSomething isn't working correctly
    gssoc'26GirlScript Summer of Code 2026
    accessibilityAccessibility improvement (a11y)
    level:beginnerBeginner level - 20 pts
    type:bugBug fix
    type:accessibilityAccessibility
    on Sep 15, 2026

  2. github-actions commented on Sep 15, 2026

    @github-actions
    github-actionsBot
    on Sep 15, 2026 – with GitHub Actions
    Contributor

    👋 Thanks for opening an issue, @magic-peach!

    Our maintainers will review this shortly 🚀

    Before you start working

    • 📖 Read the CONTRIBUTING.md guide
    • 💬 Wait for a maintainer to assign you the issue before starting work
    • 🔍 Search for existing issues to avoid duplicates

    For GSSoC'26 contributors

    If you're contributing under GirlScript Summer of Code 2026, please mention it in your comment when requesting assignment:

    "I'd like to work on this — contributing under GSSoC'26"

    Architecture notes

    Reframe is a static Next.js app with output: "export". Key points:

    • All video processing uses FFmpeg.wasm (client-side, no server)
    • headers() in next.config.ts won't work — use vercel.json instead
    • not-found.tsx requires public/404.html + vercel.json routes config

    Happy contributing! ⭐ Star the repo if you find it useful!

  3. github-actions commented on Sep 15, 2026

    @github-actions
    github-actionsBot
    on Sep 15, 2026 – with GitHub Actions
    Contributor

    Claude encountered an error —— View job

    I'll analyze this and get back to you.

  4. AFLAHAFI commented on Oct 9, 2026

    @AFLAHAFI
    AFLAHAFI
    on Oct 9, 2026

    /assign

  5. github-actions
    assigned
    AFLAHAFI
    on Oct 9, 2026

  6. github-actions commented on Oct 9, 2026

    @github-actions
    github-actionsBot
    on Oct 9, 2026 – with GitHub Actions
    Contributor

    Hey @AFLAHAFI, this issue has been assigned to you! 🎉 Please make progress within 5 days or it will be automatically unassigned due to inactivity.

  7. AFLAHAFI commented on Oct 10, 2026

    @AFLAHAFI
    AFLAHAFI
    on Oct 10, 2026

    The accessibility fix for #1769 is implemented and pushed to my fork. I've included a short demonstration of the updated preset controls, keyboard interaction, and selected-state accessibility attributes.

    Demo recording:

    Reframe-1769-Demo.mp4

  8. github-actions commented on Oct 12, 2026

    @github-actions
    github-actionsBot
    on Oct 12, 2026 – with GitHub Actions
    Contributor

    Hey @AFLAHAFI, just a friendly reminder that this issue has had no activity for 2 days. Please leave an update or let us know if you need help! ⏰

  9. github-actions commented on Oct 17, 2026

    @github-actions
    github-actionsBot
    on Oct 17, 2026 – with GitHub Actions
    Contributor

    Hey @AFLAHAFI, final warning! ⚠️ This issue has had no activity for 4 days and will be automatically unassigned in 24 hours if there is no update.

  10. github-actions
    unassigned
    AFLAHAFI
    on Oct 22, 2026

  11. github-actions commented on Oct 22, 2026

    @github-actions
    github-actionsBot
    on Oct 22, 2026 – with GitHub Actions
    Contributor

    This issue has been unassigned from @AFLAHAFI due to 5 days of inactivity and is open for anyone to pick up — comment /assign to claim it!

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

    accessibilityAccessibility improvement (a11y)bugSomething isn't working correctlygssoc'26GirlScript Summer of Code 2026level:beginnerBeginner level - 20 ptstype:accessibilityAccessibilitytype:bugBug fix

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions