diff --git a/.eslintrc.json b/.eslintrc.json
index 98ce4f20..243b2733 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -1,13 +1,19 @@
 {
-  "env": {
-    "browser": true,
-    "es2021": true,
-    "node": true
-  },
-  "extends": "eslint:recommended",
+  "root": true,
+  "parser": "@typescript-eslint/parser",
+  "plugins": [
+    "@typescript-eslint"
+  ],
+  "extends": [
+    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended"
+  ],
   "parserOptions": {
     "ecmaVersion": "latest",
-    "sourceType": "module"
+    "sourceType": "module",
+    "project": "./tsconfig.json" // Make sure this path is correct if you have a tsconfig.json
   },
-  "rules": {}
+  "rules": {
+    // Your custom rules here
+  }
 }
diff --git a/.github/workflows/playwright.yml b/.github/workflows/playwright.yml
index d190efae..f178aeac 100644
--- a/.github/workflows/playwright.yml
+++ b/.github/workflows/playwright.yml
@@ -9,10 +9,9 @@ on:
 jobs:
   test:
     runs-on: ubuntu-latest
-
     permissions:
-      contents: read
-      pull-requests: write
+      contents: write # Needed for git operations (restore, commit, push) and for Prettier patch if it makes changes
+      pull-requests: write # Needed for sticky PR comment
 
     steps:
     #---------------------------------------------------
@@ -20,7 +19,10 @@ jobs:
     #---------------------------------------------------
     - name: Checkout code
       uses: actions/checkout@v3
-      with: { fetch-depth: 0 }
+      with:
+        fetch-depth: 0
+        # Explicitly checkout the PR's head branch to allow pushing back
+        ref: ${{ github.event.pull_request.head.ref }}
 
     #---------------------------------------------------
     # 1 – reviewdog CLI
@@ -37,7 +39,8 @@ jobs:
       env:
         REVIEWDOG_GITHUB_API_TOKEN: ${{ secrets.GITHUB_TOKEN }}
       run: |
-        npx prettier --write '**/*.{js,ts,tsx,jsx,json,yml,yaml,md}'
+        # Use || true to allow subsequent steps even if Prettier finds issues
+        npx prettier --write '**/*.{js,ts,tsx,jsx,json,yml,yaml,md}' || true
         git diff -U0 --no-color > prettier.patch || true
         if [ -s prettier.patch ]; then
           cat prettier.patch | reviewdog -f=diff \
@@ -49,6 +52,12 @@ jobs:
           echo "No Prettier issues found."
         fi
 
+    # IMPORTANT CHANGE: Moved this step here, immediately after Prettier.
+    # This ensures that Prettier's changes are discarded before any
+    # artifact generation or other file manipulations you want to keep/commit.
+    - name: Discard Prettier changes before Git operations
+      run: git restore .
+
     #---------------------------------------------------
     # 3 – Node & deps
     #---------------------------------------------------
@@ -69,7 +78,78 @@ jobs:
     # 5 – Run Playwright tests
     #---------------------------------------------------
     - name: Run Playwright tests
-      run: npx playwright test
+      run: |
+        # Create the directory where Playwright should output its results and screenshots
+        # The 'mkdir -p' ensures the directory exists before Playwright tries to write to it.
+        mkdir -p published-screenshots/html || true
+        echo "Running Playwright tests, outputting artifacts to: published-screenshots"
+        # Run Playwright and direct its output to 'published-screenshots'
+        # Playwright runs headless by default in CI, so no --headless flag is needed here.
+        npx playwright test --output=published-screenshots || true
+
+        echo "Contents of published-screenshots after tests:" # Debugging
+        ls -laR published-screenshots || true
+
+    # --- START OF NEW STEPS FOR SCREENSHOT PUBLISHING ---
+
+    # Prepare the directory for PR-specific screenshots on GitHub Pages
+    - name: Prepare PR Screenshots for GitHub Pages
+      if: github.event_name == 'pull_request' # Only for PRs
+      run: |
+        # Create a unique directory for this PR's screenshots within docs/
+        # e.g., docs/pr/123/screenshots/
+        PR_DIR="docs/pr/${{ github.event.pull_request.number }}/screenshots"
+        mkdir -p "$PR_DIR"
+
+        # Corrected command to find and copy nested screenshots
+        # This will find all .png files in published-screenshots/html/data/ (where Playwright puts hashed images)
+        # and copy them directly into the $PR_DIR.
+        # Use 'cp -f' to force overwrite if file exists, just in case.
+        find published-screenshots/html/data -name "*.png" -exec cp -f {} "$PR_DIR/" \; || true
+        echo "Copied screenshots to $PR_DIR/"
+        ls -lh "$PR_DIR/" # For debugging, shows what was copied
+
+    # Commit and Push PR Screenshots to GitHub Pages
+    - name: Commit and Push PR Screenshots to GitHub Pages
+      if: github.event_name == 'pull_request' # Only for PRs
+      uses: EndBug/add-and-commit@v9 # Use this action to commit and push changes
+      with:
+        add: 'docs/pr/${{ github.event.pull_request.number }}/screenshots/' # Add the new screenshot files
+        message: 'Docs: Publish Playwright screenshots for PR #${{ github.event.pull_request.number }} [skip ci]'
+        default_author: github_actions # Use GitHub Actions bot as author
+        push: true # This will push to the currently checked-out branch (your PR branch)
+
+    # Generate Markdown for screenshots with their public URLs
+    - name: Generate Screenshot Markdown for PR Comment
+      id: generate_screenshot_markdown
+      if: github.event_name == 'pull_request' # Only for PRs
+      run: |
+        # The base URL needs to be the GitHub Pages URL for your repository.
+        # Make sure the 'digitalproductinnovationanddevelopment/Code-Reviews-of-GUI-Tests' part
+        # matches your actual GitHub repository path.
+        GITHUB_PAGES_BASE_URL="https://digitalproductinnovationanddevelopment.github.io/Code-Reviews-of-GUI-Tests/pr/${{ github.event.pull_request.number }}/screenshots/"
+
+        PR_DIR="docs/pr/${{ github.event.pull_request.number }}/screenshots" # Re-define PR_DIR for this step
+
+        IMAGE_MARKDOWN=""
+        # Check if the target screenshot directory was populated
+        if [ -d "$PR_DIR" ] && find "$PR_DIR" -maxdepth 1 -name "*.png" -print -quit | grep -q .; then
+            # Now iterate over the copied files in the target directory to generate markdown
+            for img_file in "$PR_DIR"/*.png; do
+                img_name=$(basename "$img_file")
+                img_url="${GITHUB_PAGES_BASE_URL}${img_name}"
+                IMAGE_MARKDOWN+="![${img_name}](${img_url})\n\n"
+            done
+        else
+            IMAGE_MARKDOWN+="No screenshots available for this PR.\n\n"
+        fi
+
+        echo "pr_screenshots_markdown<<EOF" >> $GITHUB_OUTPUT
+        echo "$IMAGE_MARKDOWN" >> $GITHUB_OUTPUT
+        echo "EOF" >> $GITHUB_OUTPUT
+      shell: bash
+
+    # --- END OF NEW STEPS FOR SCREENSHOT PUBLISHING ---
 
     #---------------------------------------------------
     # 6 – Upload HTML report
@@ -78,35 +158,43 @@ jobs:
       if: always()
       uses: actions/upload-artifact@v4
       with:
-        name: playwright-report
-        path: playwright-report/
+        name: playwright-html-report
+        # Playwright puts HTML report in html/ subfolder of --output (after playwright.config.js change)
+        path: |
+          published-screenshots/html/
+          published-screenshots/results.json
+        if-no-files-found: ignore
 
     #---------------------------------------------------
-    # 7 – Extract Playwright test summary
+    # 7 – Extract test summary
     #---------------------------------------------------
-    - name: Extract Playwright summary
+    - name: Extract test summary
       id: summary
-      shell: bash
       run: |
-        REPORT="playwright-metrics.json"
-
-        if [ ! -f "$REPORT" ]; then
-            echo "$REPORT not found!"
-            exit 1
+        REPORT_FILE="published-screenshots/results.json" # Point to correct results.json location
+        echo "Attempting to extract summary from: $REPORT_FILE"
+
+        if [ ! -f "$REPORT_FILE" ]; then
+          echo "Error: Playwright report file not found at $REPORT_FILE"
+          # Set default values if report is missing to prevent later failures
+          echo "total=0" >> $GITHUB_OUTPUT
+          echo "passed=0" >> "$GITHUB_OUTPUT"
+          echo "failed=0" >> "$GITHUB_OUTPUT"
+          echo "skipped=0" >> "$GITHUB_OUTPUT"
+          echo "duration=0" >> "$GITHUB_OUTPUT"
+          echo "passrate=0.00" >> "$GITHUB_OUTPUT"
+          exit 0 # Allow workflow to continue even if report is missing
         fi
 
-        TOTAL=$(jq '[..|objects|select(has("status"))] | length' "$REPORT")
-        PASSED=$(jq '[..|objects|select(.status?=="expected")] | length' "$REPORT")
-        FAILED=$(jq '[..|objects|select(.status?=="failed")] | length' "$REPORT")
-        SKIPPED=$(jq '[..|objects|select(.status?=="skipped")] | length' "$REPORT")
-        DURATION=$(jq '.stats.duration*1000|floor' "$REPORT")
-
-        if [ "$TOTAL" -eq 0 ]; then
-            PASS_RATE=0.00
-        else
-            PASS_RATE=$(awk "BEGIN{printf \"%.2f\", ($PASSED/$TOTAL)*100}")
-        fi
+        # Parse data from the JSON report
+        TOTAL=$(jq '.stats.total' "$REPORT_FILE")
+        PASSED=$(jq '.stats.expected' "$REPORT_FILE")
+        FAILED=$(jq '.stats.failures' "$REPORT_FILE")
+        SKIPPED=$(jq '.stats.skipped' "$REPORT_FILE")
+        DURATION=$(jq '.stats.duration' "$REPORT_FILE")
+        PASS_RATE=$(awk "BEGIN{printf \"%.2f\", ($TOTAL==0)?0:($PASSED/$TOTAL)*100}")
 
+        # Set outputs for subsequent steps
         echo "total=$TOTAL" >> "$GITHUB_OUTPUT"
         echo "passed=$PASSED" >> "$GITHUB_OUTPUT"
         echo "failed=$FAILED" >> "$GITHUB_OUTPUT"
@@ -121,30 +209,64 @@ jobs:
     - name: Run ESLint on GUI tests
       shell: bash
       run: |
-        npx eslint "tests/**/*.{js,ts,tsx}" -f json -o eslint-tests.json || true
+        # Check if the 'tests' directory exists before running ESLint
+        if [ -d "tests" ]; then
+          echo "Running ESLint on tests directory."
+          # Output ESLint results to a JSON file for easier parsing
+          # The '|| true' allows the workflow to continue even if ESLint finds errors
+          # Add this mkdir to ensure the directory for eslint-tests.json exists
+          mkdir -p reports/eslint || true
+          npx eslint "tests/**/*.{js,ts,tsx}" -f json -o reports/eslint/eslint-tests.json || true
+          # Debugging: check if file was created and its size
+          ls -lh reports/eslint/eslint-tests.json || true
+        else
+          echo "tests/ directory not found, skipping ESLint."
+          # Create an empty JSON file so subsequent steps don't fail gracefully
+          mkdir -p reports/eslint || true
+          echo "[]" > reports/eslint/eslint-tests.json
+        fi
 
     - name: Upload ESLint report
       if: always()
       uses: actions/upload-artifact@v4
       with:
         name: eslint-test-report
-        path: eslint-tests.json
+        path: reports/eslint/eslint-tests.json
+        # Add if-no-files-found to avoid warning if no report is generated (e.g., if ESLint fails early)
+        if-no-files-found: ignore
 
     - name: Read ESLint report (preview)
       id: lint_summary
       run: |
-        echo 'summary<<EOF' >> $GITHUB_OUTPUT
-        jq '.' eslint-tests.json | head -n 20 >> $GITHUB_OUTPUT
-        echo 'EOF' >> $GITHUB_OUTPUT
-
+        if [ -f "reports/eslint/eslint-tests.json" ]; then
+          echo 'summary<<EOF' >> "$GITHUB_OUTPUT"
+          # Pretty print and get the first 20 lines for a summary
+          jq '.' reports/eslint/eslint-tests.json | head -n 20 >> "$GITHUB_OUTPUT"
+          echo 'EOF' >> "$GITHUB_OUTPUT"
+        else
+          echo 'summary<<EOF' >> "$GITHUB_OUTPUT"
+          echo 'ESLint report not generated or found.' >> "$GITHUB_OUTPUT"
+          echo 'EOF' >> "$GITHUB_OUTPUT"
+        fi
 
-   #---------------------------------------------------
-    # 9 – Extract ESLint test summary
+    #---------------------------------------------------
+    # 9 – Extract ESLint summary
     #---------------------------------------------------
     - name: Extract ESLint summary
       id: eslint_summary
       run: |
-        REPORT="eslint-tests.json"
+        REPORT="reports/eslint/eslint-tests.json" # Update path
+        if [ ! -f "$REPORT" ]; then
+          echo "Error: ESLint report file not found at $REPORT. Cannot extract summary."
+          # Set defaults if report is missing
+          echo "total_files=0" >> "$GITHUB_OUTPUT"
+          echo "errors=0" >> "$GITHUB_OUTPUT"
+          echo "warnings=0" >> "$GITHUB_OUTPUT"
+          echo "fixable_errors=0" >> "$GITHUB_OUTPUT"
+          echo "fixable_warnings=0" >> "$GITHUB_OUTPUT"
+          exit 0
+        fi
+
         TOTAL_FILES=$(jq length "$REPORT")
         ERRORS=$(jq '[.[] | .errorCount] | add' "$REPORT")
         WARNINGS=$(jq '[.[] | .warningCount] | add' "$REPORT")
@@ -154,8 +276,8 @@ jobs:
         echo "total_files=$TOTAL_FILES" >> "$GITHUB_OUTPUT"
         echo "errors=$ERRORS" >> "$GITHUB_OUTPUT"
         echo "warnings=$WARNINGS" >> "$GITHUB_OUTPUT"
-        echo "fixable_errors=$FIXABLE_ERRORS" >> "$GITHUB_OUTPUT"
         echo "fixable_warnings=$FIXABLE_WARNINGS" >> "$GITHUB_OUTPUT"
+        echo "fixable_errors=$FIXABLE_ERRORS" >> "$GITHUB_OUTPUT"
 
 
     #---------------------------------------------------
@@ -164,50 +286,67 @@ jobs:
     - name: Generate test-flow chart
       shell: bash
       run: |
-        REPORT="playwright-metrics.json"
-        set -e
+        # Set locale for 'tr' command to behave predictably across environments
+        export LC_ALL=C
+        set -e # Exit immediately if a command exits with a non-zero status
+
+        REPORT_FILE="published-screenshots/results.json" # Point to correct results.json location
+        echo "Attempting to generate flowchart from: $REPORT_FILE"
+
+        if [ ! -f "$REPORT_FILE" ]; then
+          echo "Error: Playwright report file not found at $REPORT_FILE for flowchart generation. Skipping chart."
+          exit 0 # Exit this step gracefully if report is missing
+        fi
+
         echo "graph TD" > flowchart.mmd
 
+        # Use jq to parse the JSON and format it for Mermaid, ensuring safe IDs
         jq -r '
           .suites[] as $file |
-            ($file.title // "NO_FILE_TITLE") as $fileTitle |
-            $file.suites[]? as $suite |
-              ($suite.title // "NO_SUITE_TITLE") as $suiteTitle |
-              $suite.specs[]? as $spec |
-                ($spec.title // "NO_SPEC_TITLE") as $specTitle |
-                [$fileTitle, $suiteTitle, $specTitle] | @tsv
-        ' "$REPORT" |
+          ($file.title // "NO_FILE_TITLE") as $fileTitle |
+          $file.suites[]? as $suite |
+            ($suite.title // "NO_SUITE_TITLE") as $suiteTitle |
+            $suite.specs[]? as $spec |
+              ($spec.title // "NO_SPEC_TITLE") as $specTitle |
+              [$fileTitle, $suiteTitle, $specTitle] | @tsv
+        ' "$REPORT_FILE" |
         while IFS=$'\t' read -r fileTitle suiteTitle specTitle; do
-          # Build unique, safe IDs by combining parent and child
-          fileId=$(echo "$fileTitle" | tr -c 'A-Za-z0-9' '_' | sed 's/^_*\|_*$//g')
-          suiteId=$(echo "${fileTitle}_${suiteTitle}" | tr -c 'A-Za-z0-9' '_' | sed 's/^_*\|_*$//g')
-          specId=$(echo "${fileTitle}_${suiteTitle}_${specTitle}" | tr -c 'A-Za-z0-9' '_' | sed 's/^_*\|_*$//g')
+          # Sanitize titles to create valid Mermaid IDs (alphanumeric, underscores, limited length)
+          fileId=$(echo "$fileTitle" | sed 's/[^a-zA-Z0-9_]/_/g' | sed 's/^_*\|_*$//g' | cut -c 1-50)
+          suiteId=$(echo "${fileTitle}_${suiteTitle}" | sed 's/[^a-zA-Z0-9_]/_/g' | sed 's/^_*\|_*$//g' | cut -c 1-50)
+          specId=$(echo "${fileTitle}_${suiteTitle}_${specTitle}" | sed 's/[^a-zA-Z0-9_]/_/g' | sed 's/^_*\|_*$//g' | cut -c 1-50)
+
+          # Skip if IDs become empty after sanitization
+          if [ -z "$fileId" ] || [ -z "$suiteId" ] || [ -z "$specId" ]; then
+            echo "Warning: Skipped a test entry due to invalid/empty IDs after sanitization. Original: File='$fileTitle', Suite='$suiteTitle', Spec='$specTitle'"
+            continue
+          fi
 
-          # File node
+          # Add nodes and edges to flowchart.mmd, checking for duplicates
           if ! grep -q "^  ${fileId}\[" flowchart.mmd; then
             echo "  ${fileId}[\"${fileTitle}\"]" >> flowchart.mmd
           fi
-          # Suite node
           if ! grep -q "^  ${suiteId}\[" flowchart.mmd; then
             echo "  ${suiteId}[\"${suiteTitle}\"]" >> flowchart.mmd
             echo "  ${fileId} --> ${suiteId}" >> flowchart.mmd
           fi
-          # Spec node/edge
           echo "  ${suiteId} --> ${specId}[\"${specTitle}\"]" >> flowchart.mmd
         done
 
+        # Configuration for Puppeteer (used by mermaid-cli)
         printf '{ "args": ["--no-sandbox","--disable-setuid-sandbox"] }\n' > puppeteer.json
 
+        # Run mermaid-cli to generate the flowchart image
         npx -y @mermaid-js/mermaid-cli@10.6.1 \
           -p puppeteer.json \
           -i flowchart.mmd \
-          -o flowchart.png
+          -o flowchart.png || true # Add || true to allow subsequent steps if mermaid-cli fails
 
-        ls -lh flowchart.png
+        ls -lh flowchart.png || true # List generated file, add || true for robustness
 
 
-    - name: Show flowchart.mmd for debugging  
-      run: cat flowchart.mmd
+    - name: Show flowchart.mmd for debugging
+      run: cat flowchart.mmd || true # Show content for debugging, add || true for robustness
 
     - name: Upload test-flow chart
       if: always()
@@ -215,6 +354,7 @@ jobs:
       with:
         name: test-flow-chart
         path: flowchart.png
+        if-no-files-found: ignore
 
     #---------------------------------------------------
     # 11 – Sticky PR comment
@@ -224,26 +364,35 @@ jobs:
       with:
         message: |
           ## Playwright Test Metrics
-          *Total:* **${{ steps.summary.outputs.total }}**  
-          *Passed:* **${{ steps.summary.outputs.passed }}**  
-          *Failed:* **${{ steps.summary.outputs.failed }}**  
+          *Total:* **${{ steps.summary.outputs.total }}**
+          *Passed:* **${{ steps.summary.outputs.passed }}**
+          *Failed:* **${{ steps.summary.outputs.failed }}**
           *Skipped:* **${{ steps.summary.outputs.skipped }}**
 
-          *Duration:* **${{ steps.summary.outputs.duration }} ms**  
+          *Duration:* **${{ steps.summary.outputs.duration }} ms**
           *Pass Rate:* **${{ steps.summary.outputs.passrate }} %**
-         
- 
-          ## ESLint Test Metrics
-          *Files Checked:* **${{ steps.eslint_summary.outputs.total_files }}**  
-          *Errors:* **${{ steps.eslint_summary.outputs.errors }}**  
-          *Warnings:* **${{ steps.eslint_summary.outputs.warnings }}**  
-          *Fixable Errors:* **${{ steps.eslint_summary.outputs.fixable_errors }}**  
+
+          ## ESLint (GUI tests)
+          *Total files scanned:* **${{ steps.eslint_summary.outputs.total_files }}**
+          *Errors:* **${{ steps.eslint_summary.outputs.errors }}**
+          *Warnings:* **${{ steps.eslint_summary.outputs.warnings }}**
+          *Fixable Errors:* **${{ steps.eslint_summary.outputs.fixable_errors }}**
           *Fixable Warnings:* **${{ steps.eslint_summary.outputs.fixable_warnings }}**
           ```
-          ${{ steps.lint_summary.outputs.summary }}
+          ${{ steps.lint_summary.outputs.summary }} # Keep this for the first 20 lines of raw output if desired
           ```
 
-          ## Test-Flow Chart  
+          ## Test-Flow Chart
           Artifact: **test-flow-chart → flowchart.png**
 
-          _Full run details:_ [link](https://github.com/${{ github.repository }}/actions/runs/${{ github.run_id }})
\ No newline at end of file
+          ## Playwright Screenshots for this PR
+          ${{ steps.generate_screenshot_markdown.outputs.pr_screenshots_markdown }}
+
+          ---
+
+          **View Full Reports:**
+          You can download the following artifacts from this workflow run's summary page:
+          * **`playwright-html-report`**: The full interactive Playwright HTML report for this PR's branch.
+          * **`eslint-test-report`**: Detailed ESLint results.
+
+          _Full run details:_ [link](https://github.com/${{ github.repository }}/actions/runs/${{ github.run_id }})
diff --git a/docs/pr/93/screenshots/022863690ade3cd174130f7f3ffe3ae997423992.png b/docs/pr/93/screenshots/022863690ade3cd174130f7f3ffe3ae997423992.png
new file mode 100644
index 00000000..81149a1f
Binary files /dev/null and b/docs/pr/93/screenshots/022863690ade3cd174130f7f3ffe3ae997423992.png differ
diff --git a/docs/pr/93/screenshots/0adfdf9dff86ec4adc0bf940ad9cb71151a1201d.png b/docs/pr/93/screenshots/0adfdf9dff86ec4adc0bf940ad9cb71151a1201d.png
new file mode 100644
index 00000000..cfc62004
Binary files /dev/null and b/docs/pr/93/screenshots/0adfdf9dff86ec4adc0bf940ad9cb71151a1201d.png differ
diff --git a/docs/pr/93/screenshots/0d396de259b2fc1a7ece301cea800eba27cd36da.png b/docs/pr/93/screenshots/0d396de259b2fc1a7ece301cea800eba27cd36da.png
new file mode 100644
index 00000000..6c690e79
Binary files /dev/null and b/docs/pr/93/screenshots/0d396de259b2fc1a7ece301cea800eba27cd36da.png differ
diff --git a/docs/pr/93/screenshots/1688c052c10f9164af5baa36ee3c2f391b10a514.png b/docs/pr/93/screenshots/1688c052c10f9164af5baa36ee3c2f391b10a514.png
new file mode 100644
index 00000000..7ea0edfb
Binary files /dev/null and b/docs/pr/93/screenshots/1688c052c10f9164af5baa36ee3c2f391b10a514.png differ
diff --git a/docs/pr/93/screenshots/1856d4d2bb84993d729169d44338d6b3fa4b39eb.png b/docs/pr/93/screenshots/1856d4d2bb84993d729169d44338d6b3fa4b39eb.png
new file mode 100644
index 00000000..6fcd0991
Binary files /dev/null and b/docs/pr/93/screenshots/1856d4d2bb84993d729169d44338d6b3fa4b39eb.png differ
diff --git a/docs/pr/93/screenshots/24d775f4e78505c80f187c61968ac1a63962f4e2.png b/docs/pr/93/screenshots/24d775f4e78505c80f187c61968ac1a63962f4e2.png
new file mode 100644
index 00000000..f3eee6ee
Binary files /dev/null and b/docs/pr/93/screenshots/24d775f4e78505c80f187c61968ac1a63962f4e2.png differ
diff --git a/docs/pr/93/screenshots/333b5ce71d0cb6c5f19c943f78da252edc0998ba.png b/docs/pr/93/screenshots/333b5ce71d0cb6c5f19c943f78da252edc0998ba.png
new file mode 100644
index 00000000..e4c241b2
Binary files /dev/null and b/docs/pr/93/screenshots/333b5ce71d0cb6c5f19c943f78da252edc0998ba.png differ
diff --git a/docs/pr/93/screenshots/467b296a96ad8bdd7a9eb5e60b48f4a60e43e270.png b/docs/pr/93/screenshots/467b296a96ad8bdd7a9eb5e60b48f4a60e43e270.png
new file mode 100644
index 00000000..d635f023
Binary files /dev/null and b/docs/pr/93/screenshots/467b296a96ad8bdd7a9eb5e60b48f4a60e43e270.png differ
diff --git a/docs/pr/93/screenshots/5c18a2a0182f8d1b48acf547e68cd16fa88c1c5d.png b/docs/pr/93/screenshots/5c18a2a0182f8d1b48acf547e68cd16fa88c1c5d.png
new file mode 100644
index 00000000..de60af34
Binary files /dev/null and b/docs/pr/93/screenshots/5c18a2a0182f8d1b48acf547e68cd16fa88c1c5d.png differ
diff --git a/docs/pr/93/screenshots/5eeb0aea135cf8abcedf660fa8aaef04b12e701e.png b/docs/pr/93/screenshots/5eeb0aea135cf8abcedf660fa8aaef04b12e701e.png
new file mode 100644
index 00000000..02372916
Binary files /dev/null and b/docs/pr/93/screenshots/5eeb0aea135cf8abcedf660fa8aaef04b12e701e.png differ
diff --git a/docs/pr/93/screenshots/70fd0f3c5ba235f7eaee2a7c343ecafae2eb901f.png b/docs/pr/93/screenshots/70fd0f3c5ba235f7eaee2a7c343ecafae2eb901f.png
new file mode 100644
index 00000000..6d5328b1
Binary files /dev/null and b/docs/pr/93/screenshots/70fd0f3c5ba235f7eaee2a7c343ecafae2eb901f.png differ
diff --git a/docs/pr/93/screenshots/7932ff81788db5d5b0a2fefb31441ea72648264b.png b/docs/pr/93/screenshots/7932ff81788db5d5b0a2fefb31441ea72648264b.png
new file mode 100644
index 00000000..6453b343
Binary files /dev/null and b/docs/pr/93/screenshots/7932ff81788db5d5b0a2fefb31441ea72648264b.png differ
diff --git a/docs/pr/93/screenshots/7e1c687e42769360053d4f6dc6995acdca656ae4.png b/docs/pr/93/screenshots/7e1c687e42769360053d4f6dc6995acdca656ae4.png
new file mode 100644
index 00000000..d78f7e30
Binary files /dev/null and b/docs/pr/93/screenshots/7e1c687e42769360053d4f6dc6995acdca656ae4.png differ
diff --git a/docs/pr/93/screenshots/8396278520ed64a946503148b2933fb9fdbff3f9.png b/docs/pr/93/screenshots/8396278520ed64a946503148b2933fb9fdbff3f9.png
new file mode 100644
index 00000000..d9386da1
Binary files /dev/null and b/docs/pr/93/screenshots/8396278520ed64a946503148b2933fb9fdbff3f9.png differ
diff --git a/docs/pr/93/screenshots/953dbced67c8dfb4a4ee2bfe90a837cd7ec9fd57.png b/docs/pr/93/screenshots/953dbced67c8dfb4a4ee2bfe90a837cd7ec9fd57.png
new file mode 100644
index 00000000..30a0198d
Binary files /dev/null and b/docs/pr/93/screenshots/953dbced67c8dfb4a4ee2bfe90a837cd7ec9fd57.png differ
diff --git a/docs/pr/93/screenshots/9976f054b377810cc2dcf1591977e6b9ca7edf71.png b/docs/pr/93/screenshots/9976f054b377810cc2dcf1591977e6b9ca7edf71.png
new file mode 100644
index 00000000..e9d3535f
Binary files /dev/null and b/docs/pr/93/screenshots/9976f054b377810cc2dcf1591977e6b9ca7edf71.png differ
diff --git a/docs/pr/93/screenshots/a39640ecbee5d6264f0e15369ebfd2cb6a22ad7c.png b/docs/pr/93/screenshots/a39640ecbee5d6264f0e15369ebfd2cb6a22ad7c.png
new file mode 100644
index 00000000..ce828372
Binary files /dev/null and b/docs/pr/93/screenshots/a39640ecbee5d6264f0e15369ebfd2cb6a22ad7c.png differ
diff --git a/docs/pr/93/screenshots/a7dea094fb6784c13bf40d32bc7e457f7ce16c1f.png b/docs/pr/93/screenshots/a7dea094fb6784c13bf40d32bc7e457f7ce16c1f.png
new file mode 100644
index 00000000..b93704f3
Binary files /dev/null and b/docs/pr/93/screenshots/a7dea094fb6784c13bf40d32bc7e457f7ce16c1f.png differ
diff --git a/docs/pr/93/screenshots/abb683800c9a3b04e74353bde00a13ee9778702a.png b/docs/pr/93/screenshots/abb683800c9a3b04e74353bde00a13ee9778702a.png
new file mode 100644
index 00000000..ef7e3f15
Binary files /dev/null and b/docs/pr/93/screenshots/abb683800c9a3b04e74353bde00a13ee9778702a.png differ
diff --git a/docs/pr/93/screenshots/b32410c334e5c47dd085c36fd2148b0026553a50.png b/docs/pr/93/screenshots/b32410c334e5c47dd085c36fd2148b0026553a50.png
new file mode 100644
index 00000000..63912644
Binary files /dev/null and b/docs/pr/93/screenshots/b32410c334e5c47dd085c36fd2148b0026553a50.png differ
diff --git a/docs/pr/93/screenshots/b6a8f02d2830595b888118088c4226c7103f8a24.png b/docs/pr/93/screenshots/b6a8f02d2830595b888118088c4226c7103f8a24.png
new file mode 100644
index 00000000..2c03f4cc
Binary files /dev/null and b/docs/pr/93/screenshots/b6a8f02d2830595b888118088c4226c7103f8a24.png differ
diff --git a/docs/pr/93/screenshots/c7377c85b0fd0eeb3a7b684ac1ff57bf6e2ab35a.png b/docs/pr/93/screenshots/c7377c85b0fd0eeb3a7b684ac1ff57bf6e2ab35a.png
new file mode 100644
index 00000000..935c687d
Binary files /dev/null and b/docs/pr/93/screenshots/c7377c85b0fd0eeb3a7b684ac1ff57bf6e2ab35a.png differ
diff --git a/docs/pr/93/screenshots/f0ed3e839888e6beca7dd890b25f53db0018f600.png b/docs/pr/93/screenshots/f0ed3e839888e6beca7dd890b25f53db0018f600.png
new file mode 100644
index 00000000..85aae23e
Binary files /dev/null and b/docs/pr/93/screenshots/f0ed3e839888e6beca7dd890b25f53db0018f600.png differ
diff --git a/docs/pr/93/screenshots/f29f203c9eb51f0ce4e24a7ae310ac9590957275.png b/docs/pr/93/screenshots/f29f203c9eb51f0ce4e24a7ae310ac9590957275.png
new file mode 100644
index 00000000..56818d50
Binary files /dev/null and b/docs/pr/93/screenshots/f29f203c9eb51f0ce4e24a7ae310ac9590957275.png differ
diff --git a/docs/pr/93/screenshots/fdbe5f510829e15e755334c23dbbd8ca8ac75462.png b/docs/pr/93/screenshots/fdbe5f510829e15e755334c23dbbd8ca8ac75462.png
new file mode 100644
index 00000000..40129f29
Binary files /dev/null and b/docs/pr/93/screenshots/fdbe5f510829e15e755334c23dbbd8ca8ac75462.png differ
diff --git a/docs/pr/93/screenshots/test-finished-1.png b/docs/pr/93/screenshots/test-finished-1.png
new file mode 100644
index 00000000..30a0198d
Binary files /dev/null and b/docs/pr/93/screenshots/test-finished-1.png differ
diff --git a/package.json b/package.json
index 96ca6e9d..a94b3b96 100644
--- a/package.json
+++ b/package.json
@@ -20,6 +20,8 @@
   "homepage": "https://github.com/DigitalProductInnovationAndDevelopment/Code-Reviews-of-GUI-Tests#readme",
   "devDependencies": {
     "@playwright/test": "^1.52.0",
-    "eslint": "^8.0.0"
+    "eslint": "^8.0.0",
+    "@typescript-eslint/eslint-plugin": "^7.0.0",
+    "@typescript-eslint/parser": "^7.0.0"
   }
 }
diff --git a/playwright.config.js b/playwright.config.js
index fd6b1b23..9158f734 100644
--- a/playwright.config.js
+++ b/playwright.config.js
@@ -1,16 +1,37 @@
-const { defineConfig } = require('@playwright/test');
+// playwright.config.js
+import { defineConfig, devices } from '@playwright/test';
 
-module.exports = defineConfig({
-  testDir: './tests',
+export default defineConfig({
+  testDir: "./tests",
+  fullyParallel: true,
+  forbidOnly: !!process.env.CI,
+  retries: process.env.CI ? 2 : 0,
+  workers: process.env.CI ? 1 : undefined,
+  reporter: [
+    // Corrected to output HTML report to a subfolder within published-screenshots
+    // This should fix the 'published-screenshots/html/' not found warning.
+    ["html", { open: "never", outputFolder: "published-screenshots/html" }],
+    // Ensure JSON report is also in published-screenshots
+    ["json", { outputFile: "published-screenshots/results.json" }]
+  ],
   use: {
-    headless: true,
-    screenshot: 'on',
-    trace: 'on',
-    video: 'off',
-    ignoreHTTPSErrors: true,
+    trace: "on-first-retry",
+    headless: true, // Playwright runs headless by default in CI
+    screenshot: "on", // Takes screenshots on failure or specific steps
   },
-  reporter: [
-    ['json', { outputFile: 'playwright-metrics.json' }],
-    ['html', { outputFile: 'report.html', open: 'never' }],
+  projects: [
+    {
+      name: "chromium",
+      use: { ...devices["Desktop Chrome"] },
+    },
+    // You can add other projects for different browsers here if needed, e.
+    // {
+    //  name: "firefox",
+    //  use: { ...devices["Desktop Firefox"] },
+    // },
+    // {
+    //  name: "webkit",
+    //  use: { ...devices["Desktop Safari"] },
+    // },
   ],
-});
\ No newline at end of file
+});
diff --git a/pr/93/screenshots/0adfdf9dff86ec4adc0bf940ad9cb71151a1201d.png b/pr/93/screenshots/0adfdf9dff86ec4adc0bf940ad9cb71151a1201d.png
new file mode 100644
index 00000000..cfc62004
Binary files /dev/null and b/pr/93/screenshots/0adfdf9dff86ec4adc0bf940ad9cb71151a1201d.png differ
diff --git a/pr/93/screenshots/0d396de259b2fc1a7ece301cea800eba27cd36da.png b/pr/93/screenshots/0d396de259b2fc1a7ece301cea800eba27cd36da.png
new file mode 100644
index 00000000..6c690e79
Binary files /dev/null and b/pr/93/screenshots/0d396de259b2fc1a7ece301cea800eba27cd36da.png differ
diff --git a/pr/93/screenshots/1688c052c10f9164af5baa36ee3c2f391b10a514.png b/pr/93/screenshots/1688c052c10f9164af5baa36ee3c2f391b10a514.png
new file mode 100644
index 00000000..7ea0edfb
Binary files /dev/null and b/pr/93/screenshots/1688c052c10f9164af5baa36ee3c2f391b10a514.png differ
diff --git a/pr/93/screenshots/24d775f4e78505c80f187c61968ac1a63962f4e2.png b/pr/93/screenshots/24d775f4e78505c80f187c61968ac1a63962f4e2.png
new file mode 100644
index 00000000..f3eee6ee
Binary files /dev/null and b/pr/93/screenshots/24d775f4e78505c80f187c61968ac1a63962f4e2.png differ
diff --git a/pr/93/screenshots/333b5ce71d0cb6c5f19c943f78da252edc0998ba.png b/pr/93/screenshots/333b5ce71d0cb6c5f19c943f78da252edc0998ba.png
new file mode 100644
index 00000000..e4c241b2
Binary files /dev/null and b/pr/93/screenshots/333b5ce71d0cb6c5f19c943f78da252edc0998ba.png differ
diff --git a/pr/93/screenshots/467b296a96ad8bdd7a9eb5e60b48f4a60e43e270.png b/pr/93/screenshots/467b296a96ad8bdd7a9eb5e60b48f4a60e43e270.png
new file mode 100644
index 00000000..d635f023
Binary files /dev/null and b/pr/93/screenshots/467b296a96ad8bdd7a9eb5e60b48f4a60e43e270.png differ
diff --git a/pr/93/screenshots/5c18a2a0182f8d1b48acf547e68cd16fa88c1c5d.png b/pr/93/screenshots/5c18a2a0182f8d1b48acf547e68cd16fa88c1c5d.png
new file mode 100644
index 00000000..de60af34
Binary files /dev/null and b/pr/93/screenshots/5c18a2a0182f8d1b48acf547e68cd16fa88c1c5d.png differ
diff --git a/pr/93/screenshots/5eeb0aea135cf8abcedf660fa8aaef04b12e701e.png b/pr/93/screenshots/5eeb0aea135cf8abcedf660fa8aaef04b12e701e.png
new file mode 100644
index 00000000..02372916
Binary files /dev/null and b/pr/93/screenshots/5eeb0aea135cf8abcedf660fa8aaef04b12e701e.png differ
diff --git a/pr/93/screenshots/70fd0f3c5ba235f7eaee2a7c343ecafae2eb901f.png b/pr/93/screenshots/70fd0f3c5ba235f7eaee2a7c343ecafae2eb901f.png
new file mode 100644
index 00000000..6d5328b1
Binary files /dev/null and b/pr/93/screenshots/70fd0f3c5ba235f7eaee2a7c343ecafae2eb901f.png differ
diff --git a/pr/93/screenshots/7932ff81788db5d5b0a2fefb31441ea72648264b.png b/pr/93/screenshots/7932ff81788db5d5b0a2fefb31441ea72648264b.png
new file mode 100644
index 00000000..6453b343
Binary files /dev/null and b/pr/93/screenshots/7932ff81788db5d5b0a2fefb31441ea72648264b.png differ
diff --git a/pr/93/screenshots/7e1c687e42769360053d4f6dc6995acdca656ae4.png b/pr/93/screenshots/7e1c687e42769360053d4f6dc6995acdca656ae4.png
new file mode 100644
index 00000000..d78f7e30
Binary files /dev/null and b/pr/93/screenshots/7e1c687e42769360053d4f6dc6995acdca656ae4.png differ
diff --git a/pr/93/screenshots/8396278520ed64a946503148b2933fb9fdbff3f9.png b/pr/93/screenshots/8396278520ed64a946503148b2933fb9fdbff3f9.png
new file mode 100644
index 00000000..d9386da1
Binary files /dev/null and b/pr/93/screenshots/8396278520ed64a946503148b2933fb9fdbff3f9.png differ
diff --git a/pr/93/screenshots/953dbced67c8dfb4a4ee2bfe90a837cd7ec9fd57.png b/pr/93/screenshots/953dbced67c8dfb4a4ee2bfe90a837cd7ec9fd57.png
new file mode 100644
index 00000000..30a0198d
Binary files /dev/null and b/pr/93/screenshots/953dbced67c8dfb4a4ee2bfe90a837cd7ec9fd57.png differ
diff --git a/pr/93/screenshots/9976f054b377810cc2dcf1591977e6b9ca7edf71.png b/pr/93/screenshots/9976f054b377810cc2dcf1591977e6b9ca7edf71.png
new file mode 100644
index 00000000..e9d3535f
Binary files /dev/null and b/pr/93/screenshots/9976f054b377810cc2dcf1591977e6b9ca7edf71.png differ
diff --git a/pr/93/screenshots/a39640ecbee5d6264f0e15369ebfd2cb6a22ad7c.png b/pr/93/screenshots/a39640ecbee5d6264f0e15369ebfd2cb6a22ad7c.png
new file mode 100644
index 00000000..ce828372
Binary files /dev/null and b/pr/93/screenshots/a39640ecbee5d6264f0e15369ebfd2cb6a22ad7c.png differ
diff --git a/pr/93/screenshots/a7dea094fb6784c13bf40d32bc7e457f7ce16c1f.png b/pr/93/screenshots/a7dea094fb6784c13bf40d32bc7e457f7ce16c1f.png
new file mode 100644
index 00000000..b93704f3
Binary files /dev/null and b/pr/93/screenshots/a7dea094fb6784c13bf40d32bc7e457f7ce16c1f.png differ
diff --git a/pr/93/screenshots/b6a8f02d2830595b888118088c4226c7103f8a24.png b/pr/93/screenshots/b6a8f02d2830595b888118088c4226c7103f8a24.png
new file mode 100644
index 00000000..2c03f4cc
Binary files /dev/null and b/pr/93/screenshots/b6a8f02d2830595b888118088c4226c7103f8a24.png differ
diff --git a/pr/93/screenshots/c7377c85b0fd0eeb3a7b684ac1ff57bf6e2ab35a.png b/pr/93/screenshots/c7377c85b0fd0eeb3a7b684ac1ff57bf6e2ab35a.png
new file mode 100644
index 00000000..935c687d
Binary files /dev/null and b/pr/93/screenshots/c7377c85b0fd0eeb3a7b684ac1ff57bf6e2ab35a.png differ
diff --git a/pr/93/screenshots/f0ed3e839888e6beca7dd890b25f53db0018f600.png b/pr/93/screenshots/f0ed3e839888e6beca7dd890b25f53db0018f600.png
new file mode 100644
index 00000000..85aae23e
Binary files /dev/null and b/pr/93/screenshots/f0ed3e839888e6beca7dd890b25f53db0018f600.png differ
diff --git a/pr/93/screenshots/f29f203c9eb51f0ce4e24a7ae310ac9590957275.png b/pr/93/screenshots/f29f203c9eb51f0ce4e24a7ae310ac9590957275.png
new file mode 100644
index 00000000..56818d50
Binary files /dev/null and b/pr/93/screenshots/f29f203c9eb51f0ce4e24a7ae310ac9590957275.png differ
diff --git a/pr/93/screenshots/fdbe5f510829e15e755334c23dbbd8ca8ac75462.png b/pr/93/screenshots/fdbe5f510829e15e755334c23dbbd8ca8ac75462.png
new file mode 100644
index 00000000..40129f29
Binary files /dev/null and b/pr/93/screenshots/fdbe5f510829e15e755334c23dbbd8ca8ac75462.png differ
diff --git a/tsconfig.json b/tsconfig.json
new file mode 100644
index 00000000..290512d0
--- /dev/null
+++ b/tsconfig.json
@@ -0,0 +1,18 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "module": "CommonJS",
+    "strict": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true,
+    // If your tests use JSX (e.g., for React components), uncomment the line below:
+    // "jsx": "react-jsx",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "allowJs": true,
+    "checkJs": true
+  },
+  "include": ["tests/**/*.ts", "tests/**/*.js"], // Changed this line
+  "exclude": ["node_modules"] // Changed this line
+}