Add playwright test framework

.github/workflows/ui_test.yml

@@ -0,0 +1,26 @@
+name: Build and run UI test
+
+on:
+  pull_request:
+    branches:
+      - main
+
+jobs:
+  ui_test:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Run playwright tests
+        run: yarn playwright
+
+      - uses: actions/upload-artifact@v4
+        if: always()
+        with:
+          name: test-report
+          path: |
+            playwright/reports/
+            playwright/test-results/
+          retention-days: 7

README.md

@@ -62,6 +62,10 @@ List of primary dependencies:
 
 We are using [material ui](https://mui.com/material-ui/) and our configuration theme file it's in `AppThene.ts`
 
+## Automated UI tests
+
+See [`playwright/README.md`](./playwright/README.md).
+
 ## Commit
 
 We are using [gitmoji](https://gitmoji.dev/)(OPTIONAL) with husky and commitlint. Here you have an example of the most used ones:

package.json

@@ -13,7 +13,8 @@
     "preview": "vite preview",
     "postinstall": "husky",
     "test": "vitest",
-    "test:debug": "vitest --run --reporter=verbose --watch=false"
+    "test:debug": "vitest --run --reporter=verbose --watch=false",
+    "playwright": "docker compose -f playwright/docker-compose.yml up --abort-on-container-exit --exit-code-from tests"
   },
   "dependencies": {
     "@emotion/styled": "^11.11.0",

playwright/.dockerignore

@@ -0,0 +1,37 @@
+# General exclusions
+# Exclude version control
+.git
+*.gitignore
+
+# Exclude IDE and editor files
+.vscode
+
+# Exclude logs and caches
+logs
+*.log
+cache
+*.cache
+
+# Exclude build artifacts
+build
+dist
+*.zip
+*.tar.gz
+*.rar
+
+# Node.js specific
+node_modules
+
+# Python specific
+__pycache__/
+.pytest_cache
+
+# Mypy
+.mypy_cache
+
+# env files
+*.env
+*.env.local
+*.env.dev
+*.env.staging
+*.env.edge

playwright/.env.debug

@@ -0,0 +1 @@
+PWDEBUG=console

playwright/.gitignore

@@ -0,0 +1,172 @@
+# Byte-compiled / optimized / DLL files
+__pycache__/
+*.py[cod]
+*$py.class
+
+# C extensions
+*.so
+
+# Distribution / packaging
+.Python
+build/
+develop-eggs/
+dist/
+downloads/
+eggs/
+.eggs/
+lib/
+lib64/
+parts/
+sdist/
+var/
+wheels/
+share/python-wheels/
+*.egg-info/
+.installed.cfg
+*.egg
+MANIFEST
+
+# PyInstaller
+#  Usually these files are written by a python script from a template
+#  before PyInstaller builds the exe, so as to inject date/other infos into it.
+*.manifest
+*.spec
+
+# Installer logs
+pip-log.txt
+pip-delete-this-directory.txt
+
+# Unit test / coverage reports
+htmlcov/
+.tox/
+.nox/
+.coverage
+.coverage.*
+.cache
+nosetests.xml
+coverage.xml
+*.cover
+*.py,cover
+.hypothesis/
+.pytest_cache/
+cover/
+
+# Translations
+*.mo
+*.pot
+
+# Django stuff:
+*.log
+local_settings.py
+db.sqlite3
+db.sqlite3-journal
+
+# Flask stuff:
+instance/
+.webassets-cache
+
+# Scrapy stuff:
+.scrapy
+
+# Sphinx documentation
+docs/_build/
+
+# PyBuilder
+.pybuilder/
+target/
+
+# Jupyter Notebook
+.ipynb_checkpoints
+
+# IPython
+profile_default/
+ipython_config.py
+
+# pyenv
+#   For a library or package, you might want to ignore these files since the code is
+#   intended to run in multiple environments; otherwise, check them in:
+# .python-version
+
+# pipenv
+#   According to pypa/pipenv#598, it is recommended to include Pipfile.lock in version control.
+#   However, in case of collaboration, if having platform-specific dependencies or dependencies
+#   having no cross-platform support, pipenv may install dependencies that don't work, or not
+#   install all needed dependencies.
+#Pipfile.lock
+
+# poetry
+#   Similar to Pipfile.lock, it is generally recommended to include poetry.lock in version control.
+#   This is especially recommended for binary packages to ensure reproducibility, and is more
+#   commonly ignored for libraries.
+#   https://python-poetry.org/docs/basic-usage/#commit-your-poetrylock-file-to-version-control
+#poetry.lock
+
+# pdm
+#   Similar to Pipfile.lock, it is generally recommended to include pdm.lock in version control.
+#pdm.lock
+#   pdm stores project-wide configurations in .pdm.toml, but it is recommended to not include it
+#   in version control.
+#   https://pdm.fming.dev/#use-with-ide
+.pdm.toml
+
+# PEP 582; used by e.g. github.com/David-OConnor/pyflow and github.com/pdm-project/pdm
+__pypackages__/
+
+# Celery stuff
+celerybeat-schedule
+celerybeat.pid
+
+# SageMath parsed files
+*.sage.py
+
+# Environments
+.env
+.venv
+env/
+venv/
+ENV/
+env.bak/
+venv.bak/
+
+# Spyder project settings
+.spyderproject
+.spyproject
+
+# Rope project settings
+.ropeproject
+
+# mkdocs documentation
+/site
+
+# mypy
+.mypy_cache/
+.dmypy.json
+dmypy.json
+
+# Pyre type checker
+.pyre/
+
+# pytype static type analyzer
+.pytype/
+
+# Cython debug symbols
+cython_debug/
+
+# PyCharm
+#  JetBrains specific template is maintained in a separate JetBrains.gitignore that can
+#  be found at https://github.com/github/gitignore/blob/main/Global/JetBrains.gitignore
+#  and can be added to the global gitignore or merged into this file.  For a more nuclear
+#  option (not recommended) you can uncomment the following to ignore the entire idea folder.
+#.idea/
+
+# Custom Specifications
+#  Project specific gitignores are listed here
+
+# Test reports
+reports
+
+# Playwright traces
+test-results
+
+# File to check if docker build is necessary
+.docker_build_time

playwright/.pre-commit-config.yaml

@@ -0,0 +1,45 @@
+fail_fast: false
+default_stages: [commit, manual]
+repos:
+  - repo: https://github.com/pre-commit/pre-commit-hooks
+    rev: v4.5.0
+    hooks:
+      - id: check-ast
+      - id: check-merge-conflict
+        args: ["--assume-in-merge"]
+      - id: debug-statements
+        name: pdb_debug-statements
+      - id: trailing-whitespace
+        types: [python]
+      - id: end-of-file-fixer
+        types: [python]
+      - id: check-yaml
+      - id: check-added-large-files
+
+  - repo: https://github.com/astral-sh/ruff-pre-commit
+    # Ruff version.
+    rev: v0.1.3
+    hooks:
+      - id: ruff
+        args: [--fix, --exit-non-zero-on-fix]
+      # Run the Ruff formatter.
+      - id: ruff-format
+
+  - repo: https://github.com/pre-commit/mirrors-mypy
+    rev: v1.8.0
+    hooks:
+      - id: mypy
+        args:
+          [
+            --disallow-untyped-defs,
+            --disallow-incomplete-defs,
+            --disallow-untyped-calls,
+          ]
+        additional_dependencies:
+          [
+            pytest==8.0.0,
+            python-dotenv==1.0.1,
+            pytest-playwright==0.4.4,
+            dynaconf==3.2.4,
+            types-requests==2.31.0.20240218,
+          ]

playwright/Dockerfile.test

@@ -0,0 +1,20 @@
+# Use the official Playwright image
+FROM mcr.microsoft.com/playwright/python:v1.43.0-jammy
+
+WORKDIR /app
+
+COPY pyproject.toml poetry.lock /app/
+COPY scripts/entrypoint.sh /app/
+
+RUN \
+    apt-get update -y \
+    && apt-get upgrade -y \
+    # Install dependencies
+    && python3 -m pip install poetry \
+    && python3 -m poetry install --no-root --no-interaction --no-ansi \
+    # Set entrypoint for Docker Image
+    && cp /app/entrypoint.sh /entrypoint.sh \
+    && chmod +x /entrypoint.sh
+
+# Set the entrypoint
+ENTRYPOINT ["/entrypoint.sh"]

playwright/Dockerfile.web

@@ -0,0 +1,20 @@
+# Use the official Node.js image
+FROM node:20
+
+WORKDIR /app
+
+COPY package.json yarn.lock ./
+COPY .yarnrc.yml ./
+
+# Install dependencies
+RUN \
+    apt-get update -y \
+    && apt-get upgrade -y \
+    && yarn set version 4.3.0 \
+    && yarn install
+
+# Expose the port the app runs on
+EXPOSE 5173
+
+# Command to run the application
+CMD ["yarn", "dev", "--host", "0.0.0.0"]