# oussama-qa/e-commerce-automation-project architecture

> Architecture diagram of the GitHub repository oussama-qa/e-commerce-automation-project, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-30). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/oussama-qa/e-commerce-automation-project
- Repository: https://github.com/oussama-qa/e-commerce-automation-project

## Overview

This repository is a Playwright/TypeScript QA suite that exercises automationexercise.com through browser-based end-to-end tests and independent API tests. The main UI workflow covers login and reusable authentication, then product discovery, cart changes, and checkout/order confirmation; API auth and product checks form a separate branch. Page objects provide the internal interaction layer, with a shared base page and typed fixtures documented by the README. Several test and fixture files are not sampled, so their finer call relationships are not inferred.

Main entry points: [`playwright.config.ts`](https://github.com/oussama-qa/e-commerce-automation-project/blob/main/playwright.config.ts) (Playwright Projects), [`pages/BasePage.ts`](https://github.com/oussama-qa/e-commerce-automation-project/blob/main/pages/BasePage.ts) (Base Page), [`tests/checkout/checkout.spec.ts`](https://github.com/oussama-qa/e-commerce-automation-project/blob/main/tests/checkout/checkout.spec.ts) (Checkout Tests), [`tests/auth/auth.setup.ts`](https://github.com/oussama-qa/e-commerce-automation-project/blob/main/tests/auth/auth.setup.ts) (Login Setup)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_orchestration["Test Orchestration"]
  node_config["Playwright Projects"]
  node_fixtures["Typed Fixtures<br/>[index.ts]"]
end

subgraph group_auth["Authentication"]
  node_auth_setup["Login Setup<br/>[auth.setup.ts]"]
  node_auth_state["Saved Auth State<br/>[paths.ts]"]
  node_login_page["Login Page<br/>[LoginPage.ts]"]
  node_login_tests["Login UI Tests<br/>[login.spec.ts]"]
end

subgraph group_ui["Browser Workflows"]
  node_base_page["Base Page<br/>[BasePage.ts]"]
  node_home_page["Home Page<br/>[HomePage.ts]"]
  node_products_page["Products Page<br/>[ProductsPage.ts]"]
  node_products_tests["Product Tests<br/>[products.spec.ts]"]
  node_cart_page["Cart Page<br/>[CartPage.ts]"]
  node_cart_tests["Cart Tests<br/>[cart.spec.ts]"]
  node_checkout_page["Checkout Page<br/>[CheckoutPage.ts]"]
  node_checkout_tests["Checkout Tests<br/>[checkout.spec.ts]"]
end

subgraph group_api["API Checks"]
  node_api_auth["API Auth Tests<br/>[auth.api.spec.ts]"]
  node_api_products["API Product Tests"]
end

node_qa(("QA Engineer"))
node_target["AutomationExercise"]

node_qa -->|"selects runs"| node_config
node_config -->|"runs setup"| node_auth_setup
node_auth_setup -->|"logs in"| node_login_page
node_auth_setup -->|"writes state"| node_auth_state
node_config -->|"runs UI"| node_login_tests
node_config -->|"runs UI"| node_products_tests
node_config -->|"runs UI"| node_cart_tests
node_config -->|"runs UI"| node_checkout_tests
node_config -->|"runs API"| node_api_auth
node_config -->|"runs API"| node_api_products
node_login_tests -->|"tests login"| node_target
node_products_tests -->|"tests products"| node_target
node_cart_tests -->|"tests cart"| node_target
node_checkout_tests -->|"tests checkout"| node_target
node_api_auth -->|"tests API auth"| node_target
node_api_products -->|"tests API products"| node_target
node_login_tests -.->|"reuses state"| node_auth_state
node_checkout_tests -->|"uses state"| node_auth_state
node_fixtures -.->|"provides page objects"| node_base_page
node_home_page -->|"extends"| node_base_page
node_login_page -->|"extends"| node_base_page
node_products_page -->|"extends"| node_base_page
node_cart_page -->|"extends"| node_base_page
node_checkout_page -->|"extends"| node_base_page
node_products_tests -.->|"uses page object"| node_products_page
node_cart_tests -.->|"uses page object"| node_cart_page
node_checkout_tests -.->|"uses page object"| node_checkout_page

click node_config "https://github.com/oussama-qa/e-commerce-automation-project/blob/main/playwright.config.ts"
click node_fixtures "https://github.com/oussama-qa/e-commerce-automation-project/blob/main/fixtures/index.ts"
click node_auth_setup "https://github.com/oussama-qa/e-commerce-automation-project/blob/main/tests/auth/auth.setup.ts"
click node_auth_state "https://github.com/oussama-qa/e-commerce-automation-project/blob/main/utils/paths.ts"
click node_login_page "https://github.com/oussama-qa/e-commerce-automation-project/blob/main/pages/LoginPage.ts"
click node_login_tests "https://github.com/oussama-qa/e-commerce-automation-project/blob/main/tests/auth/login.spec.ts"
click node_base_page "https://github.com/oussama-qa/e-commerce-automation-project/blob/main/pages/BasePage.ts"
click node_home_page "https://github.com/oussama-qa/e-commerce-automation-project/blob/main/pages/HomePage.ts"
click node_products_page "https://github.com/oussama-qa/e-commerce-automation-project/blob/main/pages/ProductsPage.ts"
click node_products_tests "https://github.com/oussama-qa/e-commerce-automation-project/blob/main/tests/products/products.spec.ts"
click node_cart_page "https://github.com/oussama-qa/e-commerce-automation-project/blob/main/pages/CartPage.ts"
click node_cart_tests "https://github.com/oussama-qa/e-commerce-automation-project/blob/main/tests/cart/cart.spec.ts"
click node_checkout_page "https://github.com/oussama-qa/e-commerce-automation-project/blob/main/pages/CheckoutPage.ts"
click node_checkout_tests "https://github.com/oussama-qa/e-commerce-automation-project/blob/main/tests/checkout/checkout.spec.ts"
click node_api_auth "https://github.com/oussama-qa/e-commerce-automation-project/blob/main/tests/api/auth.api.spec.ts"
click node_api_products "https://github.com/oussama-qa/e-commerce-automation-project/blob/main/tests/api/products.api.spec.ts"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_config,node_fixtures toneBlue
class node_auth_setup,node_auth_state,node_login_page,node_login_tests toneAmber
class node_base_page,node_home_page,node_products_page,node_products_tests,node_cart_page,node_cart_tests,node_checkout_page,node_checkout_tests toneMint
class node_api_auth,node_api_products toneRose
class node_qa,node_target toneIndigo
```

## Components

### Test Orchestration

- [Playwright Projects](https://github.com/oussama-qa/e-commerce-automation-project/blob/main/playwright.config.ts): `playwright.config.ts`
- [Typed Fixtures](https://github.com/oussama-qa/e-commerce-automation-project/blob/main/fixtures/index.ts): `fixtures/index.ts`

### Authentication

- [Login Setup](https://github.com/oussama-qa/e-commerce-automation-project/blob/main/tests/auth/auth.setup.ts): `tests/auth/auth.setup.ts`
- [Saved Auth State](https://github.com/oussama-qa/e-commerce-automation-project/blob/main/utils/paths.ts): `utils/paths.ts`
- [Login Page](https://github.com/oussama-qa/e-commerce-automation-project/blob/main/pages/LoginPage.ts): `pages/LoginPage.ts`
- [Login UI Tests](https://github.com/oussama-qa/e-commerce-automation-project/blob/main/tests/auth/login.spec.ts): `tests/auth/login.spec.ts`

### Browser Workflows

- [Base Page](https://github.com/oussama-qa/e-commerce-automation-project/blob/main/pages/BasePage.ts): `pages/BasePage.ts`
- [Home Page](https://github.com/oussama-qa/e-commerce-automation-project/blob/main/pages/HomePage.ts): `pages/HomePage.ts`
- [Products Page](https://github.com/oussama-qa/e-commerce-automation-project/blob/main/pages/ProductsPage.ts): `pages/ProductsPage.ts`
- [Product Tests](https://github.com/oussama-qa/e-commerce-automation-project/blob/main/tests/products/products.spec.ts): `tests/products/products.spec.ts`
- [Cart Page](https://github.com/oussama-qa/e-commerce-automation-project/blob/main/pages/CartPage.ts): `pages/CartPage.ts`
- [Cart Tests](https://github.com/oussama-qa/e-commerce-automation-project/blob/main/tests/cart/cart.spec.ts): `tests/cart/cart.spec.ts`
- [Checkout Page](https://github.com/oussama-qa/e-commerce-automation-project/blob/main/pages/CheckoutPage.ts): `pages/CheckoutPage.ts`
- [Checkout Tests](https://github.com/oussama-qa/e-commerce-automation-project/blob/main/tests/checkout/checkout.spec.ts): `tests/checkout/checkout.spec.ts`

### API Checks

- [API Auth Tests](https://github.com/oussama-qa/e-commerce-automation-project/blob/main/tests/api/auth.api.spec.ts): `tests/api/auth.api.spec.ts`
- [API Product Tests](https://github.com/oussama-qa/e-commerce-automation-project/blob/main/tests/api/products.api.spec.ts): `tests/api/products.api.spec.ts`

### Other components

- **QA Engineer**
- **AutomationExercise**

## Connections

- QA Engineer → Playwright Projects: selects runs (evidence: `README.md`)
- Playwright Projects → Login Setup: runs setup (evidence: `playwright.config.ts`)
- Login Setup → Login Page: logs in (evidence: `README.md`)
- Login Setup → Saved Auth State: writes state (evidence: `README.md`)
- Playwright Projects → Login UI Tests: runs UI (evidence: `playwright.config.ts`)
- Playwright Projects → Product Tests: runs UI (evidence: `playwright.config.ts`)
- Playwright Projects → Cart Tests: runs UI (evidence: `playwright.config.ts`)
- Playwright Projects → Checkout Tests: runs UI (evidence: `playwright.config.ts`)
- Playwright Projects → API Auth Tests: runs API (evidence: `playwright.config.ts`)
- Playwright Projects → API Product Tests: runs API (evidence: `playwright.config.ts`)
- Login UI Tests → AutomationExercise: tests login (evidence: `README.md`)
- Product Tests → AutomationExercise: tests products (evidence: `README.md`)
- Cart Tests → AutomationExercise: tests cart (evidence: `README.md`)
- Checkout Tests → AutomationExercise: tests checkout (evidence: `README.md`)
- API Auth Tests → AutomationExercise: tests API auth (evidence: `README.md`)
- API Product Tests → AutomationExercise: tests API products (evidence: `README.md`)
- Login UI Tests → Saved Auth State: reuses state (evidence: `README.md`)
- Checkout Tests → Saved Auth State: uses state (evidence: `README.md`)
- Typed Fixtures → Base Page: provides page objects (evidence: `README.md`)
- Home Page → Base Page: extends (evidence: `pages/HomePage.ts`)
- Login Page → Base Page: extends (evidence: `pages/LoginPage.ts`)
- Products Page → Base Page: extends (evidence: `pages/ProductsPage.ts`)
- Cart Page → Base Page: extends (evidence: `pages/CartPage.ts`)
- Checkout Page → Base Page: extends (evidence: `pages/CheckoutPage.ts`)
- Product Tests → Products Page: uses page object
- Cart Tests → Cart Page: uses page object
- Checkout Tests → Checkout Page: uses page object