Homework25

.env

@@ -0,0 +1,3 @@
+BASE_URL=https://qauto.forstudy.space/
+HTTP_USERNAME=guest
+HTTP_PASSWORD=welcome2qauto

package.json

@@ -9,6 +9,7 @@
   "description": "",
   "devDependencies": {
     "@playwright/test": "^1.51.1",
-    "@types/node": "^22.14.0"
+    "@types/node": "^22.14.0",
+    "dotenv": "^16.5.0"
   }
 }

pages/base.page.js

@@ -0,0 +1,36 @@
+export class BasePage {
+    constructor(page) {
+      this.page = page;
+    }
+
+    async logNavigationDetails(url) {
+      console.log('--- NAVIGATION DEBUG ---');
+      console.log('Constructed URL:', url);
+      console.log('Environment BASE_URL:', process.env.BASE_URL);
+      console.log('Current page URL (before):', await this.page.url());
+    }
+
+    async click(locator) {
+      await locator.click();
+    }
+
+    async fill(locator, text) {
+      await locator.fill(text);
+    }
+
+    async type(locator, text) {
+      await locator.type(text);
+    }
+
+    async getText(locator) {
+      return await locator.innerText();
+    }
+
+    async isVisible(locator) {
+      return await locator.isVisible();
+    }
+
+    async isEnabled(locator) {
+      return await locator.isEnabled();
+    }
+  }

pages/registration.page.js

@@ -0,0 +1,77 @@
+import { BasePage } from './base.page';
+import { expect } from '@playwright/test';
+
+class RegistrationPage extends BasePage {
+  constructor(page) {
+    super(page);
+
+    // Локатори
+    this.signUpButton = page.locator('button:has-text("Sign up")');
+    this.nameInput = page.locator('#signupName');
+    this.lastNameInput = page.locator('#signupLastName');
+    this.emailInput = page.locator('#signupEmail');
+    this.passwordInput = page.locator('#signupPassword');
+    this.repeatPasswordInput = page.locator('#signupRepeatPassword');
+    this.registerButton = page.locator('button:text("Register")');
+
+    // Помилки валідації
+    this.nameError = page.locator('#signupName + .invalid-feedback');
+    this.lastNameError = page.locator('#signupLastName + .invalid-feedback');
+    this.emailError = page.locator('#signupEmail + .invalid-feedback');
+    this.passwordError = page.locator('#signupPassword + .invalid-feedback');
+    this.repeatPasswordError = page.locator('#signupRepeatPassword + .invalid-feedback');
+  }
+
+  async navigateToRegistration() {
+    const config = this.page.context()._options;
+
+    // Debug logging (optional)
+    console.log('Base URL:', config.baseURL);
+    console.log('Using login:', config.httpCredentials?.username);
+    console.log('Using password:', config.httpCredentials?.password);
+    this.logNavigationDetails(config.baseURL);
+    await this.page.goto('/');
+    await this.click(this.signUpButton);
+  }
+
+  async fillRegistrationForm(name, lastName, email, password, repeatPassword) {
+    await this.fill(this.nameInput, name);
+    await this.fill(this.lastNameInput, lastName);
+    await this.fill(this.emailInput, email);
+    await this.fill(this.passwordInput, password);
+    await this.fill(this.repeatPasswordInput, repeatPassword);
+  }
+
+  async submitRegistration() {
+    await this.click(this.registerButton);
+  }
+
+  async expectSuccessfulRegistration() {
+    await expect(this.page).toHaveURL(/panel\/garage/);
+  }
+
+  async expectNameError(message) {
+    await expect(this.nameError).toHaveText(message);
+    await expect(this.nameInput).toHaveCSS('border-color', 'rgb(220, 53, 69)');
+  }
+
+  async expectEmailError(message) {
+    await expect(this.emailError).toHaveText(message);
+    await expect(this.emailInput).toHaveCSS('border-color', 'rgb(220, 53, 69)');
+  }
+
+  async expectPasswordError(message) {
+    await expect(this.passwordError).toHaveText(message);
+    await expect(this.passwordInput).toHaveCSS('border-color', 'rgb(220, 53, 69)');
+  }
+
+  async expectRepeatPasswordError(message) {
+    await expect(this.repeatPasswordError).toHaveText(message);
+    await expect(this.repeatPasswordInput).toHaveCSS('border-color', 'rgb(220, 53, 69)');
+  }
+
+  async expectRegisterButtonDisabled() {
+    await expect(this.registerButton).toBeDisabled();
+  }
+}
+export {RegistrationPage};

playwright.config.js

@@ -1,33 +1,34 @@
-// @ts-check
+// @ts-nocheck
+
 import { defineConfig, devices } from '@playwright/test';
 
-/**
- * Read environment variables from file.
- * https://github.com/motdotla/dotenv
- */
-// import dotenv from 'dotenv';
-// import path from 'path';
-// dotenv.config({ path: path.resolve(__dirname, '.env') });
+require('dotenv').config();
 
 /**
  * @see https://playwright.dev/docs/test-configuration
+ * 
+ * 
  */
+
 export default defineConfig({
   testDir: './tests',
-  /* Run tests in files in parallel */
   fullyParallel: true,
-  /* Fail the build on CI if you accidentally left test.only in the source code. */
   forbidOnly: !!process.env.CI,
-  /* Retry on CI only */
   retries: process.env.CI ? 2 : 0,
-  /* Opt out of parallel tests on CI. */
   workers: process.env.CI ? 1 : undefined,
-  /* Reporter to use. See https://playwright.dev/docs/test-reporters */
   reporter: 'html',
-  /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
   use: {
-    /* Base URL to use in actions like `await page.goto('/')`. */
-    // baseURL: 'http://127.0.0.1:3000',
+    baseURL: process.env.BASE_URL,
+    httpCredentials: {
+        username: process.env.HTTP_USERNAME,
+        password: process.env.HTTP_PASSWORD
+    },
+  // use: {
+  //   baseURL: 'https://qauto.forstudy.space/',
+  //   httpCredentials: {
+  //       username: 'guest',
+  //       password: 'welcome2qauto',
+  //   },
 
     /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
     trace: 'on-first-retry',
@@ -38,17 +39,18 @@ export default defineConfig({
     {
       name: 'chromium',
       use: { ...devices['Desktop Chrome'] },
-    },
+    }
+    //,
 
-    {
-      name: 'firefox',
-      use: { ...devices['Desktop Firefox'] },
-    },
+    // {
+    //   name: 'firefox',
+    //   use: { ...devices['Desktop Firefox'] },
+    // },
 
-    {
-      name: 'webkit',
-      use: { ...devices['Desktop Safari'] },
-    },
+    // {
+    //   name: 'webkit',
+    //   use: { ...devices['Desktop Safari'] },
+    // },
 
     /* Test against mobile viewports. */
     // {