Hacktoberfest 2026: die Issues, die Maintainer für den Oktober markiert haben – offen und einsteigerfreundlich. Hacktoberfest-Issues durchsuchen

Table headers are not associated with data cells

Offen
  • Stimmt etwas nicht?
#2,825 0 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Maintainer antworten meist innerhalb von 1 Tag

Dieses Issue hat noch niemand übernommen.

Bewertung

Schwierigkeit
3/5
Geschätzter Aufwand
1-2 Tage
Anfängerfreundlichkeit
55/100
Issue-Typ
Bug
Klarheit
Größtenteils klar
Aktivitätsstatus
Ruhig
Tech-Stack
react, typescript
Bereich
accessibility, frontend

Rechercherichtung

Start by locating the BlockNote table markup generated after row or column headers are defined, then inspect the DOM behavior described in the issue. Done means simple tables expose the appropriate scope relationships for column and row headers, with coverage for the generated markup.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Beschreibung

a11y

What’s broken?

This issue was identified during the Docs accessibility audit on a page containing table-related content.

Audited page:
https://docs.numerique.gouv.fr/docs/0d998bef-1b69-47ce-bd18-83d4d849c734/

In BlockNote tables, users can define row and column headers, and the generated markup uses <th> elements.

However, these headers are not explicitly associated with their related data cells.

There is currently no clear header relationship exposed through:

  • scope="col"
  • scope="row"
  • id / headers relationships for complex tables

Because of this, screen readers may not reliably announce which header applies to each table cell.

This can make table content difficult or impossible to understand for blind users navigating with assistive technologies.

What did you expect to happen?

Table headers should be correctly associated with their related cells.

For simple tables, BlockNote should expose header relationships using scope.

Example:

<table>
  <thead>
    <tr>
      <th scope="col">Name</th>
      <th scope="col">Role</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th scope="row">Alice</th>
      <td>Designer</td>
    </tr>
  </tbody>
</table>
Steps to reproduce
  1. Insert a table
  2. Define one or more row or column headers.
  3. Inspect the generated table in the DOM.
  4. Notice that the table uses <th> elements, but there is no explicit relationship between headers and data cells:
    • no scope="col" on column headers;
    • no scope="row" on row headers;
    • no id / headers relationship for more complex tables.
BlockNote version

0.51.4

Vorherrschende Sprache
TypeScript
Sterne
10.2k
Forks
772
Ø Merge
6 T. 21 Std.
Gemergte PRs (30 T.)
26

Entwicklungsumgebung

Erste Schritte

  1. Lesen Sie das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreiben Sie ins Issue, dass Sie es übernehmen — das erspart doppelte Arbeit.
  3. Forken Sie das Repository und arbeiten Sie in einem Branch.
  4. Öffnen Sie einen Pull Request, der die Issue-Nummer nennt.

Mehr aus TypeCellOS/BlockNote

Alle Issues in TypeCellOS/BlockNote

Ähnliche Issues

Weitere Issues zu TypeScript

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.