Hacktoberfest 2026: as issues que os mantenedores marcaram para outubro, abertas e boas para iniciantes. Ver issues do Hacktoberfest

Table headers are not associated with data cells

Aberta
#2,825 0 comentários 0 reações 0 responsáveis Ver no GitHub

Ninguém assumiu esta issue ainda.

Avaliação

Dificuldade
3/5
Tempo estimado
1-2 dias
Facilidade para iniciantes
55/100
Tipo de issue
Bug
Clareza
Razoavelmente clara
Status de atividade
Pouca atividade
Stack de tecnologia
react, typescript
Domínio
accessibility, frontend

Direção de pesquisa

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.

Escrita pelo modelo de indexação a partir do texto da issue.

Descrição

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

Linguagem predominante
TypeScript
Estrelas
10.2k
Forks
772
Merge médio
6d 3h
PRs com merge (30d)
26

Guia de contribuição

Abrir o guia de contribuição

Primeiros passos

  1. Leia a issue inteira e depois o guia de contribuição do projeto.
  2. Comente na issue dizendo que vai assumir — evita que duas pessoas façam o mesmo trabalho.
  3. Faça um fork do repositório e trabalhe em uma branch.
  4. Abra um pull request que referencie o número da issue.

Mais de TypeCellOS/BlockNote

Todas as issues de TypeCellOS/BlockNote

Issues semelhantes

Mais issues de TypeScript

Receba novas issues na sua caixa de entrada

Um resumo curto de issues do GitHub para quem está começando.