Hacktoberfest 2026: những issue maintainer đã đánh dấu cho tháng Mười, đang mở và phù hợp người mới. Xem issue Hacktoberfest

revealjs speaker view: Layout select has no accessible name

Đã đóng Phù hợp với người mới
#15,159 0 bình luận 0 reaction 0 người được giao Xem trên GitHub

Maintainer thường phản hồi trong vòng 1 ngày

Một pull request liên quan đã được merge.

  • #15164 của @jooyoungseo — đã merge

Đánh giá

Độ khó
2/5
Thời gian dự kiến
1-3 giờ
Mức phù hợp với người mới
65/100
Loại issue
Lỗi
Độ rõ ràng
Đặc tả rõ ràng
Mức độ hoạt động
Sôi nổi
Công nghệ
html, javascript
Lĩnh vực
accessibility, frontend

Hướng nghiên cứu

Bắt đầu với markup chế độ xem diễn giả được đóng gói tại src/resources/formats/revealjs/reveal/plugin/notes/speaker-view.html, sau đó so sánh với issue reveal.js được liên kết trong báo cáo. Đặt cho danh sách chọn bố cục gốc một tên truy cập ổn định, đồng thời giữ nguyên ngữ nghĩa gốc và khả năng hiển thị tiêu điểm bàn phím, và duy trì đồng bộ các gói ghi chú được tạo. Công việc hoàn tất khi danh sách chọn thể hiện mục đích riêng biệt với giá trị đang chọn.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Mô tả

bug revealjs

Bug description

The speaker-view Layout dropdown has no programmatic accessible name.

This reproduces in a default Quarto revealjs deck as well as standalone upstream reveal.js 6.0.2. This is a downstream tracking report for the bundled notes plugin, not a Quarto-only regression.

Steps to reproduce

  1. Save the following as speaker.qmd and run quarto preview speaker.qmd.
  2. Advance past the title slide to First slide, then press S to open speaker view. Wait until the previews and speaker notes are visible.
  3. In the speaker-view window, inspect the layout select and the four top-level panel containers using browser accessibility/DOM tools. For the layout issue, focus the select and change its selected option using the keyboard.
---
title: Speaker view accessibility reproduction
format: revealjs
---

## First slide

First slide content.

::: {.notes}
Speaker notes for the first slide.
:::

## Second slide

Second slide content.

::: {.notes}
Speaker notes for the second slide.
:::

No custom filters, extensions, themes, or author CSS are used. The tested deck was rendered with quarto render speaker.qmd and served by a local HTTP static server.

Actual behavior

The visible label is a separate span, not a programmatic label for the native select:

<span class="speaker-layout-label">Layout: Default</span>
<select class="speaker-layout-dropdown">
  <option value="default">Default</option>
  <option value="wide">Wide</option>
  <option value="tall">Tall</option>
  <option value="notes-only">Notes only</option>
</select>

In the running speaker window, the select has no id, associated label, aria-label, aria-labelledby, or title; select.labels.length is 0. Its selected value is present, but that does not supply the control's purpose/name ("Layout"). With the select focused, ArrowDown changes its value from default to wide, and the visible text changes to "Layout: Wide". This is an accessible-name defect, not a claim that the native select or its options are entirely unavailable to every screen reader.

The select also has computed opacity: 0 and overlays the visible span. Opacity alone is not evidence that a control is excluded from a browser accessibility tree; the defect here is the missing label association.

Expected behavior

Give the native select a programmatically associated, stable accessible name such as "Layout" (e.g., a label with for/id or aria-labelledby pointing to an appropriate label). Preserve native select semantics and expose its selected value separately from its purpose. Verify keyboard focus visibility while retaining the custom visual styling.

Please incorporate the corresponding upstream fix into the bundled notes plugin (or backport as appropriate), keeping generated notes bundles synchronized.

Your environment and verification scope

Quarto CLI 1.11.5 (prerelease), bundling reveal.js 5.1.0 according to the generated reveal.js header. The installed speaker-view.html matches the current quarto-cli main source at 517944ddc441a64d66f18b90b51c7a9d3c1af5b8 after normalizing line endings/trailing whitespace. Runtime testing used the installed build, not a separately built main checkout.

Windows, Chromium-based Aside Browser (user agent Chrome/153.0.0.0). Verified through live DOM inspection, browser snapshots, and keyboard interaction. No JAWS/NVDA/VoiceOver speech-output session was run; this report does not assert a particular spoken utterance or behavior across all screen readers.

Source

Bundled speaker-view markup.

Quarto check output (relevant excerpt)

Quarto 1.11.5
Pandoc version 3.10.0: OK
Dart Sass version 1.101.0: OK
Deno version 2.7.14: OK
Typst version 0.15.1: OK
Checking versions of quarto dependencies: OK
Checking Quarto installation: OK
Version: 1.11.5
CodePage: 1252

Searched existing open and closed issues; no matching speaker-view report was found.

Upstream report

https://github.com/hakimel/reveal.js/issues/3951

Ngôn ngữ chính
JavaScript
Star
6.1k
Fork
471
Merge trung bình
16 giờ 41 phút
Pull request đã merge (30 ngày)
102

Chuẩn bị môi trường

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của quarto-dev/quarto-cli

Tất cả issue của quarto-dev/quarto-cli

Issue tương tự

Thêm issue về JavaScript

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.