diff --git a/fixtures/base.ts b/fixtures/base.ts new file mode 100644 index 0000000..af49ae3 --- /dev/null +++ b/fixtures/base.ts @@ -0,0 +1,20 @@ +import { test as base } from '@playwright/test'; +import { BasePage } from '../page/base'; + +// Declare the types of your fixtures. +type MyFixtures = { + /** Base home page fixture */ + homePage: BasePage; + }; + +// Extend base test by providing "homePage". +// This new "test" can be used in multiple test files, and each of them will get the fixtures. +export const test = base.extend({ + homePage: async ({ page }, use) => { + const homePage = new BasePage(page); + await homePage.goto(); + await use(homePage); + }, +}); + +export { expect } from '@playwright/test'; \ No newline at end of file diff --git a/page/base.ts b/page/base.ts new file mode 100644 index 0000000..689c809 --- /dev/null +++ b/page/base.ts @@ -0,0 +1,32 @@ +import { type Locator, type Page } from '@playwright/test'; + +export class BasePage { + /** The playwright page */ + page: Page; + /** The navigation bar parent locator */ + navBar: Locator; + + constructor(page: Page) { + this.page = page; + this.navBar = this.page.locator(".elementor-nav-menu--main") + + + } + + + async goto() { + await this.page.goto('/'); + } + + getNavigationLocators() { + return { + homeLink: this.navBar.getByRole('link', { name: 'Home' }), + eventsLink: this.navBar.getByRole('link', { name: 'Events' }), + shopsServicesLink: this.navBar.getByRole('link', { name: 'Shops/Services' }), + partsLink: this.navBar.getByRole('link', { name: 'Parts' }), + forumLink: this.navBar.getByRole('link', { name: 'Forum' }), + storeLink: this.navBar.getByRole('link', { name: 'Store' }), + loginButton: this.page.getByRole('link', { name: 'Login' }), + }; + } +} diff --git a/playwright.config.ts b/playwright.config.ts index ad7314a..6e37493 100644 --- a/playwright.config.ts +++ b/playwright.config.ts @@ -12,6 +12,8 @@ import { defineConfig, devices } from '@playwright/test'; */ export default defineConfig({ testDir: './specs', + /** Timeout for a test */ + timeout: 360000, /* Run tests in files in parallel */ fullyParallel: true, /* Fail the build on CI if you accidentally left test.only in the source code. */ @@ -35,19 +37,13 @@ export default defineConfig({ projects: [ { name: 'chromium', - use: { ...devices['Desktop Chrome'] }, + use: { + ...devices['Desktop Chrome'], + // Viewport used for all pages in the context. + viewport: { width: 1920, height: 1080 }, + }, }, - // { - // name: 'firefox', - // use: { ...devices['Desktop Firefox'] }, - // }, - - // { - // name: 'webkit', - // use: { ...devices['Desktop Safari'] }, - // }, - /* Test against mobile viewports. */ // { // name: 'Mobile Chrome', @@ -58,21 +54,5 @@ export default defineConfig({ // use: { ...devices['iPhone 12'] }, // }, - /* Test against branded browsers. */ - // { - // name: 'Microsoft Edge', - // use: { ...devices['Desktop Edge'], channel: 'msedge' }, - // }, - // { - // name: 'Google Chrome', - // use: { ...devices['Desktop Chrome'], channel: 'chrome' }, - // }, ], - - /* Run your local dev server before starting the tests */ - // webServer: { - // command: 'npm run start', - // url: 'http://127.0.0.1:3000', - // reuseExistingServer: !process.env.CI, - // }, }); diff --git a/specs/main-page.spec.ts b/specs/main-page.spec.ts new file mode 100644 index 0000000..aa2e8f1 --- /dev/null +++ b/specs/main-page.spec.ts @@ -0,0 +1,27 @@ +import { test, expect } from '../fixtures/base'; + +test('Page Loads', async ({ homePage }) => { + await expect(homePage.page, "Page title is correct").toHaveTitle(/R.A.C.E./); +}); + +test('The navigation bar links are present and correct', async ({ homePage }) => { + // Get the locators from the page object + const locators = homePage.getNavigationLocators(); + + // Define your expected hrefs + const expectedHrefs: Record = { + homeLink: 'https://yellow.race.social/', + eventsLink: /index\.php\/events\//, + shopsServicesLink: /index\.php\/shops-services\//, + partsLink: /index\.php\/parts\//, + forumLink: /index\.php\/community\//, + storeLink: /index\.php\/store\//, + loginButton: /index\.php\/login\//, + }; + + // Loop through the locators and assert each link/button + for (const [linkName, locator] of Object.entries(locators)) { + await expect(locator, `${locator} is visible`).toBeVisible(); + await expect(locator, `${locator} URI is correct`).toHaveAttribute('href', expectedHrefs[linkName as keyof typeof expectedHrefs]); + } +}); \ No newline at end of file diff --git a/specs/race-main.spec.ts b/specs/race-main.spec.ts deleted file mode 100644 index 4613230..0000000 --- a/specs/race-main.spec.ts +++ /dev/null @@ -1,8 +0,0 @@ -import { test, expect } from '@playwright/test'; - -test('has title', async ({ page }) => { - await page.goto("/"); - - // Expect a title "to contain" a substring. - await expect(page).toHaveTitle(/R.A.C.E./); -}); \ No newline at end of file