From b40b0fd13bda8883b9d4a60c30bd253b6ea605bf Mon Sep 17 00:00:00 2001
From: Guste Gaubaite <219.guste@gmail.com>
Date: Fri, 25 Jul 2025 13:51:16 +0200
Subject: [PATCH 1/2] feat: add test for thumbpage duplication via arrow icon

---
 ...humbpage-duplicate-from-arrow-icon.spec.ts | 54 +++++++++++++++++++
 1 file changed, 54 insertions(+)
 create mode 100644 e2e/thumb-pages/thumbpage-duplicate-from-arrow-icon.spec.ts

diff --git a/e2e/thumb-pages/thumbpage-duplicate-from-arrow-icon.spec.ts b/e2e/thumb-pages/thumbpage-duplicate-from-arrow-icon.spec.ts
new file mode 100644
index 00000000..cf564921
--- /dev/null
+++ b/e2e/thumb-pages/thumbpage-duplicate-from-arrow-icon.spec.ts
@@ -0,0 +1,54 @@
+import { test, expect } from '@playwright/test';
+import {
+  addComponentsToCanvas,
+  getByShapeType,
+  getByShapeTypeInThumb,
+} from '../helpers';
+import { Group } from 'konva/lib/Group';
+
+test('should duplicate thumbpage when triggered via the arrow icon', async ({
+  page,
+}) => {
+  await page.goto('');
+
+  // Add components to canvas
+  await addComponentsToCanvas(page, ['Button', 'Combobox']);
+
+  await page.getByText('Pages').click();
+
+  // Find thumb page
+  const siblingElement = page.getByText('Page 1', { exact: true });
+  const thumb = siblingElement.locator('..');
+
+  // Select arrow svg inside the thumb container
+  const svgElement = thumb.locator('span > svg');
+  await svgElement.click();
+
+  // Verify duplicate button exists in the context menu
+  const duplicateButton = page
+    .locator('div')
+    .filter({ hasText: /^Duplicate$/ });
+
+  await expect(duplicateButton).toBeVisible();
+
+  // Duplicate thumbpage
+  await duplicateButton.click();
+
+  // Verify Page 1 - copy exists and its selected
+  const pageTwo = page
+    .getByText('Page 1 - copy', { exact: true })
+    .locator('..');
+  await expect(pageTwo).toBeVisible();
+
+  // Verify components exist in copy thumb
+  const buttonInCopyThumb = await getByShapeTypeInThumb(page, 1, 'button');
+  const comboboxInCopyThumb = await getByShapeTypeInThumb(page, 1, 'combobox');
+  expect(buttonInCopyThumb).toBeDefined();
+  expect(comboboxInCopyThumb).toBeDefined();
+
+  // Verify components exist in copy canvas
+  const buttonShape = (await getByShapeType(page, 'button')) as Group;
+  const comboboxShape = (await getByShapeType(page, 'combobox')) as Group;
+  expect(buttonShape).toBeDefined();
+  expect(comboboxShape).toBeDefined();
+});

From 9d90d56bc907cb02ad1e841cd155c98d8beca767 Mon Sep 17 00:00:00 2001
From: Guste Gaubaite <219.guste@gmail.com>
Date: Tue, 29 Jul 2025 12:55:07 +0200
Subject: [PATCH 2/2] fix: resolve intermittent failure in duplicate thumb page
 test by adding click to force async rendering completion

---
 ....spec.ts => duplicate-thumb-page-from-arrow-icon.spec.ts} | 5 +++++
 1 file changed, 5 insertions(+)
 rename e2e/thumb-pages/{thumbpage-duplicate-from-arrow-icon.spec.ts => duplicate-thumb-page-from-arrow-icon.spec.ts} (88%)

diff --git a/e2e/thumb-pages/thumbpage-duplicate-from-arrow-icon.spec.ts b/e2e/thumb-pages/duplicate-thumb-page-from-arrow-icon.spec.ts
similarity index 88%
rename from e2e/thumb-pages/thumbpage-duplicate-from-arrow-icon.spec.ts
rename to e2e/thumb-pages/duplicate-thumb-page-from-arrow-icon.spec.ts
index cf564921..99d57fb1 100644
--- a/e2e/thumb-pages/thumbpage-duplicate-from-arrow-icon.spec.ts
+++ b/e2e/thumb-pages/duplicate-thumb-page-from-arrow-icon.spec.ts
@@ -40,6 +40,11 @@ test('should duplicate thumbpage when triggered via the arrow icon', async ({
     .locator('..');
   await expect(pageTwo).toBeVisible();
 
+  // Additional click to force the duplicate thumbnail to finish rendering.
+  await pageTwo.click();
+  // Without this click, the React/Konva pipeline does not always update on time and the
+  // assertions fail intermittently.
+
   // Verify components exist in copy thumb
   const buttonInCopyThumb = await getByShapeTypeInThumb(page, 1, 'button');
   const comboboxInCopyThumb = await getByShapeTypeInThumb(page, 1, 'combobox');