diff --git a/src/DataTable/DataTable.svelte b/src/DataTable/DataTable.svelte
index e0a8dbf2..5de05bf8 100644
--- a/src/DataTable/DataTable.svelte
+++ b/src/DataTable/DataTable.svelte
@@ -353,7 +353,7 @@
     <TableBody>
       {#each sorting ? displayedSortedRows : displayedRows as row, i (row.id)}
         <TableRow
-          id="row-{row.id}"
+          data-row="{row.id}"
           data-parent-row="{expandable ? true : undefined}"
           class="{selectedRowIds.includes(row.id)
             ? 'bx--data-table--selected'
diff --git a/src/DataTable/TableHeader.svelte b/src/DataTable/TableHeader.svelte
index d9ad236c..836a3171 100644
--- a/src/DataTable/TableHeader.svelte
+++ b/src/DataTable/TableHeader.svelte
@@ -30,7 +30,7 @@
   <th
     aria-sort="{active ? $sortHeader.sortDirection : 'none'}"
     scope="{scope}"
-    id="{id}"
+    data-header="{id}"
     {...$$restProps}
     on:mouseover
     on:mouseenter
@@ -61,7 +61,7 @@
 {:else}
   <th
     scope="{scope}"
-    id="{id}"
+    data-header="{id}"
     {...$$restProps}
     on:click
     on:mouseover