Navigation Steps

Navigation steps are the entry kit every scenario needs: start a clean anonymous session, open the homepage or any path under your launch URL, move through browser history, reload, and assert where you ended up. Nearly every feature file in a webship-js suite begins with one of these steps, so they are deliberately forgiving about phrasing - I am, we are, and bare forms all work, and homepage and frontpage are interchangeable.

Every navigation step goes through the shared gotoUrl() helper and then runs the BBR smart-wait pipeline: it waits for the body element to be attached and for the page to settle before the next step runs (see wait steps for the full smart-wait story). The settle budget comes from the minWaitTime.page world parameter (default 3000 ms), so slow environments can be tuned globally instead of sprinkling explicit waits into scenarios.

Relative paths are appended to the configured launch URL (Given I am on "/about-us.html" opens <launchUrl>/about-us.html), while a full URL such as "https://un.org" is passed through, so the same steps cover both your site under test and external destinations. For finer-grained URL checks - exact pathname or query parameters - see the path steps group.

Quick reference

StepWhat it does
Given I am an anonymous userClear cookies and navigate to the launch URL as an anonymous visitor.
Given I am on homepageOpen the homepage.
Given I am on "/about-us.html"Open a specific page under the launch URL.
When I go to homepageNavigate to the homepage.
When I go to "/contact-us.html"Navigate to a specific page.
When I move forward one pageMoves forward one page in browser history.
When I move backward one pageMoves backward one page in browser history.
When I reloadReloads the current page.
Then I should be on homepageAssert that the current page is or is not the homepage.
Then I should be on "/"Assert that the current path is or is not equal to the specified path.
Then the url should match "/contact-us.html"Assert that the current URL matches or does not match a regex pattern.

Steps in detail

Given I am an anonymous user

Clears every cookie in the browser context, then navigates to the launch URL and waits for the page to load. Use it as the first step of a scenario whenever a previous scenario (or a shared auth state) may have left a session behind. Accepted variants: Given we are an anonymous user and Given an anonymous user.

Given I am an anonymous user
Then I should see "Log in"
And I should not see "My account"

Given I am on homepage / When I go to homepage

Both open the launch URL; the Given form reads naturally as scenario setup, while the When form (I go to, I navigate to, navigating to) reads as an action mid-scenario. the is optional and frontpage is a synonym for homepage. After navigation the step waits for body to attach and the page to settle within minWaitTime.page.

Given I am on the homepage
Then I should see "Welcome to the homepage of the Webship-js Examples"
When I navigate to the frontpage
Then I should be on homepage

Given I am on "/about-us.html" / When I go to "/contact-us.html"

Open a specific page. The quoted value is appended to the launch URL, so start relative paths with /; a fully qualified URL such as "https://un.org" is also accepted. The optional page suffix lets you write Given I am on the "/contact-us.html" page. Like the homepage steps, this waits for the body element (up to 10 s) and then for the page to settle before the scenario continues.

Given I am on "/about-us.html"
When I go to "/contact-us.html"
Then I should see "Contact Us"

When I move forward one page / When I move backward one page

Thin wrappers around Playwright's page.goForward() and page.goBack() - equivalent to the browser toolbar buttons. If there is no history entry in that direction, nothing happens and no error is thrown. Combine with a short wait or a URL assertion when the destination page loads content asynchronously.

When I go to "/about-us.html"
And I move backward one page
Then I should see "Welcome to the homepage of the Webship-js Examples"
When I move forward one page
Then I should see "About Us"

When I reload

Reloads the current page via page.reload(). the page is optional, so When I reload, And I reload the page, and And we reload page are all valid. Useful after mutating server state (for example through the API steps) to see the fresh render.

Given I am on "/existing-page.html"
When I reload the page
Then I should see "Existing Page"

Then I should be on homepage

Asserts the current URL starts with the launch URL (or, with not, that it does not). The failure message includes the actual current URL, so mismatches are easy to diagnose. Negated form: Then I should not be on homepage.

When I go to the homepage
Then I should be on the homepage
When I go to "/about-us.html"
Then I should not be on homepage

Then I should be on "/"

Asserts the current URL contains the quoted value - a substring check, not an exact match. That makes Then I should be on "/user/login" tolerant of query strings and destination parameters. Use the stricter the path should be "..." step from the path group when you need an exact pathname. Negated form: Then I should not be on "/user/login".

Given I am on "/about-us.html"
Then I should be on "/about-us.html"
And I should not be on "/contact-us.html"

Then the url should match "..."

Treats the quoted value as a JavaScript regular expression and tests it against the full current URL. Remember to escape regex metacharacters when you mean them literally, and anchor with ^ when checking the scheme. Negated form: the url should not match "...".

Given I am on "/test-acceptable-url-path.html"
Then the url should match "^https?://"
And the url should match "/test-acceptable-url-path"
And the url should not match "/checkout"

Complete example

Adapted from tests/features/test--when--i-move-forward-backward-one-page.feature, running against the bundled example site.

Feature: An example of navigating forward and backward by one page.
  As a tester,
  I want to be able to navigate forward and backward by one page.

  Scenario: Check to navigate forward and backward one page
    Given I am on the homepage
     When I go to "/about-us.html"
     Then I should see "About Us"
     When I move backward one page
      And I wait max of 3 seconds
     Then I should see "Welcome to the homepage of the Webship-js Examples"
     When I move forward one page
      And I wait max of 3 seconds
     Then I should see "About Us"
      And I should be on "/about-us.html"

Configuration

Navigation steps read one world parameter:

KeyDefaultPurpose
minWaitTime.page3000 msPage-settle budget applied after every navigation step. Raise it for slow staging environments instead of adding explicit waits to scenarios.

See global settings for where to set it.

Back to all step groups