From 58b000c600315286d27fd2b4a6b9a5dd910eaac7 Mon Sep 17 00:00:00 2001
From: Alexander Nitsche <typo3@alexandernitsche.com>
Date: Fri, 5 Nov 2021 15:45:50 +0100
Subject: [PATCH] [FEATURE] Support setting CSS of DOM element by
 `setCssOfElement`

---
 .../Classes/Configuration/Configuration.php   |  7 ++++++
 .../Support/Helper/Typo3Navigation.php        | 24 +++++++++++++++++++
 2 files changed, 31 insertions(+)

diff --git a/packages/screenshots/Classes/Configuration/Configuration.php b/packages/screenshots/Classes/Configuration/Configuration.php
index 0c910ad0..d6acbcd2 100644
--- a/packages/screenshots/Classes/Configuration/Configuration.php
+++ b/packages/screenshots/Classes/Configuration/Configuration.php
@@ -248,6 +248,13 @@ public function createBasicConfig(): void
                             ['include' => '_default'],
                             ['action' => 'see', 'text' => 'Extension Builder'],
                             ['action' => 'click', 'link' => 'Extension Builder'],
+                            ['action' => 'click', 'link' => '.t3js-topbar-button-modulemenu'],
+                            ['action' => 'switchToContentFrame'],
+                            ['action' => 'selectOption', 'select' => '.t3-js-jumpMenuBox', 'option' => 'Domain Modelling'],
+                            ['action' => 'seeElement', 'selector' => '#alertPanelButton'],
+                            ['action' => 'click', 'link' => '#alertPanelButton'],
+                            ['action' => 'dragAndDrop', 'source' => '#moduleBar', 'target' => '#modelingLayer'],
+                            ['action' => 'setCssOfElement', 'selector' => '//text()[contains(.,"click to edit")]/ancestor::div[contains(@class, "WireIt-Container")][1]', 'css' => ['left' => '10px', 'top' => '100px']],
                             ['action' => 'makeScreenshotOfFullPage', 'fileName' => 'ExtensionBuilderFullPage'],
                         ]
                     ]
diff --git a/packages/screenshots/Classes/Runner/Codeception/Support/Helper/Typo3Navigation.php b/packages/screenshots/Classes/Runner/Codeception/Support/Helper/Typo3Navigation.php
index 96d7d103..4683ffb2 100644
--- a/packages/screenshots/Classes/Runner/Codeception/Support/Helper/Typo3Navigation.php
+++ b/packages/screenshots/Classes/Runner/Codeception/Support/Helper/Typo3Navigation.php
@@ -451,6 +451,30 @@ public function _scrollFrameToBottom($frameSelector): void
         $this->getWebDriver()->executeJS("arguments[0].scrollTop = arguments[0].scrollHeight", [$frameElement]);
     }
 
+    /**
+     * Set specified CSS properties of a DOM element.
+     *
+     * Note: Use this action with caution, as it can interfere with the natural behavior of a website. This action was
+     * introduced to neatly position elements on a drawing pane, which are normally dragged and dropped by the user.
+     *
+     * ``` php
+     * <?php
+     * $I->setCssOfElement('#drag', ['left' => '10px', 'top' => '100px']);
+     * ?>
+     * ```
+     *
+     * @param string $selector
+     * @param array $css
+     * @return void
+     */
+    public function setCssOfElement(string $selector, array $css): void
+    {
+        $element = $this->getWebDriver()->_findElements($selector)[0];
+        foreach ($css as $propertyName => $value) {
+            $this->getWebDriver()->executeJS("arguments[0].style.$propertyName = \"$value\"", [$element]);
+        }
+    }
+
     /**
      * Navigate directly to a TYPO3 backend record form.
      *