-
Notifications
You must be signed in to change notification settings - Fork 35
Description
Description
On the web (desktop browser), markdown tables that exceed the viewport width are clipped on the right side with no way to scroll horizontally or copy the content. Users cannot see truncated columns at all.
Root Cause
Two issues in MarkdownView.tsx:
1. overflow: 'hidden' on tableContainer (line ~545)
tableContainer: {
overflow: 'hidden', // clips the ScrollView content
borderRadius: 8,
...
}The overflow: 'hidden' is needed for borderRadius to render correctly, but it clips the inner ScrollView's scrollbar and prevents any visible scroll affordance on web.
2. Scroll indicator hidden on web (line ~262)
<ScrollView
horizontal
showsHorizontalScrollIndicator={false} // no visual cue on web
...
>On native, the RNGH ScrollView with disallowInterruption was added (commit 6bf830ff) to fix Android gesture issues. But the web path still uses RN's built-in ScrollView with the indicator explicitly hidden. Desktop users have no affordance that the table is scrollable — no scrollbar, no fade, no arrow.
Steps to Reproduce
- Open Happier in a desktop web browser
- Have an agent produce a response with a wide markdown table (3+ columns with long text)
- Observe the right columns are cut off with no scroll indicator
Expected Behavior
- Table should be horizontally scrollable with a visible scrollbar on web
- All column content should be accessible
Suggested Fix
For the web path specifically:
- Set
showsHorizontalScrollIndicator={true}on web - Either restructure the container so
borderRadiusis applied to an inner wrapper that doesn't clip the scrollbar, or useoverflow-x: autoon the scroll container directly - Consider using a native HTML
<div style="overflow-x: auto">on web instead of RN'sScrollViewfor more natural desktop scroll behavior
Related Issues
- Android: tables in markdown are nearly impossible to scroll horizontally #92 — Android table scroll (gesture interference, partially fixed)
- Code blocks not horizontally scrollable - text wraps and clips #95 — Code blocks not scrollable
- Tables and code block diagrams are not horizontally scrollable on mobile #121 — iOS table scroll (same family of issues)
Screenshot
Right columns ("Reliability") truncated with no way to scroll or view full content.
