refactor: expect decorator

Author: vOrigins

src/services/expect-decorator/BaseExpect.ts

@@ -1,14 +1,110 @@
-import { type Locator } from '@playwright/test'
+import { test } from '@fixtures'
+import { expect as expectPw } from '@playwright/test'
+import { BaseComponent } from '@shared/components/base'
+import { handlePlaywrightError, quoteName } from '@services/utils'
 
-export abstract class BaseExpect {
-  abstract not: BaseExpectNot
+/**
+ * List of Playwright expect methods that can be called by the BaseExpect class
+ */
+type CallableExpectMethods =
+  'toBeVisible'
+  | 'toBeHidden'
+  | 'toBeEnabled'
+  | 'toBeDisabled'
+  | 'toBeEmpty'
+  | 'toHaveText'
+  | 'toContainText'
+  | 'toHaveValue'
+  | 'toHaveCount'
+  | 'toBeFocused'
+  | 'toBeChecked'
+  | 'toHaveClass'
+  | 'toHaveAttribute'
+  | 'toEqual'
+  | 'toContain'
+  | 'toMatch'
 
-  protected constructor(readonly actual: Locator, readonly options: { soft: boolean }) {
-  }
+/**
+ * Type for accessing Playwright's expect methods
+ */
+type PlaywrightExpectation = {
+  [key in CallableExpectMethods]: (...args: unknown[]) => Promise<void>;
 }
 
-export abstract class BaseExpectNot {
+/**
+ * Base abstract class for all expect decorators
+ *
+ * This class provides the foundation for all specialized expect classes,
+ * handling common functionality like negation, soft assertions, and
+ * execution of expectations with proper error handling and reporting.
+ *
+ * @template T The type of value being asserted on
+ */
+export abstract class BaseExpect<T> {
+  /** Text indicator for negated assertions in step messages */
+  protected readonly notIndicator: string = this.isNot ? 'not ' : ''
+
+  /**
+   * Creates a new instance of BaseExpect
+   *
+   * @param actual The value to assert on
+   * @param isNot Whether this is a negated assertion
+   * @param isSoft Whether this is a soft assertion that doesn't stop test execution on failure
+   * @param message Optional custom error message
+   */
+  protected constructor(
+    protected readonly actual: T,
+    protected readonly isNot: boolean,
+    protected readonly isSoft: boolean,
+    protected readonly message?: string,
+  ) {}
+
+  /**
+   * Returns a new instance of the expect class with negation toggled
+   */
+  abstract get not(): BaseExpect<T>
+
+  /**
+   * Executes an expectation with proper error handling and reporting
+   *
+   * @param assertionDescription Human-readable description of the assertion
+   * @param method The Playwright expect method to call
+   * @param params Parameters to pass to the Playwright expect method
+   * @param customActual Optional custom value to assert on instead of this.actual
+   */
+  protected async executeExpectation(
+    assertionDescription: string,
+    method: CallableExpectMethods,
+    params: unknown[] = [],
+    customActual?: unknown,
+  ): Promise<void> {
+    try {
+      await test.step(this.formatStepMessage(assertionDescription), async () => {
+        const expectFn = this.isSoft ? expectPw.soft : expectPw
+        const target = customActual || (this.actual instanceof BaseComponent ? this.actual.mainLocator : this.actual)
+        const assertion = expectFn(target, this.message)
+        if (this.isNot) {
+          await ((assertion.not as unknown) as PlaywrightExpectation)[method](...params)
+        } else {
+          await ((assertion as unknown) as PlaywrightExpectation)[method](...params)
+        }
+      }, { box: true })
+    } catch (error: unknown) {
+      // it only works when not using .soft
+      handlePlaywrightError(error, `Expectation failed: ${this.formatStepMessage(assertionDescription)}`)
+    }
+  }
 
-  protected constructor(readonly actual: Locator, readonly options: { soft: boolean }) {
+  /**
+   * Formats a human-readable step message for the assertion
+   *
+   * @param assertionDescription Human-readable description of the assertion
+   * @returns Formatted step message
+   */
+  protected formatStepMessage(assertionDescription: string): string {
+    if (this.actual instanceof BaseComponent) {
+      return `Expect ${quoteName(this.actual.componentName)} ${this.actual.componentType} ${this.notIndicator}${assertionDescription}`
+    }
+    return `Expect "${this.actual}" ${this.notIndicator}${assertionDescription}`
   }
 }

src/services/expect-decorator/CommonExpect.ts

@@ -0,0 +1,97 @@
+import type { Locator } from '@playwright/test'
+import { BaseComponent } from '@shared/components/base'
+import { BaseExpect } from './BaseExpect'
+import type {
+  BeCheckedOptions,
+  BeEnabledOptions,
+  BeVisibleOptions,
+  HaveAttributeOptions,
+  HaveContainTextOptions,
+  TimeoutOption,
+} from './options'
+
+export type ExpectInput = Locator | BaseComponent
+
+export class CommonExpect<T extends ExpectInput> extends BaseExpect<T> {
+
+  constructor(
+    actual: T,
+    isNot = false,
+    isSoft = false,
+    message?: string,
+  ) {
+    super(actual, isNot, isSoft, message)
+  }
+
+  get not(): CommonExpect<T> {
+    return new CommonExpect(this.actual, !this.isNot, this.isSoft, this.message)
+  }
+
+  async toBeVisible(options?: BeVisibleOptions): Promise<void> {
+    await this.executeExpectation('to be visible', 'toBeVisible', [options])
+  }
+
+  async toBeHidden(options?: TimeoutOption): Promise<void> {
+    await this.executeExpectation('to be hidden', 'toBeHidden', [options])
+  }
+
+  async toBeEnabled(options?: BeEnabledOptions): Promise<void> {
+    await this.executeExpectation('to be enabled', 'toBeEnabled', [options])
+  }
+
+  async toBeDisabled(options?: TimeoutOption): Promise<void> {
+    await this.executeExpectation('to be disabled', 'toBeDisabled', [options])
+  }
+
+  async toBeEmpty(options?: TimeoutOption): Promise<void> {
+    await this.executeExpectation('to be empty', 'toBeEmpty', [options])
+  }
+
+  async toHaveText(expected: string | RegExp | Array<string | RegExp>, options?: HaveContainTextOptions): Promise<void> {
+    await this.executeExpectation(`to have text "${expected}"`, 'toHaveText', [expected, options])
+  }
+
+  async toContainText(expected: string | RegExp | Array<string | RegExp>, options?: HaveContainTextOptions): Promise<void> {
+    await this.executeExpectation(`to contain text "${expected}"`, 'toContainText', [expected, options])
+  }
+
+  async toHaveValue(expected: string | RegExp, options?: TimeoutOption): Promise<void> {
+    await this.executeExpectation(`to have value "${expected}"`, 'toHaveValue', [expected, options])
+  }
+
+  async toHaveCount(expected: number, options?: TimeoutOption): Promise<void> {
+    await this.executeExpectation(`to have count "${expected}"`, 'toHaveCount', [expected, options])
+  }
+
+  async toBePressed(options?: TimeoutOption): Promise<void> {
+    await this.executeExpectation('to be pressed', 'toHaveAttribute', ['aria-pressed', 'true', options])
+  }
+
+  async toBeFocused(options?: TimeoutOption): Promise<void> {
+    await this.executeExpectation('to be focused', 'toBeFocused', [options])
+  }
+
+  async toBeChecked(options?: BeCheckedOptions): Promise<void> {
+    await this.executeExpectation('to be checked', 'toBeChecked', [options])
+  }
+
+  async toHaveClass(expected: string | RegExp | Array<string | RegExp>, options?: TimeoutOption): Promise<void> {
+    await this.executeExpectation(`to have class "${expected}"`, 'toHaveClass', [expected, options])
+  }
+
+  async toHaveAttribute(name: string, value: string | RegExp, options?: HaveAttributeOptions): Promise<void> {
+    await this.executeExpectation(`to have attribute "${name}" with value "${value}"`, 'toHaveAttribute', [name, value, options])
+  }
+
+  async toHaveIcon(expected: string, options?: TimeoutOption): Promise<void> {
+    const customLocator = this.actual instanceof BaseComponent
+      ? this.actual.mainLocator.locator('svg').first()
+      : this.actual.locator('svg').first()
+    await this.executeExpectation(
+      `to have icon "${expected}"`,
+      'toHaveAttribute',
+      ['data-testid', expected, options],
+      customLocator,
+    )
+  }
+}

src/services/expect-decorator/ExpectApiPackage.ts

@@ -1,57 +1,44 @@
-import { expect as expectPw, test } from '@fixtures'
+import { test } from '@fixtures'
 import { getAuthDataFromStorageStateFile } from '@services/auth'
 import { SS_SYSADMIN_PATH } from '@services/storage-state'
 import { createRest, rGetPackageById } from '@services/rest'
 import { BASE_ORIGIN } from '@test-setup'
+import { BaseExpect } from './BaseExpect'
 
-class BaseExpectApiPackage {
-  protected readonly notStr: string
+export type PackageInput = { packageId: string; name?: string }
+
+export class ExpectApiPackage extends BaseExpect<PackageInput> {
 
   constructor(
-    protected readonly actual: { packageId: string; name?: string },
-    protected readonly isNot: boolean,
-    protected readonly isSoft: boolean,
-    protected readonly message?: string,
+    actual: PackageInput,
+    isNot = false,
+    isSoft = false,
+    message?: string,
   ) {
-    if (isNot) {
-      this.notStr = 'not '
-    } else {
-      this.notStr = ''
-    }
+    super(actual, isNot, isSoft, message)
+  }
+
+  get not(): ExpectApiPackage {
+    return new ExpectApiPackage(this.actual, !this.isNot, this.isSoft, this.message)
+  }
+
+  protected override formatStepMessage(assertionDescription: string): string {
+    return `Expect "${this.actual.name || this.actual.packageId}" package ${this.notIndicator}${assertionDescription}`
   }
 
   async toBeCreated(): Promise<void> {
-    await test.step(`Expect Package "${this.actual.name || this.actual.packageId}" ${this.notStr}to be created `, async () => {
+    await test.step(this.formatStepMessage('to be created'), async () => {
       const authData = await getAuthDataFromStorageStateFile(SS_SYSADMIN_PATH)
       const rest = await createRest(BASE_ORIGIN, authData.token)
       const response = await rest.send(rGetPackageById, [200, 404], this.actual)
+      const expectedStatus = this.isNot ? 404 : 200
 
-      if (!this.isNot) {
-        if (!this.isSoft) {
-          expectPw(response.status(), this.message || undefined).toEqual(200)
-        } else {
-          expectPw.soft(response.status(), this.message || undefined).toEqual(200)
-        }
-      } else {
-        if (!this.isSoft) {
-          expectPw(response.status(), this.message || undefined).toEqual(404)
-        } else {
-          expectPw.soft(response.status(), this.message || undefined).toEqual(404)
-        }
-      }
+      await this.executeExpectation(
+        'to be created',
+        'toEqual',
+        [expectedStatus],
+        response.status(),
+      )
     }, { box: true })
   }
 }
-
-export class ExpectApiPackage extends BaseExpectApiPackage {
-  readonly not = new BaseExpectApiPackage(this.actual, true, this.isSoft, this.message)
-
-  constructor(
-    protected readonly actual: { packageId: string; name?: string },
-    protected readonly isNot: boolean,
-    protected readonly isSoft: boolean,
-    protected readonly message?: string,
-  ) {
-    super(actual, isNot, isSoft, message)
-  }
-}

src/services/expect-decorator/ExpectApiVersion.ts

@@ -1,57 +1,44 @@
-import { expect as expectPw, test } from '@fixtures'
+import { test } from '@fixtures'
 import { getAuthDataFromStorageStateFile } from '@services/auth'
 import { SS_SYSADMIN_PATH } from '@services/storage-state'
 import { createRest, rGetPackageVersion } from '@services/rest'
 import { BASE_ORIGIN } from '@test-setup'
+import { BaseExpect } from './BaseExpect'
 
-class BaseExpectApiVersion {
-  protected readonly notStr: string
+export type VersionInput = { packageId: string; version: string }
+
+export class ExpectApiVersion extends BaseExpect<VersionInput> {
 
   constructor(
-    protected readonly actual: { packageId: string; version: string },
-    protected readonly isNot: boolean,
-    protected readonly isSoft: boolean,
-    protected readonly message?: string,
+    actual: VersionInput,
+    isNot = false,
+    isSoft = false,
+    message?: string,
   ) {
-    if (isNot) {
-      this.notStr = 'not '
-    } else {
-      this.notStr = ''
-    }
+    super(actual, isNot, isSoft, message)
+  }
+
+  get not(): ExpectApiVersion {
+    return new ExpectApiVersion(this.actual, !this.isNot, this.isSoft, this.message)
   }
 
-  async toBeCreated(): Promise<void> {
-    await test.step(`Expect version "${this.actual.version}" ${this.notStr}to be created `, async () => {
+  protected override formatStepMessage(assertionDescription: string): string {
+    return `Expect version "${this.actual.version}" ${this.notIndicator}${assertionDescription}`
+  }
+
+  async toBePublished(): Promise<void> {
+    await test.step(this.formatStepMessage('to be created'), async () => {
       const authData = await getAuthDataFromStorageStateFile(SS_SYSADMIN_PATH)
       const rest = await createRest(BASE_ORIGIN, authData.token)
       const response = await rest.send(rGetPackageVersion, [200, 404], this.actual)
+      const expectedStatus = this.isNot ? 404 : 200
 
-      if (!this.isNot) {
-        if (!this.isSoft) {
-          expectPw(response.status(), this.message || undefined).toEqual(200)
-        } else {
-          expectPw.soft(response.status(), this.message || undefined).toEqual(200)
-        }
-      } else {
-        if (!this.isSoft) {
-          expectPw(response.status(), this.message || undefined).toEqual(404)
-        } else {
-          expectPw.soft(response.status(), this.message || undefined).toEqual(404)
-        }
-      }
+      await this.executeExpectation(
+        'to be created',
+        'toEqual',
+        [expectedStatus],
+        response.status(),
+      )
     }, { box: true })
   }
 }
-
-export class ExpectApiVersion extends BaseExpectApiVersion {
-  readonly not = new BaseExpectApiVersion(this.actual, true, this.isSoft, this.message)
-
-  constructor(
-    protected readonly actual: { packageId: string; version: string },
-    protected readonly isNot: boolean,
-    protected readonly isSoft: boolean,
-    protected readonly message?: string,
-  ) {
-    super(actual, isNot, isSoft, message)
-  }
-}