🔧 ساختمان چارچوب نمایشنامه نویسی گام به گام – اجرای POM به عنوان جلسه کاربری و AUTH

🎯 مقدمه

وسایل موجود در نمایشنامه نویس ارائه می دهد مکانیسم قدرتمند برای تنظیم محیط برای تست های خود ، مدیریت منابع و به اشتراک گذاشتن اشیاء مشترک یا زمینه در چندین تست! 🚀 این مؤلفه های قابل استفاده مجدد به شما امکان می دهد روشهای تنظیم و اشکال سفارشی را که به صورت خودکار فرآیندهای آماده سازی و پاکسازی را خودکار می کنند ، تعریف کنید ، از یک محیط آزمایش مداوم و بهینه سازی گردش کار خود اطمینان حاصل کنید.

💡 وسایل چیست؟: به عنوان ابزار تست خود از وسایل تست خود فکر کنید – آنها پایه و اساس و ابزاری را ارائه می دهند که تست های شما برای اجرای مداوم و کارآمد نیاز دارند.

🛠 POM (مدل شیء صفحه) را به عنوان فیکسچر پیاده سازی کنید

folder Fixtures Folder

ایجاد کردن fixtures/pom پوشه های موجود در فهرست اصلی پروژه.

project-root/
├── fixtures/
│   └── pom/
│       ├── page-object-fixture.ts
│       └── test-options.ts
├── tests/
└── playwright.config.ts

files فایلهای فیکسچر ایجاد کنید

برای همه صفحات برنامه ، وسایل مربوط به سایت مشتری را ایجاد و پیاده سازی کنید.

🔧 صفحه فیکسچر شیء

• page-object-fixture.ts: از این پرونده برای گسترش فیکسچر تست استفاده می شود @playwright/test

import { test as base } from '@playwright/test';
import { HomePage } from '../../pages/clientSite/homePage';
import { NavPage } from '../../pages/clientSite/navPage';
import { ArticlePage } from '../../pages/clientSite/articlePage';

export type FrameworkFixtures = {
    homePage: HomePage;

    navPage: NavPage;

    articlePage: ArticlePage;
};

export const test = base.extend<FrameworkFixtures>({
    homePage: async ({ page }, use) => {
        await use(new HomePage(page));
    },

    navPage: async ({ page }, use) => {
        await use(new NavPage(page));
    },

    articlePage: async ({ page }, use) => {
        await use(new ArticlePage(page));
    },
});

export { expect } from '@playwright/test';

پیکربندی گزینه های تست

• test-options.ts: از این پرونده برای ادغام تمام وسایل تست گسترده استفاده می شود

import { test as base, mergeTests } from '@playwright/test';
import { test as pageObjectFixture } from './page-object-fixture';

const test = mergeTests(pageObjectFixture);

const expect = base.expect;
export { test, expect };

session جلسه کاربر AUTH

🎯 مزیت استراتژیک: استفاده از جلسات کاربر تأیید شده کاربر در نمایشنامه نویس یک رویکرد استراتژیک برای ساده سازی آزمایش برنامه های محافظت شده با رمز عبور است!

این روش شامل قبل از ایجاد و استفاده مجدد از نشانه های احراز هویت یا اطلاعات جلسه است که به آزمایش های خودکار اجازه می دهد تا از UI ورود به سیستم دور شوند. این به طور قابل توجهی زمان و منابع مورد نیاز برای تست هایی را که نیاز به یک زمینه کاربر معتبر دارند ، کاهش می دهد و باعث افزایش کارایی و قابلیت اطمینان می شود.

🌟 مزایای استفاده از جلسات کاربر معتبر در نمایشنامه نویس:

• ⚡ سرعت: به طور مستقیم با استفاده از جلسات معتبر ، سربار پیمایش از طریق صفحه نمایش ورود به سیستم برای هر آزمایش را از بین می برد و روند اجرای آزمون را تسریع می کند
• 🛡 ثبات: آزمایشات کمتر در معرض خرابی های مربوط به تغییرات UI در جریان احراز هویت قرار می گیرند و قابلیت اطمینان آنها را افزایش می دهند
• 🎯 تمرکز: به آزمایشات اجازه می دهد تا به جای خود فرآیند ورود به سیستم ، بر عملکردهای اصلی که نیاز به احراز هویت دارند ، متمرکز شوند و آنها را هدفمندتر و مختصر تر کنند

📝 فایل اسکریپت AUTH ایجاد کنید

ایجاد کردن auth.setup.ts پرونده در فهرست آزمون پروژه.

import { test as setup } from '../fixtures/pom/test-options';

setup('auth user', async ({ homePage, navPage, page }) => {
    await setup.step('create logged in user session', async () => {
        await homePage.navigateToHomePageGuest();

        await navPage.logIn(process.env.EMAIL!, process.env.PASSWORD!);

        await page.context().storageState({ path: '.auth/userSession.json' });
    });
});

⚙ پرونده پیکربندی را به روز کنید

پیکربندی زیر را به خود اضافه کنید playwright.config.ts:

projects: [
        {
            name: 'setup',
            use: {
                ...devices['Desktop Chrome'],
                viewport: { width: 1366, height: 768 },
            },
            testMatch: /.*\.setup\.ts/,
        },

        {
            name: 'chromium',
            use: {
                ...devices['Desktop Chrome'],
                storageState: '.auth/userSession.json',
                viewport: { width: 1366, height: 768 },
            },
            dependencies: ['setup'],
        },

        {
            name: 'firefox',
            use: { ...devices['Desktop Firefox'] },
        },

        {
            name: 'webkit',
            use: { ...devices['Desktop Safari'] },
        },
    ],

🔒 افزودن پرونده به .gitignore

⚠ بهترین روش امنیتی: اضافه کردن userSession.json پرونده به .gitignore پرونده در فهرست اصلی پروژه.

# Authentication User file
userSession.json

🏃‍♂ ایجاد جلسه کاربر AUTH

اجرا auth.setup.ts پرونده برای ایجاد جلسه کاربر AUTH:

npx playwright test auth.setup.ts

👤 جلسه کاربر مهمان ایجاد کنید

ایجاد کردن guestSession.json پرونده در .auth دایرکتوری پروژه و اضافه کردن {} به آن

💡 جلسات مهمان: شیء JSON خالی نشان دهنده یک حالت غیرمجاز برای تست هایی است که نیاز به دسترسی به مهمان دارند.

🎯 بعدی چیست؟

در مقاله بعدی ما پیاده سازی خواهیم کرد تست های UI – آوردن چارچوب خود با آزمایش جامع رابط کاربری!

💬 جامعه: لطفاً برای شروع بحث و گفتگو در مورد این موضوع احساس راحتی کنید ، زیرا هر سهم این امکان را دارد که پالایش بیشتری را انجام دهد.

✨ برای تقویت قابلیت های آزمایش خود آماده هستید؟ بیایید ساخت این چارچوب قوی را با هم ادامه دهیم!