ASF-Nabd/testarena
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

theme

Browse Source
This commit is contained in:
mahmamdouh
2026-01-05 15:41:31 +01:00
parent 67e51a5348
commit 2d81f78fed
3 changed files with 349 additions and 147 deletions
Download Patch File Download Diff File Expand all files Collapse all files

273
app/static/css/style.css
View File

@@ -1,12 +1,26 @@
:root { :root {
--primary: #2563eb; --primary: #3b82f6;
--primary-dark: #1e40af; /* Blue 500 */
--primary-dark: #2563eb;
/* Blue 600 */
--success: #10b981; --success: #10b981;
/* Emerald 500 */
--danger: #ef4444; --danger: #ef4444;
/* Red 500 */
--warning: #f59e0b; --warning: #f59e0b;
--dark: #1f2937; /* Amber 500 */
--light: #f3f4f6; --dark: #f8fafc;
--border: #e5e7eb; /* Slate 50 (Text) */
--bg-dark: #0f172a;
/* Slate 900 (Body) */
--bg-panel: #1e293b;
/* Slate 800 (Panels) */
--bg-input: #334155;
/* Slate 700 (Inputs) */
--border: #334155;
/* Slate 700 */
--text-muted: #94a3b8;
/* Slate 400 */
} }
* { * {
@@ -16,8 +30,9 @@
} }
body { body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; font-family: 'Inter', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
background: linear-gradient(135deg, #4f46e5 0%, #3730a3 100%); background: var(--bg-dark);
color: var(--dark);
min-height: 100vh; min-height: 100vh;
} }
@@ -36,12 +51,13 @@ body {
} }
.login-box { .login-box {
background: white; background: var(--bg-panel);
padding: 40px; padding: 40px;
border-radius: 12px; border-radius: 16px;
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2); box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
width: 100%; width: 100%;
max-width: 400px; max-width: 400px;
border: 1px solid var(--border);
} }
.logo { .logo {
@@ -58,6 +74,7 @@ body {
color: var(--dark); color: var(--dark);
margin-top: 15px; margin-top: 15px;
font-size: 24px; font-size: 24px;
font-weight: 700;
} }
.form-group { .form-group {
@@ -67,21 +84,25 @@ body {
.form-group label { .form-group label {
display: block; display: block;
margin-bottom: 8px; margin-bottom: 8px;
color: var(--dark); color: var(--text-muted);
font-weight: 500; font-weight: 500;
} }
.form-control { .form-control {
width: 100%; width: 100%;
padding: 12px; padding: 12px;
border: 2px solid var(--border); background: var(--bg-input);
border: 1px solid var(--border);
border-radius: 8px; border-radius: 8px;
font-size: 14px; font-size: 14px;
color: var(--dark);
transition: all 0.2s;
} }
.form-control:focus { .form-control:focus {
outline: none; outline: none;
border-color: var(--primary); border-color: var(--primary);
box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
} }
.btn { .btn {
@@ -127,25 +148,26 @@ body {
} }
.alert-success { .alert-success {
background: #d1fae5; background: rgba(16, 185, 129, 0.1);
color: #065f46; color: #34d399;
border: 1px solid #10b981; border: 1px solid rgba(16, 185, 129, 0.2);
} }
.alert-error { .alert-error {
background: #fee2e2; background: rgba(239, 68, 68, 0.1);
color: #991b1b; color: #f87171;
border: 1px solid #ef4444; border: 1px solid rgba(239, 68, 68, 0.2);
} }
/* Navbar */ /* Navbar */
.navbar { .navbar {
background: white; background: var(--bg-panel);
padding: 15px 30px; padding: 15px 30px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
border-bottom: 1px solid var(--border);
} }
.navbar-brand { .navbar-brand {
@@ -161,6 +183,7 @@ body {
.navbar-brand h2 { .navbar-brand h2 {
color: var(--dark); color: var(--dark);
font-size: 20px; font-size: 20px;
font-weight: 700;
} }
.navbar-menu { .navbar-menu {
@@ -170,7 +193,7 @@ body {
} }
.navbar-menu a { .navbar-menu a {
color: var(--dark); color: var(--text-muted);
text-decoration: none; text-decoration: none;
font-weight: 500; font-weight: 500;
transition: color 0.3s; transition: color 0.3s;
@@ -190,11 +213,12 @@ body {
} }
.panel { .panel {
background: white; background: var(--bg-panel);
border-radius: 12px; border-radius: 16px;
padding: 20px; padding: 20px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
overflow-y: auto; overflow-y: auto;
border: 1px solid var(--border);
} }
.panel-header { .panel-header {
@@ -203,12 +227,13 @@ body {
align-items: center; align-items: center;
margin-bottom: 20px; margin-bottom: 20px;
padding-bottom: 15px; padding-bottom: 15px;
border-bottom: 2px solid var(--border); border-bottom: 1px solid var(--border);
} }
.panel-header h3 { .panel-header h3 {
color: var(--dark); color: var(--dark);
font-size: 18px; font-size: 18px;
font-weight: 600;
} }
/* Job List */ /* Job List */
@@ -220,10 +245,11 @@ body {
.job-item { .job-item {
padding: 15px; padding: 15px;
border: 2px solid var(--border); background: var(--bg-input);
border-radius: 8px; border: 1px solid var(--border);
border-radius: 12px;
cursor: pointer; cursor: pointer;
transition: all 0.3s; transition: all 0.2s;
display: flex; display: flex;
align-items: center; align-items: center;
gap: 12px; gap: 12px;
@@ -231,12 +257,12 @@ body {
.job-item:hover { .job-item:hover {
border-color: var(--primary); border-color: var(--primary);
background: var(--light); transform: translateY(-2px);
} }
.job-item.active { .job-item.active {
border-color: var(--primary); border-color: var(--primary);
background: #eff6ff; background: rgba(59, 130, 246, 0.1);
} }
.job-status-icon { .job-status-icon {
@@ -247,10 +273,11 @@ body {
color: var(--dark); color: var(--dark);
font-size: 14px; font-size: 14px;
margin-bottom: 4px; margin-bottom: 4px;
font-weight: 600;
} }
.job-info p { .job-info p {
color: #6b7280; color: var(--text-muted);
font-size: 12px; font-size: 12px;
} }
@@ -272,11 +299,11 @@ body {
.detail-label { .detail-label {
font-weight: 600; font-weight: 600;
color: var(--dark); color: var(--text-muted);
} }
.detail-value { .detail-value {
color: #4b5563; color: var(--dark);
} }
.status-badge { .status-badge {
@@ -288,32 +315,43 @@ body {
} }
.status-in_progress { .status-in_progress {
background: #fef3c7; background: rgba(245, 158, 11, 0.1);
color: #92400e; color: #fbbf24;
border: 1px solid rgba(245, 158, 11, 0.2);
} }
.status-passed { .status-passed {
background: #d1fae5; background: rgba(16, 185, 129, 0.1);
color: #065f46; color: #34d399;
border: 1px solid rgba(16, 185, 129, 0.2);
} }
.status-failed { .status-failed {
background: #fee2e2; background: rgba(239, 68, 68, 0.1);
color: #991b1b; color: #f87171;
border: 1px solid rgba(239, 68, 68, 0.2);
} }
.status-aborted { .status-aborted {
background: #f3f4f6; background: rgba(148, 163, 184, 0.1);
color: #374151; color: #cbd5e1;
border: 1px solid rgba(148, 163, 184, 0.2);
}
.status-waiting {
background: rgba(245, 158, 11, 0.1);
color: #fbbf24;
border: 1px solid rgba(245, 158, 11, 0.2);
} }
/* Admin Dashboard */ /* Admin Dashboard */
.admin-container { .admin-container {
background: white; background: var(--bg-panel);
border-radius: 12px; border-radius: 16px;
padding: 30px; padding: 30px;
margin-top: 20px; margin-top: 20px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
border: 1px solid var(--border);
} }
.admin-header { .admin-header {
@@ -333,7 +371,7 @@ body {
} }
.user-table th { .user-table th {
background: var(--light); background: var(--bg-input);
padding: 12px; padding: 12px;
text-align: left; text-align: left;
font-weight: 600; font-weight: 600;
@@ -344,10 +382,11 @@ body {
.user-table td { .user-table td {
padding: 12px; padding: 12px;
border-bottom: 1px solid var(--border); border-bottom: 1px solid var(--border);
color: var(--text-muted);
} }
.user-table tr:hover { .user-table tr:hover {
background: var(--light); background: rgba(255, 255, 255, 0.02);
} }
.badge { .badge {
@@ -359,13 +398,13 @@ body {
} }
.badge-admin { .badge-admin {
background: #dbeafe; background: rgba(59, 130, 246, 0.1);
color: #1e40af; color: #60a5fa;
} }
.badge-user { .badge-user {
background: #f3f4f6; background: rgba(148, 163, 184, 0.1);
color: #374151; color: #cbd5e1;
} }
/* Modal */ /* Modal */
@@ -376,8 +415,9 @@ body {
left: 0; left: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
background: rgba(0, 0, 0, 0.5); background: rgba(0, 0, 0, 0.7);
z-index: 1000; z-index: 1000;
backdrop-filter: blur(4px);
} }
.modal.active { .modal.active {
@@ -387,11 +427,13 @@ body {
} }
.modal-content { .modal-content {
background: white; background: var(--bg-panel);
padding: 30px; padding: 30px;
border-radius: 12px; border-radius: 16px;
width: 90%; width: 90%;
max-width: 500px; max-width: 500px;
border: 1px solid var(--border);
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
} }
.modal-header { .modal-header {
@@ -410,19 +452,24 @@ body {
border: none; border: none;
font-size: 24px; font-size: 24px;
cursor: pointer; cursor: pointer;
color: #6b7280; color: var(--text-muted);
}
.close-btn:hover {
color: var(--dark);
} }
/* Submit Form */ /* Submit Form */
.submit-container { .submit-container {
background: white; background: var(--bg-panel);
border-radius: 12px; border-radius: 16px;
padding: 40px; padding: 40px;
margin-top: 20px; margin-top: 20px;
max-width: 800px; max-width: 800px;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
border: 1px solid var(--border);
} }
.step-indicator { .step-indicator {
@@ -455,29 +502,33 @@ body {
.step.active .step-number { .step.active .step-number {
background: var(--primary); background: var(--primary);
color: white; color: white;
border-color: var(--primary);
} }
.step.completed .step-number { .step.completed .step-number {
background: var(--success); background: var(--success);
color: white; color: white;
border-color: var(--success);
} }
.step-number { .step-number {
width: 30px; width: 30px;
height: 30px; height: 30px;
border-radius: 50%; border-radius: 50%;
background: var(--border); background: var(--bg-input);
color: var(--dark); border: 2px solid var(--border);
color: var(--text-muted);
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-weight: 600; font-weight: 600;
margin-bottom: 8px; margin-bottom: 8px;
transition: all 0.3s;
} }
.step-label { .step-label {
font-size: 12px; font-size: 12px;
color: #6b7280; color: var(--text-muted);
} }
.checkbox-group { .checkbox-group {
@@ -491,11 +542,13 @@ body {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 8px; gap: 8px;
color: var(--dark);
} }
.checkbox-item input[type="checkbox"] { .checkbox-item input[type="checkbox"] {
width: 18px; width: 18px;
height: 18px; height: 18px;
accent-color: var(--primary);
} }
.radio-group { .radio-group {
@@ -510,15 +563,22 @@ body {
align-items: center; align-items: center;
gap: 10px; gap: 10px;
padding: 12px; padding: 12px;
border: 2px solid var(--border); border: 1px solid var(--border);
border-radius: 8px; border-radius: 8px;
cursor: pointer; cursor: pointer;
background: var(--bg-input);
transition: all 0.2s;
} }
.radio-item:hover { .radio-item:hover {
border-color: var(--primary); border-color: var(--primary);
} }
.radio-item label {
color: var(--dark);
cursor: pointer;
}
.radio-item input[type="radio"]:checked+label { .radio-item input[type="radio"]:checked+label {
color: var(--primary); color: var(--primary);
font-weight: 600; font-weight: 600;
@@ -534,21 +594,22 @@ body {
.empty-state { .empty-state {
text-align: center; text-align: center;
padding: 60px 20px; padding: 60px 20px;
color: #6b7280; color: var(--text-muted);
} }
.empty-state h3 { .empty-state h3 {
margin-bottom: 10px; margin-bottom: 10px;
color: var(--dark);
} }
/* Context Menu */ /* Context Menu */
.context-menu { .context-menu {
display: none; display: none;
position: absolute; position: absolute;
background: white; background: var(--bg-panel);
border: 1px solid var(--border); border: 1px solid var(--border);
border-radius: 8px; border-radius: 8px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15); box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
z-index: 1000; z-index: 1000;
min-width: 150px; min-width: 150px;
} }
@@ -560,10 +621,11 @@ body {
align-items: center; align-items: center;
gap: 8px; gap: 8px;
transition: background-color 0.2s; transition: background-color 0.2s;
color: var(--dark);
} }
.context-menu-item:hover { .context-menu-item:hover {
background: var(--light); background: var(--bg-input);
} }
.context-menu-item:first-child { .context-menu-item:first-child {
@@ -587,28 +649,28 @@ body {
} }
.branch-validation.success { .branch-validation.success {
background: #d1fae5; background: rgba(16, 185, 129, 0.1);
color: #065f46; color: #34d399;
border: 1px solid #10b981; border: 1px solid rgba(16, 185, 129, 0.2);
} }
.branch-validation.error { .branch-validation.error {
background: #fee2e2; background: rgba(239, 68, 68, 0.1);
color: #991b1b; color: #f87171;
border: 1px solid #ef4444; border: 1px solid rgba(239, 68, 68, 0.2);
} }
.branch-validation.loading { .branch-validation.loading {
background: #fef3c7; background: rgba(245, 158, 11, 0.1);
color: #92400e; color: #fbbf24;
border: 1px solid #f59e0b; border: 1px solid rgba(245, 158, 11, 0.2);
} }
.loading-spinner { .loading-spinner {
display: inline-block; display: inline-block;
width: 16px; width: 16px;
height: 16px; height: 16px;
border: 2px solid #f3f3f3; border: 2px solid rgba(255, 255, 255, 0.1);
border-top: 2px solid var(--primary); border-top: 2px solid var(--primary);
border-radius: 50%; border-radius: 50%;
animation: spin 1s linear infinite; animation: spin 1s linear infinite;
@@ -626,27 +688,29 @@ body {
} }
.btn:disabled { .btn:disabled {
background: #9ca3af; background: var(--bg-input);
cursor: not-allowed; cursor: not-allowed;
opacity: 0.6; opacity: 0.6;
color: var(--text-muted);
} }
/* Scenario Tree Styles */ /* Scenario Tree Styles */
.scenario-controls { .scenario-controls {
margin: 20px 0; margin: 20px 0;
padding: 15px; padding: 15px;
background: var(--light); background: var(--bg-input);
border-radius: 8px; border-radius: 8px;
display: flex; display: flex;
align-items: center; align-items: center;
gap: 10px; gap: 10px;
border: 1px solid var(--border);
} }
.scenario-tree { .scenario-tree {
border: 1px solid var(--border); border: 1px solid var(--border);
border-radius: 8px; border-radius: 8px;
padding: 20px; padding: 20px;
background: white; background: var(--bg-panel);
margin: 20px 0; margin: 20px 0;
max-height: 500px; max-height: 500px;
overflow-y: auto; overflow-y: auto;
@@ -673,6 +737,7 @@ body {
padding: 8px 0; padding: 8px 0;
cursor: pointer; cursor: pointer;
user-select: none; user-select: none;
color: var(--dark);
} }
.tree-toggle { .tree-toggle {
@@ -707,13 +772,13 @@ body {
.stack-label { .stack-label {
font-size: 14px; font-size: 14px;
font-weight: 500; font-weight: 500;
color: #4b5563; color: var(--text-muted);
} }
.scenario-label { .scenario-label {
font-size: 13px; font-size: 13px;
font-weight: 400; font-weight: 400;
color: #6b7280; color: var(--text-muted);
} }
.tree-children { .tree-children {
@@ -726,6 +791,7 @@ body {
width: 16px; width: 16px;
height: 16px; height: 16px;
cursor: pointer; cursor: pointer;
accent-color: var(--primary);
} }
.layer-node:hover { .layer-node:hover {
@@ -768,28 +834,63 @@ input[type="checkbox"]:indeterminate::before {
#scenarioTable { #scenarioTable {
margin-top: 10px; margin-top: 10px;
font-size: 13px; font-size: 13px;
width: 100%;
border-collapse: collapse;
} }
#scenarioTable th { #scenarioTable th {
padding: 10px; padding: 10px;
background: #f8fafc; background: var(--bg-input);
color: var(--dark);
text-align: left;
border-bottom: 1px solid var(--border);
} }
#scenarioTable td { #scenarioTable td {
padding: 10px; padding: 10px;
color: var(--text-muted);
border-bottom: 1px solid var(--border);
} }
#queue-log { #queue-log {
border: 1px solid #333; border: 1px solid var(--border);
box-shadow: inset 0 2px 10px rgba(0, 0, 0, 0.5); box-shadow: inset 0 2px 10px rgba(0, 0, 0, 0.2);
background: #000;
color: #0f0;
padding: 10px;
font-family: monospace;
border-radius: 8px;
}
#scenarioSearch {
background: var(--bg-input);
border: 1px solid var(--border);
color: var(--dark);
padding: 8px 12px;
border-radius: 6px;
} }
#scenarioSearch:focus { #scenarioSearch:focus {
border-color: var(--primary); border-color: var(--primary);
box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1); box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
outline: none;
} }
.status-waiting { /* Scrollbar Styling */
background: #fef3c7; ::-webkit-scrollbar {
color: #92400e; width: 8px;
height: 8px;
}
::-webkit-scrollbar-track {
background: var(--bg-dark);
}
::-webkit-scrollbar-thumb {
background: var(--border);
border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
background: var(--text-muted);
} }

142
doc/api.md
View File

@@ -1,48 +1,130 @@
# TestArena API Reference # TestArena API Reference
TestArena provides a RESTful API for programmatic job submission and status monitoring.
## Base URL ## Base URL
`http://<server-ip>:8080/api`
All API endpoints are prefixed with `/api`.
```
http://<your-server>/api
```
## Authentication
The API uses Basic Authentication. You must provide your username and password in the request body for job submission.
## Endpoints ## Endpoints
### 1. Submit a New Queue ### 1. Submit Job
`POST /queue`
Submits a new set of tasks to the execution queue. Submit a new test job to the queue.
**Payload:**
- **URL**: `/submit_job`
- **Method**: `POST`
- **Content-Type**: `application/json`
#### Request Body
| Field | Type | Required | Description |
| :--- | :--- | :--- | :--- |
| `username` | string | Yes | Your TestArena username |
| `password` | string | Yes | Your TestArena password |
| `branch_name` | string | Yes | Git branch name to test |
| `scenarios` | array | Yes | List of scenario names to execute |
#### Example Request
```bash
curl -X POST http://localhost:5000/api/submit_job \
-H "Content-Type: application/json" \
-d '{
"username": "admin",
"password": "your_password",
"branch_name": "feature/new-driver",
"scenarios": ["adc_init_test", "gpio_init_test"]
}'
```
#### Success Response
**Code**: `200 OK`
```json ```json
{ {
"source": "branch_name", "success": true,
"job_id": [ "job_id": 123,
"environment", "status": "waiting",
{ "remote_triggered": true,
"task_id": "scenario_path" "message": "Job submitted successfully"
}
]
} }
``` ```
### 2. Get Status #### Error Response
`GET /status/{id}`
Gets the status of a specific queue or task.
### 3. Abort Queue or Task **Code**: `401 Unauthorized`
`POST /abort/{id}`
Aborts a waiting or running queue or a single task.
### 4. Delete Queue ```json
`DELETE /delete/{id}` {
Permanently deletes a queue and its associated data. "error": "Invalid credentials"
}
```
## Local API (Web App) **Code**: `400 Bad Request`
### Get Job Details ```json
`GET /jobs/{job_id}` {
"error": "Missing required fields: username, password, branch_name, scenarios"
}
```
### Get Job Status (Triggers Update) ---
`GET /jobs/{job_id}/status`
### Abort Job ### 2. Get Job Status
`POST /jobs/{job_id}/abort`
### Delete Job Retrieve the status and details of a specific job.
`POST /jobs/{job_id}/delete`
- **URL**: `/job/<job_id>`
- **Method**: `GET`
#### URL Parameters
| Parameter | Type | Required | Description |
| :--- | :--- | :--- | :--- |
| `job_id` | integer | Yes | The ID of the job to retrieve |
#### Example Request
```bash
curl http://localhost:5000/api/job/123
```
#### Success Response
**Code**: `200 OK`
```json
{
"job_id": 123,
"status": "in_progress",
"branch_name": "feature/new-driver",
"scenarios": ["adc_init_test", "gpio_init_test"],
"remote_results": {
"adc_init_test": ["PASS", "http://.../report.html"],
"gpio_init_test": ["FAIL", "http://.../report.html"]
},
"created_at": "2023-10-27T10:00:00",
"completed_at": null,
"remote_queue_id": "123"
}
```
#### Error Response
**Code**: `404 Not Found`
```json
{
"error": "Job not found"
}
```

81
doc/architecture.md
View File

@@ -1,41 +1,60 @@
# TestArena Architecture Documentation # TestArena Architecture
## Overview TestArena is a web-based platform for managing and executing automated tests on remote hardware setups. It acts as a central hub for users to submit test jobs, monitor execution, and view results.
TestArena is a web-based test management and execution platform designed to orchestrate test scenarios across different environments. It consists of a Flask-based frontend/backend that communicates with a remote execution server.
## System Components ## System Overview
### 1. Web Application (Flask) The system consists of three main layers:
- **Frontend**: Built with HTML, CSS (Vanilla), and JavaScript. Provides a dashboard for monitoring jobs, submitting new tests, and viewing logs.
- **Backend**: Flask server handling authentication, job management, and API requests.
- **Database**: PostgreSQL (in Docker) or SQLite. Managed via SQLAlchemy. Stores users and job history.
### 2. Remote Execution Server 1. **Web Frontend (Flask)**:
- Handles the actual execution of test scenarios. - Provides the user interface for job submission, dashboard monitoring, and administration.
- Exposes APIs for queueing, status polling, and aborting/deleting jobs. - Handles user authentication and input validation.
- Provides access to execution logs and results. - Exposes REST APIs for programmatic access.
## Key Workflows 2. **Backend Logic (Python/Flask)**:
- **Job Management**: Manages the lifecycle of test jobs (Waiting -> In Progress -> Passed/Failed).
- **Remote Execution**: Communicates with the remote test server via HTTP APIs to trigger queues and poll status.
- **Database**: Uses SQLite (via SQLAlchemy) to store user data, job history, and results.
### Job Submission 3. **Remote Test Server (External)**:
1. User selects a branch and validates it via SSH on the remote server. - Executes the actual test scenarios on hardware/simulators.
2. User selects test scenarios to run. - Exposes APIs for queue management (`/api/queue`, `/api/status`, `/api/abort`).
3. User reviews and submits the job. - Hosts the test results and logs.
4. The web app creates a local `Job` record and sends a POST request to the remote `/api/queue` endpoint using the local Job ID as the `remote_queue_id`.
### Status Polling ## Key Components
1. A background thread in the Flask app polls the remote server every 20 seconds for all `waiting` or `in_progress` jobs.
2. The dashboard also polls the local API every 5 seconds when a job is being viewed to provide real-time updates.
3. Tab persistence is handled in the frontend to ensure the user's view (Scenarios vs Logs) is maintained during polling.
### Job Search (Global) ### 1. Job Processing Flow
- Users can search for jobs by **Job ID** or **Username** globally.
- By default, non-admin users only see their own jobs. Searching allows them to see others' jobs if they have the ID or username.
### Job Abort/Delete 1. **Submission**: User submits a job via UI or API (`POST /api/submit_job`).
- Users can abort running jobs or delete them entirely. These actions are synchronized with the remote server using the `POST /abort/{id}` and `DELETE /delete/{id}` APIs. 2. **Validation**: System validates credentials and branch existence (via SSH).
3. **Queueing**: A local `Job` record is created. The system sends a payload to the Remote Server's `/api/queue` endpoint.
4. **Monitoring**: A background thread in the Flask app polls the Remote Server every 20 seconds.
- Checks Queue Status (`/api/status/<queue_id>`).
- Checks Task Status (`/api/status/<task_id>`).
- Updates local DB with progress and results.
5. **Completion**:
- When all tasks finish, the job is marked as `passed` or `failed`.
- **Cleanup**: An SSH command is automatically executed to clean up the remote workspace.
- **Timeout**: If a job runs > 1 hour, it is auto-aborted.
## Technology Stack ### 2. Database Schema
- **Backend**: Python, Flask, Flask-SQLAlchemy, Flask-Login, Requests.
- **Frontend**: HTML5, CSS3, JavaScript (ES6). - **Users**: `id`, `username`, `password_hash`, `is_admin`
- **Remote Communication**: REST API, SSH (for branch validation and scenario scanning). - **Jobs**: `id`, `user_id`, `branch_name`, `scenarios`, `status`, `remote_queue_id`, `remote_results`, `queue_log`
### 3. API Layer
- **`POST /api/submit_job`**: Programmatic job submission.
- **`GET /api/job/<id>`**: Status retrieval.
## Deployment
- **Containerization**: Docker & Docker Compose.
- **Web Server**: Gunicorn (WSGI) behind Caddy (Reverse Proxy/SSL).
- **Database**: SQLite (Persistent volume).
## Security
- **Authentication**: Flask-Login for UI, Basic Auth for API.
- **SSH**: Uses `sshpass` with strict host checking disabled (internal network) for remote operations.
- **Environment**: Secrets managed via `.env` file.