diff --git a/projects/demo-cypress/cypress/tests/addon-tablebars/table-bars-service/table-bars-service.cy.ts b/projects/demo-cypress/cypress/tests/addon-tablebars/table-bars-service/table-bars-service.cy.ts
deleted file mode 100644
index 0e4bebc88e58..000000000000
--- a/projects/demo-cypress/cypress/tests/addon-tablebars/table-bars-service/table-bars-service.cy.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-describe(`TableBarsService`, () => {
-    it(`works`, () => {
-        cy.viewport(1000, 720);
-
-        cy.tuiVisit(`/services/table-bars-service`);
-
-        cy.get(`tui-table-bar-example-1 button`).first().click();
-        cy.getByAutomationId(`tui-table-bar__bar`)
-            .first()
-            .tuiWaitBeforeAction()
-            .matchImageSnapshot(`table-bars`);
-    });
-});
diff --git a/projects/demo-playwright/tests/addon-tablebars/table-bars-service/table-bars-service.spec.ts b/projects/demo-playwright/tests/addon-tablebars/table-bars-service/table-bars-service.spec.ts
new file mode 100644
index 000000000000..3337d2aa3095
--- /dev/null
+++ b/projects/demo-playwright/tests/addon-tablebars/table-bars-service/table-bars-service.spec.ts
@@ -0,0 +1,21 @@
+import {tuiGoto} from '@demo-playwright/utils';
+import {expect, test} from '@playwright/test';
+
+test.describe(`TableBarsService`, () => {
+    test.use({
+        viewport: {width: 1000, height: 720},
+    });
+
+    test(`works`, async ({page}) => {
+        await tuiGoto(page, `/services/table-bars-service`);
+        const example = page.locator(`#base`);
+        const showTableBarButton = example
+            .locator(`tui-table-bar-example-1 button`)
+            .first();
+
+        await showTableBarButton.click();
+        const tableBarExample = page.locator(`[automation-id="tui-table-bar__bar"]`);
+
+        await expect(tableBarExample).toHaveScreenshot(`01-table-bars-service.png`);
+    });
+});