diff --git a/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-Default-dark-chromium-linux.png b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-Default-dark-chromium-linux.png
new file mode 100644
index 0000000000..421587ae55
Binary files /dev/null and b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-Default-dark-chromium-linux.png differ
diff --git a/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-Default-dark-webkit-linux.png b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-Default-dark-webkit-linux.png
new file mode 100644
index 0000000000..902465dbf4
Binary files /dev/null and b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-Default-dark-webkit-linux.png differ
diff --git a/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-Default-light-chromium-linux.png b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-Default-light-chromium-linux.png
new file mode 100644
index 0000000000..b722b431cd
Binary files /dev/null and b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-Default-light-chromium-linux.png differ
diff --git a/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-Default-light-webkit-linux.png b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-Default-light-webkit-linux.png
new file mode 100644
index 0000000000..c2138e5866
Binary files /dev/null and b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-Default-light-webkit-linux.png differ
diff --git a/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-all-dark-chromium-linux.png b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-all-dark-chromium-linux.png
new file mode 100644
index 0000000000..c359fcd243
Binary files /dev/null and b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-all-dark-chromium-linux.png differ
diff --git a/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-all-dark-webkit-linux.png b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-all-dark-webkit-linux.png
new file mode 100644
index 0000000000..adf5535bf2
Binary files /dev/null and b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-all-dark-webkit-linux.png differ
diff --git a/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-all-light-chromium-linux.png b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-all-light-chromium-linux.png
new file mode 100644
index 0000000000..a188996e2b
Binary files /dev/null and b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-all-light-chromium-linux.png differ
diff --git a/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-all-light-webkit-linux.png b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-all-light-webkit-linux.png
new file mode 100644
index 0000000000..6cf7e652f4
Binary files /dev/null and b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-all-light-webkit-linux.png differ
diff --git a/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-dark-chromium-linux.png b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-dark-chromium-linux.png
new file mode 100644
index 0000000000..6afd7fb961
Binary files /dev/null and b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-dark-chromium-linux.png differ
diff --git a/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-dark-webkit-linux.png b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-dark-webkit-linux.png
new file mode 100644
index 0000000000..8dd12c84cb
Binary files /dev/null and b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-dark-webkit-linux.png differ
diff --git a/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-light-chromium-linux.png b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-light-chromium-linux.png
new file mode 100644
index 0000000000..6d26628e0b
Binary files /dev/null and b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-light-chromium-linux.png differ
diff --git a/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-light-webkit-linux.png b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-light-webkit-linux.png
new file mode 100644
index 0000000000..283eab7dcf
Binary files /dev/null and b/src/components/Table/__snapshots__/Table.withTableSelection.visual.test.tsx-snapshots/Table-withTableSelection-render-story-With-selection-light-webkit-linux.png differ
diff --git a/src/components/Table/__stories__/Table.stories.tsx b/src/components/Table/__stories__/Table.stories.tsx
index 762032e99e..430a69e96b 100644
--- a/src/components/Table/__stories__/Table.stories.tsx
+++ b/src/components/Table/__stories__/Table.stories.tsx
@@ -25,10 +25,7 @@ import type {DataItem} from './utils';
 export default {
     title: 'Components/Data Display/Table',
     component: Table,
-    args: {
-        columns,
-        data,
-    },
+    args: {columns, data},
 } as Meta<TableProps<DataItem>>;
 
 const DefaultTemplate: StoryFn<TableProps<DataItem>> = (args) => {
diff --git a/src/components/Table/__tests__/Table.withTableSelection.visual.test.tsx b/src/components/Table/__tests__/Table.withTableSelection.visual.test.tsx
new file mode 100644
index 0000000000..e3607e20af
--- /dev/null
+++ b/src/components/Table/__tests__/Table.withTableSelection.visual.test.tsx
@@ -0,0 +1,33 @@
+import React from 'react';
+
+import {withTableSelection} from '../hoc';
+
+import {HOCWithTableSelection} from './helpersPlaywright';
+
+import {test} from '~playwright/core';
+
+test.describe('Table.withTableSelection', () => {
+    test('render story: <Default>', async ({mount, expectScreenshot}) => {
+        await mount(<HOCWithTableSelection />);
+
+        await expectScreenshot();
+    });
+
+    test('render story: <With selection>', async ({mount, expectScreenshot}) => {
+        const root = await mount(<HOCWithTableSelection />);
+        const fisrtRowCheckbox = root.getByTestId(withTableSelection.getCheckboxQa('0'));
+
+        await fisrtRowCheckbox.click();
+
+        await expectScreenshot();
+    });
+
+    test('render story: <With selection all>', async ({mount, expectScreenshot}) => {
+        const root = await mount(<HOCWithTableSelection />);
+        const fisrtRowCheckbox = root.getByTestId(withTableSelection.headerCheckboxQa);
+
+        await fisrtRowCheckbox.click();
+
+        await expectScreenshot();
+    });
+});
diff --git a/src/components/Table/__tests__/helpersPlaywright.ts b/src/components/Table/__tests__/helpersPlaywright.ts
new file mode 100644
index 0000000000..54331c5271
--- /dev/null
+++ b/src/components/Table/__tests__/helpersPlaywright.ts
@@ -0,0 +1,5 @@
+import {composeStories} from '@storybook/react';
+
+import * as TableStories from '../__stories__/Table.stories';
+
+export const {HOCWithTableSelection} = composeStories(TableStories);
diff --git a/src/components/Table/hoc/withTableSelection/withTableSelection.tsx b/src/components/Table/hoc/withTableSelection/withTableSelection.tsx
index 77a29c94b6..3db241866a 100644
--- a/src/components/Table/hoc/withTableSelection/withTableSelection.tsx
+++ b/src/components/Table/hoc/withTableSelection/withTableSelection.tsx
@@ -73,18 +73,24 @@ export function withTableSelection<I extends TableDataItem, E extends {} = {}>(
                 checked = false;
             }
 
-            return this.renderCheckBox({disabled, checked, handler: this.handleAllCheckBoxUpdate});
+            return this.renderCheckBox({
+                disabled,
+                checked,
+                handler: this.handleAllCheckBoxUpdate,
+                qa: withTableSelection.headerCheckboxQa,
+            });
         };
 
         private renderBodyCell = (item: I, index: number) => {
             const {selectedIds} = this.props;
-            const id = Table.getRowId(this.props, item, index);
-            const checked = selectedIds.includes(id);
+            const rowId = Table.getRowId(this.props, item, index);
+            const checked = selectedIds.includes(rowId);
 
             return this.renderCheckBox({
                 disabled: this.isDisabled(item, index),
                 checked,
-                handler: this.handleCheckBoxUpdate.bind(this, id, index),
+                handler: this.handleCheckBoxUpdate.bind(this, rowId, index),
+                qa: withTableSelection.getCheckboxQa(rowId),
             });
         };
 
@@ -92,10 +98,12 @@ export function withTableSelection<I extends TableDataItem, E extends {} = {}>(
             disabled,
             checked,
             handler,
+            qa,
         }: {
             checked: boolean;
             disabled: boolean;
             handler: React.ChangeEventHandler<HTMLInputElement>;
+            qa: string;
         }) {
             return (
                 <Checkbox
@@ -106,6 +114,7 @@ export function withTableSelection<I extends TableDataItem, E extends {} = {}>(
                     className={b('selection-checkbox', {
                         'vertical-align': this.props.verticalAlign,
                     })}
+                    qa={qa}
                 />
             );
         }
@@ -237,3 +246,6 @@ export function withTableSelection<I extends TableDataItem, E extends {} = {}>(
         };
     };
 }
+
+withTableSelection.headerCheckboxQa = 'headerCheckboxQa';
+withTableSelection.getCheckboxQa = (id: string) => `CheckboxQa_${id}`;
diff --git a/src/components/Table/hoc/withTableSorting/withTableSorting.tsx b/src/components/Table/hoc/withTableSorting/withTableSorting.tsx
index e83937e2f0..654169ee32 100644
--- a/src/components/Table/hoc/withTableSorting/withTableSorting.tsx
+++ b/src/components/Table/hoc/withTableSorting/withTableSorting.tsx
@@ -138,7 +138,7 @@ export function withTableSorting<I extends TableDataItem, E extends {} = {}>(
                                 </div>,
                                 <div key="spacer" className={b('sort-spacer')} />,
                                 <div key="indicator" className={b('sort-indicator')}>
-                                    <SortIndicator
+                                    <TableSortIndicator
                                         order={sortOrder || this.getColumnDefaultSortOrder(column)}
                                     />
                                 </div>,