fix: provide stable frontend test selectors

Author: stefan-ernst

frontend/src/lib/components/DataTable.svelte

@@ -171,6 +171,7 @@
           <tr>
             {#each columns as column, colIndex}
               <th
+                data-testid={`table-column-${column.key}`}
                 class="{thClass} {getColumnAlign(column)} {getColumnWidth(column)} {column.sortable ? 'group cursor-pointer select-none' : ''}"
                 style="color: var(--ds-text); {getColumnWidthStyle(column)} {column.headerStyle || ''}"
                 onclick={() => toggleSort(column)}

frontend/src/lib/features/collections/BoardColumn.svelte

@@ -35,6 +35,7 @@
   data-swimlane-parent-id={swimlaneParentId}
   data-status-id={statusId}
 >
+  <span class="sr-only" data-testid={`board-column-status-${statusId}`} aria-hidden="true"></span>
   <div
     class="border-b border-t-4 p-4"
     style="border-bottom-color: var(--ctx-border, var(--ds-border)); border-top-color: {column.color};"

frontend/src/lib/features/collections/CollectionBoard.svelte

@@ -1686,6 +1686,7 @@
                         title={t('collections.expandColumn', { name: objectDisplayName(column, 'status') })}
                         onclick={() => toggleColumnCollapse(column.id)}
                       >
+                        <span class="sr-only" data-testid={`board-column-status-${column.status_ids[0]}`} aria-hidden="true"></span>
                         <ChevronRight class="w-4 h-4 flex-shrink-0" style={styles.glassTextStyle} />
                         <span class="board-column-collapsed-name font-semibold text-sm break-words" style={styles.glassTextStyle}>
                           {objectDisplayName(column, 'status')}

frontend/src/lib/features/workflows/AllIncomingEdge.svelte

@@ -43,7 +43,12 @@
 />
 
 <foreignObject x={labelX - 24} y={labelY - 10} width="48" height="20" style="overflow: visible;">
-  <div class="all-incoming-label" class:all-incoming-label-selected={selected} title={t('workflows.fromAllStatuses')}>
+  <div
+    class="all-incoming-label"
+    class:all-incoming-label-selected={selected}
+    data-testid={`workflow-${id}`}
+    title={t('workflows.fromAllStatuses')}
+  >
     {t('workflows.allStatuses')}
   </div>
 </foreignObject>

frontend/src/lib/features/workflows/StatusNode.svelte

@@ -28,6 +28,7 @@
 </script>
 
 <div 
+  data-testid={`workflow-status-node-${data.statusId}`}
   class="status-node rounded border-2 shadow-lg select-none transition-all duration-200 group relative"
   class:border-blue-500={selected}
   class:border-gray-300={!selected}

frontend/src/lib/features/workflows/SvelteFlowDesigner.svelte

@@ -509,7 +509,7 @@
   </div>
 
   <!-- Svelte Flow Canvas -->
-  <div class="flex-1 relative">
+  <div class="flex-1 relative" data-testid="workflow-canvas">
     <SvelteFlow
       bind:nodes
       bind:edges