Table copy and download lose header cells in body rows, image cells, and tables without a header row

Abierto Apto para principiantes
  • ¿Algo no está bien?
#734 1 comentario 0 reacciones 0 asignados Ver en GitHub

Los mantenedores suelen responder en 1 día

@AbbasFullstack ya está trabajando en esto.

Desde el 12/11/2026.

Evaluación

Dificultad
2/5
Tiempo estimado
1-3 horas
Aptitud para principiantes
62/100
Tipo de issue
Error
Claridad
Bien especificado
Estado de actividad
Activo
Stack tecnológico
html, markdown, react, typescript
Área
frontend

Línea de trabajo

La extracción de tablas está en extractTableDataFromElement y tableDataToMarkdown; empieza leyendo cómo se seleccionan las filas del cuerpo y cómo se leen las celdas de imagen. Reproduce con las dos tablas del issue: la primera debe conservar el texto alternativo y la segunda debe conservar Revenue y Costs como Markdown válido con una fila de encabezado vacía. Está terminado cuando ambas rutas de copia conservan cada celda y las pruebas de tablas existentes siguen pasando.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

Bug Description

Table copy and download (Markdown, CSV and TSV) read the table with extractTableDataFromElement, which loses content in three cases:

  1. Header cells in body rows are dropped. It reads only td in tbody tr. This happens with HTML tables that use row headers, such as <tr><th>Revenue</th><td>100</td></tr>.
  2. Images lose their alt text. It takes only text content. A cell with ![Acme logo](...) is copied as "Image not available" if the image failed to load, or as an empty cell if it loaded.
  3. A table without a header row copies as an empty string. tableDataToMarkdown returns "" when there are no headers, so the whole table is lost.
Steps to Reproduce
  1. Open https://streamdown.ai/playground and replace the input with: 
    | Logo | Name |
| --- | --- |
| ![Acme logo](https://example.com/logo.png) | Acme |

<table><tbody><tr><th>Revenue</th><td>100</td></tr><tr><th>Costs</th><td>40</td></tr></tbody></table>
  2. On the first table, choose Copy table → Markdown.
  3. On the second table, choose Copy table → Markdown.
Expected Behavior
  • First table: | Acme logo | Acme |, or Markdown image syntax for the cell.
  • Second table: a valid table that keeps every cell, including Revenue and Costs. For example, it could use an empty header row so the GFM table stays valid.
Actual Behavior
  • First table: | Image not available | Acme |, because the image failed to load. From the source, a loaded image gives an empty cell.
  • Second table: an empty string. From the source, CSV and TSV keep only 100 and 40; the row headers are lost.
Code Sample
<Streamdown>
  {"<table><tbody><tr><th>Revenue</th><td>100</td></tr></tbody></table>"}
</Streamdown>
Streamdown Version

2.7.1

React Version

19.3.1

Browser(s)

Chrome (desktop)

Operating System

macOS

Additional Context

Possible fixes in extractTableDataFromElement / tableDataToMarkdown:

  • read th, td in body rows;
  • use img.alt (or ![alt](src)) for image cells, and skip the image fallback and download button;
  • when there are no headers, emit an empty header row and delimiter rather than returning "".

Related: #553 (line breaks in cells), which is already fixed.

Lenguaje dominante
TypeScript
Estrellas
5.8k
Forks
334
Merge medio
2 d 4 h
PR fusionados (30 d)
33

Preparar el entorno

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de vercel/streamdown

Todos los issues de vercel/streamdown

Issues similares

Más issues de TypeScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.