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

Aperta Adatta ai principianti
#734 1 commento 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

@AbbasFullstack ci sta già lavorando.

Dal 12/11/2026.

Valutazione

Difficoltà
2/5
Tempo stimato
1-3 ore
Idoneità per principianti
62/100
Tipo di issue
Bug
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
html, markdown, react, typescript
Ambito
frontend

Direzione di ricerca

L'estrazione delle tabelle si trova in extractTableDataFromElement e tableDataToMarkdown; inizia leggendo come vengono selezionate le righe del corpo e come vengono lette le celle immagine. Riproduci con le due tabelle nell'issue: la prima deve mantenere il testo alternativo e la seconda deve mantenere Revenue e Costs come Markdown valido con una riga di intestazione vuota. È completato quando entrambi i percorsi di copia mantengono ogni cella e i test esistenti sulle tabelle continuano a passare.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

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.

Lingua principale
TypeScript
Stelle
5.8k
Fork
334
Merge medio
2g 4h
PR unite (30g)
33

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di vercel/streamdown

Tutte le issue di vercel/streamdown

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.