From 584dd3fc87a0ee5dfa6f8a18170f205f6feecd1c Mon Sep 17 00:00:00 2001
From: Eric Liu <ericyl.us@gmail.com>
Date: Fri, 13 May 2022 20:01:22 -0700
Subject: [PATCH] breaking(data-table): use data attribute instead of id for
 table header/row

Fixes #1294
---
 src/DataTable/DataTable.svelte   | 2 +-
 src/DataTable/TableHeader.svelte | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

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