From b5515cf85a5aaf06a95fd7d6353b9d52740a1d81 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Micha=C5=82=20Ska=C5=82ka?= <michal.skalka@swmansion.com>
Date: Thu, 4 Jul 2024 10:00:22 +0200
Subject: [PATCH] Fix getting value in e2e tests

---
 WebExample/__tests__/input.spec.ts |  5 +++--
 WebExample/__tests__/utils.ts      | 22 ++++++++++++----------
 2 files changed, 15 insertions(+), 12 deletions(-)

diff --git a/WebExample/__tests__/input.spec.ts b/WebExample/__tests__/input.spec.ts
index f3accc26..1676c4e1 100644
--- a/WebExample/__tests__/input.spec.ts
+++ b/WebExample/__tests__/input.spec.ts
@@ -1,6 +1,6 @@
 import {test, expect} from '@playwright/test';
 import * as TEST_CONST from '../../example/src/testConstants';
-import {checkCursorPosition, setupInput} from './utils';
+import {checkCursorPosition, getElementValue, setupInput} from './utils';
 
 test.beforeEach(async ({page}) => {
   await page.goto(TEST_CONST.LOCAL_URL, {waitUntil: 'load'});
@@ -12,7 +12,8 @@ test.describe('typing', () => {
 
     await inputLocator.focus();
     await inputLocator.pressSequentially(TEST_CONST.EXAMPLE_CONTENT);
-    const value = await inputLocator.innerText();
+
+    const value = await getElementValue(inputLocator);
     expect(value).toEqual(TEST_CONST.EXAMPLE_CONTENT);
   });
 
diff --git a/WebExample/__tests__/utils.ts b/WebExample/__tests__/utils.ts
index 8b588348..4ffc599d 100644
--- a/WebExample/__tests__/utils.ts
+++ b/WebExample/__tests__/utils.ts
@@ -1,5 +1,7 @@
 import type {Locator, Page} from '@playwright/test';
 import * as TEST_CONST from '../../example/src/testConstants';
+import type {MarkdownTextInputElement} from '../../src/MarkdownTextInput.web';
+import {getCurrentCursorPosition} from '../../src/web/utils/cursorUtils';
 
 const setupInput = async (page: Page, action?: 'clear' | 'reset') => {
   const inputLocator = await page.locator(`div#${TEST_CONST.INPUT_ID}`);
@@ -11,15 +13,9 @@ const setupInput = async (page: Page, action?: 'clear' | 'reset') => {
 };
 
 const checkCursorPosition = () => {
-  const editableDiv = document.querySelector('div[contenteditable="true"]') as HTMLElement;
-  const range = window.getSelection()?.getRangeAt(0);
-  if (!range || !editableDiv) {
-    return null;
-  }
-  const preCaretRange = range.cloneRange();
-  preCaretRange.selectNodeContents(editableDiv);
-  preCaretRange.setEnd(range.endContainer, range.endOffset);
-  return preCaretRange.toString().length;
+  const editableDiv = document.querySelector('div[contenteditable="true"]') as MarkdownTextInputElement;
+
+  return getCurrentCursorPosition(editableDiv);
 };
 
 const setCursorPosition = ({startNode, endNode}: {startNode?: Element; endNode?: Element | null}) => {
@@ -55,4 +51,10 @@ const pressCmd = async ({inputLocator, command}: {inputLocator: Locator; command
   await inputLocator.press(`${OPERATION_MODIFIER}+${command}`);
 };
 
-export {setupInput, checkCursorPosition, setCursorPosition, getElementStyle, pressCmd};
+const getElementValue = async (elementHandle: Locator) => {
+  const customVariableValue = await elementHandle.evaluateHandle((div: MarkdownTextInputElement) => div.value);
+  const value = await customVariableValue.jsonValue();
+  return value;
+};
+
+export {setupInput, checkCursorPosition, setCursorPosition, getElementStyle, pressCmd, getElementValue};