Browser navigations

Here's a sample TestCafe test script that demonstrates working with browser navigations:

import { Selector } from 'testcafe';

fixture('Browser Navigation Test')
    .page('https://www.example.com');

test('Navigate Back and Forward', async t => {
    // Perform initial navigation to the page

    // Selector for an element on the initial page
    const initialPageElement = Selector('#initial-element');

    // Perform actions on the initial page

    // Navigate to a different page
    await t.navigateTo('https://www.example.com/other-page');

    // Selector for an element on the other page
    const otherPageElement = Selector('#other-page-element');

    // Perform actions on the other page

    // Navigate back to the initial page
    await t
        .navigateTo('https://www.example.com')
        .expect(initialPageElement.exists).ok();

    // Navigate forward to the other page
    await t
        .navigateTo('https://www.example.com/other-page')
        .expect(otherPageElement.exists).ok();
});

In this test:

• We import the Selector function from TestCafe to select elements on the web page.
• We define a fixture named 'Browser Navigation Test' and set the page to 'https://www.example.com'.
• Inside the test function:
  • We perform initial navigation to the page and define selectors for elements on the initial page (initialPageElement) and the other page (otherPageElement).
  • We navigate to a different page using TestCafe's navigateTo action.
  • We perform actions on the other page.
  • We navigate back to the initial page and assert that elements from the initial page still exist.
  • We navigate forward to the other page and assert that elements from the other page exist.

You can replace 'https://www.example.com' with the URLs of the pages you want to navigate to. Adjust the selectors and actions according to the structure and content of the web pages you are testing.