Scrolls a specific element to its horizontal end. The step takes one required parameter: a CSS selector in double quotes that identifies the scrollable element. The step sets the element's own horizontal scroll position to its full scrollable width, so the right-most content inside that container comes into view. The page scrollbar is not affected.
This is the element-scoped counterpart of scrolling the page to the end. Reach for it when the overflow lives inside a widget rather than on the page: wide tables in an overflow wrapper, horizontally scrolling galleries, or off-canvas panels. The selector must match an element on the page, and only the first match is scrolled.
Accepted phrasings
When I scroll to end of "#off-canvas"
When we scroll to end of "#sidebar"
When scrolling to end of "#main-container"The step also works with And as a continuation keyword inside a When block.
Examples
When I scroll to end of "#off-canvas"
And we scroll to end of "#sidebar"
When scrolling to end of "#main-container"In a real scenario
Scenario: The last plan column of a wrapped comparison table is reachable
Given I am an anonymous user
When I go to "/pricing/compare"
And wait
Then the element "#plan-table-wrapper" should be displayed
And I should see "Starter"
When I scroll to end of "#plan-table-wrapper"
And I wait 2s
Then I should see "Enterprise"
And the element ".plan-enterprise .btn-primary" should be displayed