Added steps: scroll to element and check element at the top of page.

README.md

@@ -126,6 +126,8 @@ Modification of `behat.yml` configuration is not required.
 | `When I do not accept confirmation dialogs`                                                                                  | Do not accept confirmation dialogs appearing on the page.                                |
 | `When /^(?:\|I )click (an?\|on) "(?P<element>[^"]*)" element$/`                                                              | Click on the element defined by the selector.                                            |
 | `When I trigger JS :event event on :selector element`                                                                        | Trigger an event on the specified element.                                               |
+| `Then /^I scroll to an? element with id "([^"]*)"$/`                                                                         | Scroll to an element with ID.                                                            |
+| `Then the element with id :id should be at the top of the page`                                                              | Assert the element with id at the top of page.                                           |
 | &nbsp;                                                                                                                       |                                                                                          |
 | **[`KeyboardTrait`](src/KeyboardTrait.php) ([example](tests/behat/features/keyboard.feature))**                              |                                                                                          |
 | `Given I press the :keys keys`                                                                                               | Press multiple keyboard keys.                                                            |

src/JsTrait.php

@@ -118,6 +118,37 @@ public function jsTriggerElementEvent(string $event, string $selector): void {
     }
   }
 
+  /**
+   * Scroll to an element with ID.
+   *
+   * @Then /^I scroll to an? element with id "([^"]*)"$/
+   */
+  public function iScrollToElementWithId(string $id): void {
+    $this->getSession()->executeScript("
+      var element = document.getElementById('" . $id . "');
+      element.scrollIntoView( true );
+    ");
+  }
+
+  /**
+   * Assert the element with id at the top of page.
+   *
+   * @Then the element with id :id should be at the top of the page
+   */
+  public function assertElementAtTopOfPage(string $id): void {
+    $script = <<<JS
+        (function() {
+            var element = document.getElementById('$id');
+            var rect = element.getBoundingClientRect();
+            return (rect.top >= 0 && rect.top <= window.innerHeight);
+        })();
+JS;
+    $result = $this->getSession()->evaluateScript($script);
+    if (!$result) {
+      throw new \Exception("Element with ID '$id' is not at the top of the page.");
+    }
+  }
+
   /**
    * Execute JS on an element provided by the selector.
    *

tests/behat/features/js.feature

@@ -33,3 +33,10 @@ Feature: Check that JsTrait works
     Then I do not accept confirmation dialogs
     Then I press the "Test confirm" button
     Then I should see the button "You canceled!"
+
+  @javascript
+  Scenario: Assert scroll to an element with ID.
+    Given I am an anonymous user
+    When I visit "/sites/default/files/relative.html"
+    Then I scroll to an element with id "main-inner"
+    Then the element with id "main-inner" should be at the top of the page