assertVisibleInViewport example

    // the viewport.     $web_assert->assertNotVisibleInViewport('css', $ckeditor_class, 'topLeft', 'CKEditor 5-enabled body field is visible.');

    $before_url = $session->getCurrentUrl();

    // Trigger a hash change with as target the hidden textarea.     $session->executeScript("location.hash = '#edit-body-0-value';");

    // Check that the CKEditor 5-enabled body field is visible in the viewport.     // The hash change adds an ID to the CKEditor 5 instance so check its     // visibility using the ID now.     $web_assert->assertVisibleInViewport('css', $ckeditor_id, 'topLeft', 'CKEditor 5-enabled body field is not visible.');

    // Use JavaScript to go back in the history instead of     // \Behat\Mink\Session::back() because that function doesn't work after a     // hash change.     $session->executeScript("history.back();");

    $after_url = $session->getCurrentUrl();

    // Check that going back in the history worked.     self::assertEquals($before_url, $after_url, 'History back works.');
  }

}

// Check if we can find the error fragment link within the errors summary     // message.
    $errors_link = $this->assertSession()->waitForElementVisible('css', 'a[href$="#edit-body-0-value"]');
    $this->assertNotEmpty($errors_link, 'Error fragment link is visible.');

    $errors_link->click();

    // Check that the CKEditor5-enabled body field is visible in the viewport.     // The hash change adds an ID to the CKEditor 5 instance so check its visibility using the ID now.     $web_assert->assertVisibleInViewport('css', $ckeditor_id, 'topLeft', 'CKEditor5-enabled body field is visible.');
  }

}

$this->drupalGet('/dialog_renderer-test-links');
    $this->clickLink('Hidden close button modal!');
    $session_assert->waitForElementVisible('css', '.ui-dialog');

    // Tabbable should focus the dialog itself when there is no other item.     $this->assertJsCondition('document.activeElement === document.querySelector(".ui-dialog")');

    $this->drupalGet('/dialog_renderer-test-links');
    $this->clickLink('Button pane modal!');
    $session_assert->waitForElementVisible('css', '.ui-dialog');
    $session_assert->assertVisibleInViewport('css', '.ui-dialog .ui-dialog-buttonpane');

    // Tabbable should focus the first tabbable item inside button pane.     $this->assertJsCondition('document.activeElement === tabbable.tabbable(document.querySelector(".ui-dialog .ui-dialog-buttonpane"))[0]');

    $this->drupalGet('/dialog_renderer-test-links');
    $this->clickLink('Content link modal!');
    $session_assert->waitForElementVisible('css', '.ui-dialog');
    $session_assert->assertVisibleInViewport('css', '.ui-dialog .ui-dialog-content');

    // Tabbable should focus the first tabbable item inside modal content.     $this->assertJsCondition('document.activeElement === tabbable.tabbable(document.querySelector(".ui-dialog .ui-dialog-content"))[0]');