Repository: penpot/penpot
File: frontend/playwright/ui/pages/WorkspacePage.js (JavaScript)

Code before:
      return locator.evaluate(
        (element, styleName) => element.style.getPropertyValue(styleName),
        styleName,
      );
    }

    async waitForEditor() {
      const typographyInput =
        this.workspacePage.rightSidebar.getByLabel("Font Size");
      await expect(typographyInput).toBeVisible();
    }

    async startEditing() {
      await this.page.keyboard.press("Enter");
      return this.waitForEditor();
    }

    async stopEditing() {
      await this.page.keyboard.press("Escape");
    }

    async moveToLeft(amount = 0) {
      for (let i = 0; i < amount; i++) {
        await this.page.keyboard.press("ArrowLeft");
      }
      await this.page.evaluate(() => new Promise((resolve) => globalThis.requestIdleCallback(resolve)));
    }

    async moveToRight(amount = 0) {
      for (let i = 0; i < amount; i++) {
        await this.page.keyboard.press("ArrowRight");
      }
      await this.page.evaluate(() => new Promise((resolve) => globalThis.requestIdleCallback(resolve)));
    }

    async moveFromStart(offset = 0) {
      await this.page.keyboard.press("Home");
      await this.page.evaluate(() => new Promise((resolve) => globalThis.requestIdleCallback(resolve)));
      await this.moveToRight(offset);
    }

    async moveFromEnd(offset = 0) {
      await this.page.keyboard.press("ArrowRight");
      await this.moveToLeft(offset);
    }

    async selectFromStart(length, offset = 0) {
      await this.moveFromStart(offset);
      await this.page.keyboard.down("Shift");
      await this.moveToRight(length);
      await this.page.keyboard.up("Shift");

Review comment (suggestion):
Maybe we can create a method like:

```javascript
waitForIdleCallback() {
  return this.page.evaluate(() => new Promise((resolve) => globalThis.requestIdleCallback(resolve)));
}
```

and leave this line like:

```javascript
this.waitForIdleCallback();
```

Code after:
      return locator.evaluate(
        (element, styleName) => element.style.getPropertyValue(styleName),
        styleName,
      );
    }

    async waitForEditor() {
      const typographyInput =
        this.workspacePage.rightSidebar.getByLabel("Font Size");
      await expect(typographyInput).toBeVisible();
    }

    async startEditing() {
      await this.page.keyboard.press("Enter");
      return this.waitForEditor();
    }

    async stopEditing() {
      await this.page.keyboard.press("Escape");
    }

    async moveToLeft(amount = 0) {
      for (let i = 0; i < amount; i++) {
        await this.page.keyboard.press("ArrowLeft");
      }
      await this.waitForIdle();
    }

    async moveToRight(amount = 0) {
      for (let i = 0; i < amount; i++) {
        await this.page.keyboard.press("ArrowRight");
      }
      await this.waitForIdle();
    }

    async moveFromStart(offset = 0) {
      await this.page.keyboard.press("Home");
      await this.waitForIdle();
      await this.moveToRight(offset);
    }

    async moveFromEnd(offset = 0) {
      await this.page.keyboard.press("ArrowRight");
      await this.moveToLeft(offset);
    }

    async selectFromStart(length, offset = 0) {
      await this.moveFromStart(offset);
      await this.page.keyboard.down("Shift");
      await this.moveToRight(length);
      await this.page.keyboard.up("Shift");