[eric] dock: agent tiles had no accessible name and a browser tile's hover card was an unlabeled screenshot

This commit is contained in:
ciregenz
2026-07-31 20:05:51 -07:00
parent de926fd16f
commit 5a66b708b8
2 changed files with 14 additions and 13 deletions
@@ -196,6 +196,9 @@ function DesktopDock({
<Box
key={entry.id}
className="osw-dock-tile"
role="button"
// The hover card carries the name for the eye; this carries it for everything else (screen readers, tests).
aria-label={entry.label}
onMouseEnter={(e) => beginHover(entry, e.currentTarget as HTMLElement)}
onClick={() => {
endHover();
@@ -27,20 +27,18 @@ function DockHoverPreview({ entry, top, image }: DockHoverPreviewProps): React.R
pointerEvents: 'none',
}}
>
{image ? (
<Box component="img" src={image} alt="" sx={{ width: '100%', display: 'block' }} />
) : (
<Box sx={{ p: 1.25 }}>
<Typography sx={{ color: '#fff', fontSize: '0.75rem', fontWeight: 600, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>
{entry.label}
{image && <Box component="img" src={image} alt="" sx={{ width: '100%', display: 'block' }} />}
{/* The name rides along even under a live shot: a thumbnail of a page is not its title, and three identical glyphs need one. */}
<Box sx={{ p: 1.25, ...(image && { background: 'rgba(22,12,34,0.9)' }) }}>
<Typography sx={{ color: '#fff', fontSize: '0.75rem', fontWeight: 600, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>
{entry.label}
</Typography>
{!image && entry.snippet && (
<Typography sx={{ color: 'rgba(255,255,255,0.6)', fontSize: '0.6875rem', mt: 0.25, display: '-webkit-box', WebkitLineClamp: 2, WebkitBoxOrient: 'vertical', overflow: 'hidden' }}>
{entry.snippet}
</Typography>
{entry.snippet && (
<Typography sx={{ color: 'rgba(255,255,255,0.6)', fontSize: '0.6875rem', mt: 0.25, display: '-webkit-box', WebkitLineClamp: 2, WebkitBoxOrient: 'vertical', overflow: 'hidden' }}>
{entry.snippet}
</Typography>
)}
</Box>
)}
)}
</Box>
</Box>
);
}