feat: polish #13
19 changed files with 706 additions and 23 deletions
|
|
@ -27,7 +27,11 @@ Serve `build/` from any static host. Route fallback is `index.html`.
|
||||||
- [`docs/CONVENTIONS.md`](docs/CONVENTIONS.md) — naming, styling, component patterns.
|
- [`docs/CONVENTIONS.md`](docs/CONVENTIONS.md) — naming, styling, component patterns.
|
||||||
- [`docs/ADDING_A_FEATURE.md`](docs/ADDING_A_FEATURE.md) — walkthrough for adding
|
- [`docs/ADDING_A_FEATURE.md`](docs/ADDING_A_FEATURE.md) — walkthrough for adding
|
||||||
a new panel/feature.
|
a new panel/feature.
|
||||||
|
- [`docs/TESTING.md`](docs/TESTING.md) — e2e tests against the real Django +
|
||||||
|
predictor stack.
|
||||||
- [`mocks/`](mocks/) — Vite dev-server mock backend.
|
- [`mocks/`](mocks/) — Vite dev-server mock backend.
|
||||||
|
- [`scripts/run-stack.sh`](scripts/run-stack.sh) — boot Vite + Django +
|
||||||
|
fake predictor in one command.
|
||||||
|
|
||||||
## Stack
|
## Stack
|
||||||
|
|
||||||
|
|
|
||||||
120
docs/TESTING.md
Normal file
120
docs/TESTING.md
Normal file
|
|
@ -0,0 +1,120 @@
|
||||||
|
# Testing
|
||||||
|
|
||||||
|
End-to-end tests run against the **full chain**:
|
||||||
|
|
||||||
|
```
|
||||||
|
Playwright → leaflet_svelte (Vite :5173)
|
||||||
|
│ proxies /api → :8000
|
||||||
|
▼
|
||||||
|
stratoflights Django (:8000)
|
||||||
|
│ TAWHIRI_BASE_URL → :8001
|
||||||
|
▼
|
||||||
|
fake_tawhiri stub (:8001)
|
||||||
|
```
|
||||||
|
|
||||||
|
The real production flow replaces the stub with
|
||||||
|
[tawhiri](https://fly.stratonautica.ru/api/v2/) or the Go-based
|
||||||
|
`predictor-refactored` running on `:8080`. Any service that speaks the
|
||||||
|
Tawhiri v2 query-string protocol is drop-in compatible.
|
||||||
|
|
||||||
|
## One-time setup
|
||||||
|
|
||||||
|
**Python deps for stratoflights** (uses sqlite via `DJANGO_ENV=production` to
|
||||||
|
avoid needing Postgres):
|
||||||
|
|
||||||
|
```bash
|
||||||
|
pip install --user --break-system-packages \
|
||||||
|
Django djangorestframework djangorestframework-simplejwt drf-spectacular \
|
||||||
|
requests django-cors-headers Pillow python-dotenv channels daphne
|
||||||
|
```
|
||||||
|
|
||||||
|
**Initialize the Django DB** (sqlite at `stratoflights/db.sqlite3`):
|
||||||
|
|
||||||
|
```bash
|
||||||
|
cd /home/anton/stratoflights
|
||||||
|
DJANGO_ENV=production python3 manage.py migrate
|
||||||
|
DJANGO_ENV=production \
|
||||||
|
DJANGO_SUPERUSER_USERNAME=demo \
|
||||||
|
DJANGO_SUPERUSER_PASSWORD=demo \
|
||||||
|
DJANGO_SUPERUSER_EMAIL=demo@demo.demo \
|
||||||
|
python3 manage.py createsuperuser --noinput
|
||||||
|
```
|
||||||
|
|
||||||
|
**Playwright browsers** (first time only):
|
||||||
|
|
||||||
|
```bash
|
||||||
|
cd /home/anton/leaflet_svelte
|
||||||
|
npx playwright install chromium
|
||||||
|
```
|
||||||
|
|
||||||
|
## Running tests
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Start the full stack (Vite, Django, fake predictor).
|
||||||
|
scripts/run-stack.sh
|
||||||
|
|
||||||
|
# Run the Playwright suite.
|
||||||
|
npm run test:e2e
|
||||||
|
|
||||||
|
# Tear down.
|
||||||
|
scripts/stop-stack.sh
|
||||||
|
```
|
||||||
|
|
||||||
|
Individual files: `npm run test:e2e -- tests/e2e/workspaces.spec.ts`.
|
||||||
|
UI mode for debugging: `npm run test:e2e:ui`.
|
||||||
|
|
||||||
|
## Test organization
|
||||||
|
|
||||||
|
| File | Covers |
|
||||||
|
|------|--------|
|
||||||
|
| `auth.spec.ts` | Anonymous → login redirect, form login, already-authed visits |
|
||||||
|
| `smoke.spec.ts` | Page loads, MapLibre canvas mounts, navbar renders |
|
||||||
|
| `workspaces.spec.ts` | Auto-create, add/remove, prediction render pipeline |
|
||||||
|
| `settings.spec.ts` | Locale switch updates UI text live |
|
||||||
|
| `saved-points.spec.ts` | Point editor modal opens |
|
||||||
|
|
||||||
|
Fixtures (`tests/e2e/fixtures.ts`) provide `login(context)` / `logout(context)`
|
||||||
|
helpers that go through `page.context().request` so cookies are shared with
|
||||||
|
the page.
|
||||||
|
|
||||||
|
## Key gotchas
|
||||||
|
|
||||||
|
- **Django CSRF is origin-aware.** If Playwright hits `127.0.0.1:5173` but
|
||||||
|
`CSRF_TRUSTED_ORIGINS` only lists `localhost:5173`, every POST returns 403
|
||||||
|
with `{"detail": "CSRF Failed: Origin checking failed"}`. `run-stack.sh`
|
||||||
|
adds both hostnames to `CSRF_TRUSTED_ORIGINS`.
|
||||||
|
- **Test parallelism is disabled** (`fullyParallel: false`, `workers: 1`)
|
||||||
|
because fixtures share the Django sqlite DB. If we ever want parallel
|
||||||
|
workers we need per-worker DBs.
|
||||||
|
- **The fake tawhiri never fails.** To test the frontend's error path you
|
||||||
|
need to either stop the fake or point `TAWHIRI_BASE_URL` at an unreachable
|
||||||
|
host.
|
||||||
|
- **`window._lsvMap`** is only set in dev builds (`import.meta.env.DEV`), so
|
||||||
|
the workspace render test won't see the layer names in a production bundle.
|
||||||
|
|
||||||
|
## Swapping in the Go predictor
|
||||||
|
|
||||||
|
`fake_tawhiri.py` is an expedient stub. To swap in the real Go predictor:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
cd /home/anton/predictor-refactor/predictor-refactored
|
||||||
|
PREDICTOR_DATA_DIR=/tmp/predictor-data go run ./cmd/api &
|
||||||
|
# ^ first run downloads ~9 GB of GFS GRIB data; takes 30–60 minutes.
|
||||||
|
|
||||||
|
# Then restart stratoflights with TAWHIRI_BASE_URL pointing at it:
|
||||||
|
cd /home/anton/stratoflights
|
||||||
|
TAWHIRI_BASE_URL=http://127.0.0.1:8080/api/v1/ python3 manage.py runserver
|
||||||
|
```
|
||||||
|
|
||||||
|
## Patched files in stratoflights
|
||||||
|
|
||||||
|
To make this stack work we made one tiny change in stratoflights so the
|
||||||
|
predictor endpoint is configurable:
|
||||||
|
|
||||||
|
```python
|
||||||
|
# stratoflights_api/services/tawhiri.py
|
||||||
|
class TawhiriClient:
|
||||||
|
BASE_URL = os.getenv("TAWHIRI_BASE_URL", "https://fly.stratonautica.ru/api/v2/")
|
||||||
|
```
|
||||||
|
|
||||||
|
This is backwards-compatible — the default keeps the existing behavior.
|
||||||
79
package-lock.json
generated
79
package-lock.json
generated
|
|
@ -10,7 +10,6 @@
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@sakitam-gis/maplibre-wind": "^2.0.3",
|
"@sakitam-gis/maplibre-wind": "^2.0.3",
|
||||||
"@sveltestrap/sveltestrap": "^7.1.0",
|
"@sveltestrap/sveltestrap": "^7.1.0",
|
||||||
"bootstrap": "^5.3.8",
|
|
||||||
"bootstrap-icons": "^1.13.1",
|
"bootstrap-icons": "^1.13.1",
|
||||||
"chart.js": "^4.5.0",
|
"chart.js": "^4.5.0",
|
||||||
"chartjs-adapter-luxon": "^1.3.1",
|
"chartjs-adapter-luxon": "^1.3.1",
|
||||||
|
|
@ -21,6 +20,7 @@
|
||||||
"svelte5-chartjs": "^1.0.0"
|
"svelte5-chartjs": "^1.0.0"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
"@playwright/test": "^1.59.1",
|
||||||
"@sveltejs/adapter-static": "^3.0.10",
|
"@sveltejs/adapter-static": "^3.0.10",
|
||||||
"@sveltejs/kit": "^2.16.0",
|
"@sveltejs/kit": "^2.16.0",
|
||||||
"@sveltejs/vite-plugin-svelte": "^5.0.0",
|
"@sveltejs/vite-plugin-svelte": "^5.0.0",
|
||||||
|
|
@ -568,6 +568,21 @@
|
||||||
"resolved": "https://registry.npmjs.org/quickselect/-/quickselect-2.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/quickselect/-/quickselect-2.0.0.tgz",
|
||||||
"integrity": "sha512-RKJ22hX8mHe3Y6wH/N3wCM6BWtjaxIyyUIkpHOvfFnxdI4yD4tBXEBKSbriGujF6jnSVkJrffuo6vxACiSSxIw=="
|
"integrity": "sha512-RKJ22hX8mHe3Y6wH/N3wCM6BWtjaxIyyUIkpHOvfFnxdI4yD4tBXEBKSbriGujF6jnSVkJrffuo6vxACiSSxIw=="
|
||||||
},
|
},
|
||||||
|
"node_modules/@playwright/test": {
|
||||||
|
"version": "1.59.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.59.1.tgz",
|
||||||
|
"integrity": "sha512-PG6q63nQg5c9rIi4/Z5lR5IVF7yU5MqmKaPOe0HSc0O2cX1fPi96sUQu5j7eo4gKCkB2AnNGoWt7y4/Xx3Kcqg==",
|
||||||
|
"dev": true,
|
||||||
|
"dependencies": {
|
||||||
|
"playwright": "1.59.1"
|
||||||
|
},
|
||||||
|
"bin": {
|
||||||
|
"playwright": "cli.js"
|
||||||
|
},
|
||||||
|
"engines": {
|
||||||
|
"node": ">=18"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/@polka/url": {
|
"node_modules/@polka/url": {
|
||||||
"version": "1.0.0-next.28",
|
"version": "1.0.0-next.28",
|
||||||
"resolved": "https://registry.npmjs.org/@polka/url/-/url-1.0.0-next.28.tgz",
|
"resolved": "https://registry.npmjs.org/@polka/url/-/url-1.0.0-next.28.tgz",
|
||||||
|
|
@ -1085,24 +1100,6 @@
|
||||||
"node": ">= 0.4"
|
"node": ">= 0.4"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/bootstrap": {
|
|
||||||
"version": "5.3.8",
|
|
||||||
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.3.8.tgz",
|
|
||||||
"integrity": "sha512-HP1SZDqaLDPwsNiqRqi5NcP0SSXciX2s9E+RyqJIIqGo+vJeN5AJVM98CXmW/Wux0nQ5L7jeWUdplCEf0Ee+tg==",
|
|
||||||
"funding": [
|
|
||||||
{
|
|
||||||
"type": "github",
|
|
||||||
"url": "https://github.com/sponsors/twbs"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"type": "opencollective",
|
|
||||||
"url": "https://opencollective.com/bootstrap"
|
|
||||||
}
|
|
||||||
],
|
|
||||||
"peerDependencies": {
|
|
||||||
"@popperjs/core": "^2.11.8"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/bootstrap-icons": {
|
"node_modules/bootstrap-icons": {
|
||||||
"version": "1.13.1",
|
"version": "1.13.1",
|
||||||
"resolved": "https://registry.npmjs.org/bootstrap-icons/-/bootstrap-icons-1.13.1.tgz",
|
"resolved": "https://registry.npmjs.org/bootstrap-icons/-/bootstrap-icons-1.13.1.tgz",
|
||||||
|
|
@ -1596,6 +1593,50 @@
|
||||||
"url": "https://github.com/sponsors/jonschlinkert"
|
"url": "https://github.com/sponsors/jonschlinkert"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/playwright": {
|
||||||
|
"version": "1.59.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/playwright/-/playwright-1.59.1.tgz",
|
||||||
|
"integrity": "sha512-C8oWjPR3F81yljW9o5OxcWzfh6avkVwDD2VYdwIGqTkl+OGFISgypqzfu7dOe4QNLL2aqcWBmI3PMtLIK233lw==",
|
||||||
|
"dev": true,
|
||||||
|
"dependencies": {
|
||||||
|
"playwright-core": "1.59.1"
|
||||||
|
},
|
||||||
|
"bin": {
|
||||||
|
"playwright": "cli.js"
|
||||||
|
},
|
||||||
|
"engines": {
|
||||||
|
"node": ">=18"
|
||||||
|
},
|
||||||
|
"optionalDependencies": {
|
||||||
|
"fsevents": "2.3.2"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/playwright-core": {
|
||||||
|
"version": "1.59.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.59.1.tgz",
|
||||||
|
"integrity": "sha512-HBV/RJg81z5BiiZ9yPzIiClYV/QMsDCKUyogwH9p3MCP6IYjUFu/MActgYAvK0oWyV9NlwM3GLBjADyWgydVyg==",
|
||||||
|
"dev": true,
|
||||||
|
"bin": {
|
||||||
|
"playwright-core": "cli.js"
|
||||||
|
},
|
||||||
|
"engines": {
|
||||||
|
"node": ">=18"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/playwright/node_modules/fsevents": {
|
||||||
|
"version": "2.3.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
|
||||||
|
"integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
|
||||||
|
"dev": true,
|
||||||
|
"hasInstallScript": true,
|
||||||
|
"optional": true,
|
||||||
|
"os": [
|
||||||
|
"darwin"
|
||||||
|
],
|
||||||
|
"engines": {
|
||||||
|
"node": "^8.16.0 || ^10.6.0 || >=11.0.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/postcss": {
|
"node_modules/postcss": {
|
||||||
"version": "8.5.3",
|
"version": "8.5.3",
|
||||||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.3.tgz",
|
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.3.tgz",
|
||||||
|
|
|
||||||
|
|
@ -9,9 +9,13 @@
|
||||||
"preview": "vite preview",
|
"preview": "vite preview",
|
||||||
"prepare": "svelte-kit sync || echo ''",
|
"prepare": "svelte-kit sync || echo ''",
|
||||||
"check": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json",
|
"check": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json",
|
||||||
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json --watch"
|
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json --watch",
|
||||||
|
"test:e2e": "playwright test",
|
||||||
|
"test:e2e:headed": "playwright test --headed",
|
||||||
|
"test:e2e:ui": "playwright test --ui"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
"@playwright/test": "^1.59.1",
|
||||||
"@sveltejs/adapter-static": "^3.0.10",
|
"@sveltejs/adapter-static": "^3.0.10",
|
||||||
"@sveltejs/kit": "^2.16.0",
|
"@sveltejs/kit": "^2.16.0",
|
||||||
"@sveltejs/vite-plugin-svelte": "^5.0.0",
|
"@sveltejs/vite-plugin-svelte": "^5.0.0",
|
||||||
|
|
@ -26,7 +30,6 @@
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@sakitam-gis/maplibre-wind": "^2.0.3",
|
"@sakitam-gis/maplibre-wind": "^2.0.3",
|
||||||
"@sveltestrap/sveltestrap": "^7.1.0",
|
"@sveltestrap/sveltestrap": "^7.1.0",
|
||||||
"bootstrap": "^5.3.8",
|
|
||||||
"bootstrap-icons": "^1.13.1",
|
"bootstrap-icons": "^1.13.1",
|
||||||
"chart.js": "^4.5.0",
|
"chart.js": "^4.5.0",
|
||||||
"chartjs-adapter-luxon": "^1.3.1",
|
"chartjs-adapter-luxon": "^1.3.1",
|
||||||
|
|
|
||||||
48
playwright.config.ts
Normal file
48
playwright.config.ts
Normal file
|
|
@ -0,0 +1,48 @@
|
||||||
|
import { defineConfig, devices } from '@playwright/test';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Playwright configuration.
|
||||||
|
*
|
||||||
|
* Tests run against the Vite dev server with the mock API enabled, so they
|
||||||
|
* don't require Django to be running. Each test gets an isolated user session
|
||||||
|
* via the `storageState` reset in globalSetup (implicit: every test starts
|
||||||
|
* with a blank context).
|
||||||
|
*
|
||||||
|
* Run:
|
||||||
|
* npx playwright install chromium # first time only — installs browsers
|
||||||
|
* npm run test:e2e # headless
|
||||||
|
* npm run test:e2e:headed # opens a browser
|
||||||
|
* npm run test:e2e:ui # Playwright UI mode
|
||||||
|
*/
|
||||||
|
export default defineConfig({
|
||||||
|
testDir: './tests/e2e',
|
||||||
|
timeout: 30_000,
|
||||||
|
expect: { timeout: 5_000 },
|
||||||
|
fullyParallel: false, // the mock plugin writes to shared JSON files on disk
|
||||||
|
workers: 1,
|
||||||
|
forbidOnly: !!process.env.CI,
|
||||||
|
retries: process.env.CI ? 1 : 0,
|
||||||
|
reporter: [['list'], ['html', { open: 'never' }]],
|
||||||
|
use: {
|
||||||
|
baseURL: 'http://127.0.0.1:5173',
|
||||||
|
trace: 'retain-on-failure',
|
||||||
|
video: 'retain-on-failure',
|
||||||
|
screenshot: 'only-on-failure',
|
||||||
|
},
|
||||||
|
projects: [
|
||||||
|
{
|
||||||
|
name: 'chromium',
|
||||||
|
use: { ...devices['Desktop Chrome'] },
|
||||||
|
},
|
||||||
|
],
|
||||||
|
webServer: {
|
||||||
|
command: 'npm run dev -- --port 5173 --strictPort',
|
||||||
|
url: 'http://127.0.0.1:5173',
|
||||||
|
reuseExistingServer: !process.env.CI,
|
||||||
|
timeout: 60_000,
|
||||||
|
env: {
|
||||||
|
VITE_USE_MOCK_API: 'true',
|
||||||
|
VITE_API_BASE_URL: '/api',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
||||||
1
resume
Normal file
1
resume
Normal file
|
|
@ -0,0 +1 @@
|
||||||
|
claude --resume 0ed44ce1-31ba-4b4e-b975-387a4b2ae13d
|
||||||
68
scripts/run-stack.sh
Executable file
68
scripts/run-stack.sh
Executable file
|
|
@ -0,0 +1,68 @@
|
||||||
|
#!/usr/bin/env bash
|
||||||
|
# Boot the full leaflet_svelte ↔ stratoflights ↔ predictor test stack.
|
||||||
|
#
|
||||||
|
# Processes started (background):
|
||||||
|
# - fake_tawhiri (Python http.server, :8001) — synthesizes prediction responses
|
||||||
|
# - stratoflights Django (runserver, :8000) — API backend, talks to fake_tawhiri
|
||||||
|
# - leaflet_svelte Vite dev server (:5173) — proxies /api to Django
|
||||||
|
#
|
||||||
|
# After this, run tests with:
|
||||||
|
# npm run test:e2e
|
||||||
|
#
|
||||||
|
# Stop everything with:
|
||||||
|
# scripts/stop-stack.sh
|
||||||
|
#
|
||||||
|
# Requirements (once):
|
||||||
|
# - Python deps: pip install --user --break-system-packages Django djangorestframework \
|
||||||
|
# djangorestframework-simplejwt drf-spectacular requests django-cors-headers \
|
||||||
|
# Pillow python-dotenv channels daphne
|
||||||
|
# - `demo` user in Django with password `demo`:
|
||||||
|
# DJANGO_ENV=production python3 manage.py createsuperuser (--noinput with env)
|
||||||
|
set -euo pipefail
|
||||||
|
|
||||||
|
FRONTEND_DIR=/home/anton/leaflet_svelte
|
||||||
|
BACKEND_DIR=/home/anton/stratoflights
|
||||||
|
PID_DIR=/tmp/lsv-stack
|
||||||
|
mkdir -p "$PID_DIR"
|
||||||
|
|
||||||
|
# --- fake_tawhiri ----------------------------------------------------------------
|
||||||
|
if ! ss -tlnp 2>/dev/null | grep -q ':8001'; then
|
||||||
|
echo "starting fake_tawhiri on :8001"
|
||||||
|
python3 "$FRONTEND_DIR/tests/e2e/fake_tawhiri.py" > /tmp/fake-tawhiri.log 2>&1 &
|
||||||
|
echo $! > "$PID_DIR/fake-tawhiri.pid"
|
||||||
|
fi
|
||||||
|
|
||||||
|
# --- stratoflights Django --------------------------------------------------------
|
||||||
|
if ! ss -tlnp 2>/dev/null | grep -q ':8000'; then
|
||||||
|
echo "starting stratoflights on :8000"
|
||||||
|
cd "$BACKEND_DIR"
|
||||||
|
DJANGO_ENV=production \
|
||||||
|
DEBUG=True \
|
||||||
|
ALLOWED_HOSTS=localhost,127.0.0.1 \
|
||||||
|
CSRF_TRUSTED_ORIGINS="http://localhost:5173,http://localhost:8000,http://127.0.0.1:5173,http://127.0.0.1:8000" \
|
||||||
|
TAWHIRI_BASE_URL=http://127.0.0.1:8001/api/v2/ \
|
||||||
|
python3 manage.py runserver 0.0.0.0:8000 > /tmp/django.log 2>&1 &
|
||||||
|
echo $! > "$PID_DIR/django.pid"
|
||||||
|
sleep 3
|
||||||
|
fi
|
||||||
|
|
||||||
|
# --- leaflet_svelte --------------------------------------------------------------
|
||||||
|
if ! ss -tlnp 2>/dev/null | grep -q ':5173'; then
|
||||||
|
echo "starting Vite on :5173"
|
||||||
|
cd "$FRONTEND_DIR"
|
||||||
|
VITE_USE_MOCK_API=false \
|
||||||
|
VITE_API_BASE_URL=/api \
|
||||||
|
VITE_API_PROXY_TARGET=http://localhost:8000 \
|
||||||
|
npm run dev -- --port 5173 --strictPort > /tmp/vite-dev.log 2>&1 &
|
||||||
|
echo $! > "$PID_DIR/vite.pid"
|
||||||
|
sleep 3
|
||||||
|
fi
|
||||||
|
|
||||||
|
echo "--- stack ready ---"
|
||||||
|
echo " fake_tawhiri: http://127.0.0.1:8001/api/v2/"
|
||||||
|
echo " stratoflights: http://localhost:8000/api/"
|
||||||
|
echo " leaflet_svelte: http://localhost:5173/"
|
||||||
|
echo
|
||||||
|
echo "logs: /tmp/fake-tawhiri.log, /tmp/django.log, /tmp/vite-dev.log"
|
||||||
|
echo "run e2e: (cd $FRONTEND_DIR && npm run test:e2e)"
|
||||||
|
echo "stop: $FRONTEND_DIR/scripts/stop-stack.sh"
|
||||||
21
scripts/stop-stack.sh
Executable file
21
scripts/stop-stack.sh
Executable file
|
|
@ -0,0 +1,21 @@
|
||||||
|
#!/usr/bin/env bash
|
||||||
|
# Stop everything started by run-stack.sh.
|
||||||
|
set -u
|
||||||
|
|
||||||
|
PID_DIR=/tmp/lsv-stack
|
||||||
|
|
||||||
|
for name in fake-tawhiri django vite; do
|
||||||
|
pidfile="$PID_DIR/$name.pid"
|
||||||
|
if [[ -f "$pidfile" ]]; then
|
||||||
|
pid=$(cat "$pidfile")
|
||||||
|
if kill "$pid" 2>/dev/null; then
|
||||||
|
echo "stopped $name (pid $pid)"
|
||||||
|
fi
|
||||||
|
rm -f "$pidfile"
|
||||||
|
fi
|
||||||
|
done
|
||||||
|
|
||||||
|
# Belt-and-suspenders: free ports if anything slipped through.
|
||||||
|
for port in 5173 8000 8001; do
|
||||||
|
fuser -k "$port/tcp" 2>/dev/null && echo "freed :$port" || true
|
||||||
|
done
|
||||||
|
|
@ -1,4 +1,8 @@
|
||||||
@import 'bootstrap/dist/css/bootstrap.min.css';
|
/* Custom YKS brand-themed Bootstrap 5.2.3 is served from /css/bootstrap.min.css
|
||||||
|
* (see static/css/bootstrap.min.css). It carries the brand palette
|
||||||
|
* (--bs-primary: #457aab, etc.) that stock Bootstrap doesn't.
|
||||||
|
*/
|
||||||
|
@import '/css/bootstrap.min.css';
|
||||||
@import 'bootstrap-icons/font/bootstrap-icons.css';
|
@import 'bootstrap-icons/font/bootstrap-icons.css';
|
||||||
|
|
||||||
/*
|
/*
|
||||||
|
|
|
||||||
|
|
@ -51,7 +51,15 @@
|
||||||
});
|
});
|
||||||
map.ready.then(() => {
|
map.ready.then(() => {
|
||||||
ready = true;
|
ready = true;
|
||||||
if (map) onReady?.(map);
|
if (map) {
|
||||||
|
onReady?.(map);
|
||||||
|
if (import.meta.env.DEV) {
|
||||||
|
// Debug handle for e2e tests and console inspection. Only exposed
|
||||||
|
// in dev builds; trimmed from production bundles.
|
||||||
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||||
|
(window as any)._lsvMap = map.getRawInstance();
|
||||||
|
}
|
||||||
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
||||||
7
static/css/bootstrap.min.css
vendored
Normal file
7
static/css/bootstrap.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
4
test-results/.last-run.json
Normal file
4
test-results/.last-run.json
Normal file
|
|
@ -0,0 +1,4 @@
|
||||||
|
{
|
||||||
|
"status": "passed",
|
||||||
|
"failedTests": []
|
||||||
|
}
|
||||||
27
tests/e2e/auth.spec.ts
Normal file
27
tests/e2e/auth.spec.ts
Normal file
|
|
@ -0,0 +1,27 @@
|
||||||
|
import { test, expect, login, logout } from './fixtures';
|
||||||
|
|
||||||
|
test('anonymous users are redirected to /login from /predict', async ({ page, context }) => {
|
||||||
|
await logout(context);
|
||||||
|
await page.goto('/predict');
|
||||||
|
await page.waitForURL('**/login', { timeout: 10_000 });
|
||||||
|
await expect(page.getByRole('heading', { level: 5 }).first()).toContainText(
|
||||||
|
/Вход|Sign in/,
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('submitting the login form authenticates and redirects', async ({ page, context }) => {
|
||||||
|
await logout(context);
|
||||||
|
await page.goto('/login');
|
||||||
|
|
||||||
|
await page.getByLabel(/Имя пользователя|Username/).fill('demo');
|
||||||
|
await page.getByLabel(/Пароль|Password/).fill('demo');
|
||||||
|
await page.getByRole('button', { name: /^(Войти|Sign in)$/ }).click();
|
||||||
|
|
||||||
|
await page.waitForURL('**/predict', { timeout: 15_000 });
|
||||||
|
});
|
||||||
|
|
||||||
|
test('already-authenticated visit to / lands on /predict', async ({ page, context }) => {
|
||||||
|
await login(context);
|
||||||
|
await page.goto('/');
|
||||||
|
await page.waitForURL('**/predict', { timeout: 15_000 });
|
||||||
|
});
|
||||||
104
tests/e2e/fake_tawhiri.py
Normal file
104
tests/e2e/fake_tawhiri.py
Normal file
|
|
@ -0,0 +1,104 @@
|
||||||
|
"""
|
||||||
|
Tiny stand-in for the Tawhiri prediction service. Responds to Tawhiri v2's
|
||||||
|
GET query-string endpoint with a synthetic trajectory so stratoflights has
|
||||||
|
something to forward back to leaflet_svelte during e2e tests.
|
||||||
|
|
||||||
|
Start:
|
||||||
|
python3 /tmp/fake_tawhiri.py
|
||||||
|
|
||||||
|
Then tell stratoflights to use it:
|
||||||
|
TAWHIRI_BASE_URL=http://localhost:8001/api/v2/ ... python3 manage.py runserver
|
||||||
|
"""
|
||||||
|
from http.server import BaseHTTPRequestHandler, HTTPServer
|
||||||
|
from urllib.parse import parse_qs, urlparse
|
||||||
|
from datetime import datetime, timedelta, timezone
|
||||||
|
import json
|
||||||
|
|
||||||
|
|
||||||
|
def _iso(dt: datetime) -> str:
|
||||||
|
return dt.isoformat().replace("+00:00", "Z")
|
||||||
|
|
||||||
|
|
||||||
|
def build_prediction(params):
|
||||||
|
try:
|
||||||
|
launch_dt = datetime.fromisoformat(
|
||||||
|
params.get("launch_datetime", "2026-05-01T12:00:00Z").replace("Z", "+00:00"),
|
||||||
|
)
|
||||||
|
except Exception:
|
||||||
|
launch_dt = datetime.now(timezone.utc)
|
||||||
|
|
||||||
|
launch_lat = float(params.get("launch_latitude", 62.0))
|
||||||
|
launch_lng = float(params.get("launch_longitude", 129.0))
|
||||||
|
launch_alt = float(params.get("launch_altitude", 0.0))
|
||||||
|
burst_alt = float(params.get("burst_altitude", 30000.0))
|
||||||
|
ascent_rate = float(params.get("ascent_rate", 5.0))
|
||||||
|
descent_rate = float(params.get("descent_rate", 5.0))
|
||||||
|
|
||||||
|
ascent_duration_s = int((burst_alt - launch_alt) / max(0.1, ascent_rate))
|
||||||
|
descent_duration_s = int(burst_alt / max(0.1, descent_rate))
|
||||||
|
step = 30
|
||||||
|
|
||||||
|
ascent = []
|
||||||
|
for t in range(0, ascent_duration_s + 1, step):
|
||||||
|
ascent.append({
|
||||||
|
"altitude": launch_alt + t * ascent_rate,
|
||||||
|
"datetime": _iso(launch_dt + timedelta(seconds=t)),
|
||||||
|
"latitude": launch_lat + t * 0.00002,
|
||||||
|
"longitude": launch_lng + t * 0.00005,
|
||||||
|
})
|
||||||
|
|
||||||
|
descent = []
|
||||||
|
burst_dt = launch_dt + timedelta(seconds=ascent_duration_s)
|
||||||
|
burst_lat = launch_lat + ascent_duration_s * 0.00002
|
||||||
|
burst_lng = launch_lng + ascent_duration_s * 0.00005
|
||||||
|
for t in range(0, descent_duration_s + 1, step):
|
||||||
|
alt = max(0.0, burst_alt - t * descent_rate)
|
||||||
|
descent.append({
|
||||||
|
"altitude": alt,
|
||||||
|
"datetime": _iso(burst_dt + timedelta(seconds=t)),
|
||||||
|
"latitude": burst_lat + t * 0.00001,
|
||||||
|
"longitude": burst_lng + t * 0.00003,
|
||||||
|
})
|
||||||
|
|
||||||
|
return {
|
||||||
|
"metadata": {
|
||||||
|
"start_datetime": _iso(launch_dt - timedelta(hours=1)),
|
||||||
|
"complete_datetime": _iso(burst_dt + timedelta(seconds=descent_duration_s)),
|
||||||
|
},
|
||||||
|
"prediction": [
|
||||||
|
{"stage": "ascent", "trajectory": ascent},
|
||||||
|
{"stage": "descent", "trajectory": descent},
|
||||||
|
],
|
||||||
|
"request": {
|
||||||
|
"dataset": "fake",
|
||||||
|
"launch_latitude": launch_lat,
|
||||||
|
"launch_longitude": launch_lng,
|
||||||
|
"launch_altitude": launch_alt,
|
||||||
|
},
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
class Handler(BaseHTTPRequestHandler):
|
||||||
|
def do_GET(self):
|
||||||
|
parsed = urlparse(self.path)
|
||||||
|
if not parsed.path.rstrip("/").endswith("/api/v2"):
|
||||||
|
self.send_error(404)
|
||||||
|
return
|
||||||
|
params = {k: v[0] for k, v in parse_qs(parsed.query).items()}
|
||||||
|
body = json.dumps(build_prediction(params)).encode()
|
||||||
|
self.send_response(200)
|
||||||
|
self.send_header("Content-Type", "application/json")
|
||||||
|
self.send_header("Access-Control-Allow-Origin", "*")
|
||||||
|
self.end_headers()
|
||||||
|
self.wfile.write(body)
|
||||||
|
|
||||||
|
def log_message(self, format, *args):
|
||||||
|
# Quiet default access log; keep stderr clean.
|
||||||
|
pass
|
||||||
|
|
||||||
|
|
||||||
|
if __name__ == "__main__":
|
||||||
|
port = 8001
|
||||||
|
server = HTTPServer(("127.0.0.1", port), Handler)
|
||||||
|
print(f"fake-tawhiri listening on http://127.0.0.1:{port}/api/v2/")
|
||||||
|
server.serve_forever()
|
||||||
74
tests/e2e/fixtures.ts
Normal file
74
tests/e2e/fixtures.ts
Normal file
|
|
@ -0,0 +1,74 @@
|
||||||
|
import {
|
||||||
|
test as base,
|
||||||
|
expect,
|
||||||
|
type Page,
|
||||||
|
type BrowserContext,
|
||||||
|
} from '@playwright/test';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Shared fixtures and helpers.
|
||||||
|
*
|
||||||
|
* Works against either the mock plugin (VITE_USE_MOCK_API=true) or the real
|
||||||
|
* Django backend (stratoflights). Mock accepts any credentials; Django
|
||||||
|
* expects demo/demo and enforces CSRF.
|
||||||
|
*
|
||||||
|
* The `TEST_USERNAME` / `TEST_PASSWORD` envs let CI override the default.
|
||||||
|
*
|
||||||
|
* Critical detail: login/logout must go through `page.context().request` so
|
||||||
|
* cookies are shared between API calls and the page. Using the plain
|
||||||
|
* `request` fixture gives you a separate cookie jar.
|
||||||
|
*/
|
||||||
|
|
||||||
|
const USERNAME = process.env.TEST_USERNAME ?? 'demo';
|
||||||
|
const PASSWORD = process.env.TEST_PASSWORD ?? 'demo';
|
||||||
|
|
||||||
|
export async function login(context: BrowserContext): Promise<void> {
|
||||||
|
const request = context.request;
|
||||||
|
await request.get('/api/csrf/');
|
||||||
|
const state = await context.storageState();
|
||||||
|
const csrf = state.cookies.find((c) => c.name === 'csrftoken')?.value ?? '';
|
||||||
|
const res = await request.post('/api/login/', {
|
||||||
|
data: { username: USERNAME, password: PASSWORD },
|
||||||
|
headers: { 'X-CSRFToken': csrf, 'Content-Type': 'application/json' },
|
||||||
|
});
|
||||||
|
if (!res.ok()) {
|
||||||
|
throw new Error(
|
||||||
|
`Login failed: ${res.status()} ${await res.text()}. Is stratoflights running on :8000 with a user "${USERNAME}" / "${PASSWORD}"?`,
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function logout(context: BrowserContext): Promise<void> {
|
||||||
|
const state = await context.storageState();
|
||||||
|
const csrf = state.cookies.find((c) => c.name === 'csrftoken')?.value ?? '';
|
||||||
|
await context.request.post('/api/logout/', {
|
||||||
|
headers: { 'X-CSRFToken': csrf, 'Content-Type': 'application/json' },
|
||||||
|
});
|
||||||
|
// Clear cookies so the page navigator is fully anonymous next goto.
|
||||||
|
await context.clearCookies();
|
||||||
|
}
|
||||||
|
|
||||||
|
export const test = base.extend({
|
||||||
|
page: async ({ page }, use) => {
|
||||||
|
const hardErrors: string[] = [];
|
||||||
|
page.on('pageerror', (e) => hardErrors.push(`[pageerror] ${e.message}`));
|
||||||
|
page.on('console', (msg) => {
|
||||||
|
if (msg.type() === 'error') {
|
||||||
|
// eslint-disable-next-line no-console
|
||||||
|
console.log(' [page console.error]', msg.text());
|
||||||
|
}
|
||||||
|
});
|
||||||
|
await use(page);
|
||||||
|
if (hardErrors.length > 0) throw new Error('Page errors:\n' + hardErrors.join('\n'));
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
export { expect };
|
||||||
|
|
||||||
|
export async function openPredict(page: Page) {
|
||||||
|
await page.goto('/predict');
|
||||||
|
await page
|
||||||
|
.locator('.map-container canvas')
|
||||||
|
.first()
|
||||||
|
.waitFor({ state: 'attached', timeout: 15_000 });
|
||||||
|
}
|
||||||
26
tests/e2e/saved-points.spec.ts
Normal file
26
tests/e2e/saved-points.spec.ts
Normal file
|
|
@ -0,0 +1,26 @@
|
||||||
|
import { test, expect, openPredict, login } from './fixtures';
|
||||||
|
|
||||||
|
test.beforeEach(async ({ context, page }) => {
|
||||||
|
await login(context);
|
||||||
|
await page.goto('/');
|
||||||
|
await page.evaluate(() => localStorage.removeItem('workspaces'));
|
||||||
|
});
|
||||||
|
|
||||||
|
test('can open the points library from the conditions panel', async ({ page }) => {
|
||||||
|
await openPredict(page);
|
||||||
|
|
||||||
|
await page
|
||||||
|
.locator('.panel-container-left')
|
||||||
|
.getByRole('button', { name: /Условия|Conditions/ })
|
||||||
|
.first()
|
||||||
|
.click();
|
||||||
|
|
||||||
|
const openBookBtn = page
|
||||||
|
.locator('.panel-container-left')
|
||||||
|
.getByRole('button')
|
||||||
|
.filter({ has: page.locator('i.bi-journal-bookmark-fill') })
|
||||||
|
.first();
|
||||||
|
await openBookBtn.click();
|
||||||
|
|
||||||
|
await expect(page.getByRole('dialog')).toBeVisible();
|
||||||
|
});
|
||||||
24
tests/e2e/settings.spec.ts
Normal file
24
tests/e2e/settings.spec.ts
Normal file
|
|
@ -0,0 +1,24 @@
|
||||||
|
import { test, expect, openPredict, login } from './fixtures';
|
||||||
|
|
||||||
|
test.beforeEach(async ({ context }) => {
|
||||||
|
await login(context);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('switching locale to English updates UI text', async ({ page }) => {
|
||||||
|
await openPredict(page);
|
||||||
|
|
||||||
|
await page
|
||||||
|
.locator('.panel-container-right')
|
||||||
|
.getByRole('button', { name: /Настройки|Settings/ })
|
||||||
|
.first()
|
||||||
|
.click();
|
||||||
|
|
||||||
|
const langSelect = page.locator('.panel-container-right select').first();
|
||||||
|
await langSelect.selectOption('en');
|
||||||
|
|
||||||
|
await expect(
|
||||||
|
page.locator('.panel-container-right').getByRole('button', { name: /Workspaces/ }).first(),
|
||||||
|
).toBeVisible({ timeout: 5_000 });
|
||||||
|
|
||||||
|
await langSelect.selectOption('ru');
|
||||||
|
});
|
||||||
31
tests/e2e/smoke.spec.ts
Normal file
31
tests/e2e/smoke.spec.ts
Normal file
|
|
@ -0,0 +1,31 @@
|
||||||
|
import { test, expect, login } from './fixtures';
|
||||||
|
|
||||||
|
test.beforeEach(async ({ context }) => {
|
||||||
|
await login(context);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('predict page loads and mounts the MapLibre canvas', async ({ page }) => {
|
||||||
|
await page.goto('/predict');
|
||||||
|
await expect(page.locator('.map-container canvas').first()).toBeAttached({
|
||||||
|
timeout: 15_000,
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
test('left and right panels are visible on predict', async ({ page }) => {
|
||||||
|
await page.goto('/predict');
|
||||||
|
await expect(page.locator('.panel-container-left')).toBeVisible();
|
||||||
|
await expect(page.locator('.panel-container-right')).toBeVisible();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('navbar shows current username dropdown when authenticated', async ({ page }) => {
|
||||||
|
await page.goto('/predict');
|
||||||
|
await expect(page.getByRole('link', { name: /Прогноз|Predict/ }).first()).toBeVisible();
|
||||||
|
await expect(page.getByText('demo').first()).toBeVisible();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('tracking page mounts its own map', async ({ page }) => {
|
||||||
|
await page.goto('/track');
|
||||||
|
await expect(page.locator('.map-container canvas').first()).toBeAttached({
|
||||||
|
timeout: 15_000,
|
||||||
|
});
|
||||||
|
});
|
||||||
68
tests/e2e/workspaces.spec.ts
Normal file
68
tests/e2e/workspaces.spec.ts
Normal file
|
|
@ -0,0 +1,68 @@
|
||||||
|
import { test, expect, openPredict, login } from './fixtures';
|
||||||
|
|
||||||
|
test.beforeEach(async ({ context, page }) => {
|
||||||
|
await login(context);
|
||||||
|
await page.goto('/');
|
||||||
|
await page.evaluate(() => localStorage.removeItem('workspaces'));
|
||||||
|
});
|
||||||
|
|
||||||
|
function workspacesPanel(page: import('@playwright/test').Page) {
|
||||||
|
return page.locator('.panel-container-right');
|
||||||
|
}
|
||||||
|
|
||||||
|
test('a workspace is auto-created on first visit to /predict', async ({ page }) => {
|
||||||
|
await openPredict(page);
|
||||||
|
const panel = workspacesPanel(page);
|
||||||
|
await expect(panel.locator('.workspace-row').first()).toBeVisible({ timeout: 10_000 });
|
||||||
|
await expect(panel.getByRole('button', { name: /Рассчитать|Run/ }).first()).toBeVisible();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('can add and remove workspaces', async ({ page }) => {
|
||||||
|
await openPredict(page);
|
||||||
|
const panel = workspacesPanel(page);
|
||||||
|
await expect(panel.locator('.workspace-row')).toHaveCount(1, { timeout: 10_000 });
|
||||||
|
|
||||||
|
const addBtn = panel.getByRole('button', { name: /Добавить|Add/ }).first();
|
||||||
|
await addBtn.click();
|
||||||
|
await expect(panel.locator('.workspace-row')).toHaveCount(2);
|
||||||
|
await addBtn.click();
|
||||||
|
await expect(panel.locator('.workspace-row')).toHaveCount(3);
|
||||||
|
|
||||||
|
// Delete the last workspace via its row's delete button.
|
||||||
|
const deleteBtn = panel.locator('.workspace-row').last().locator('button.btn-danger');
|
||||||
|
await deleteBtn.click();
|
||||||
|
// Confirm in the modal.
|
||||||
|
await page
|
||||||
|
.getByRole('dialog')
|
||||||
|
.getByRole('button', { name: /^(Удалить|Delete)$/ })
|
||||||
|
.click();
|
||||||
|
await expect(panel.locator('.workspace-row')).toHaveCount(2);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('workspace render pipeline adds a map scene after a run', async ({ page }) => {
|
||||||
|
test.setTimeout(90_000);
|
||||||
|
await openPredict(page);
|
||||||
|
|
||||||
|
// Wait for the Run button to be enabled before clicking.
|
||||||
|
const runBtn = workspacesPanel(page)
|
||||||
|
.locator('.workspace-row')
|
||||||
|
.first()
|
||||||
|
.getByRole('button', { name: /Рассчитать|Run/ });
|
||||||
|
await runBtn.click();
|
||||||
|
|
||||||
|
// Wait for the prediction request to complete and layers to be added.
|
||||||
|
await expect
|
||||||
|
.poll(
|
||||||
|
async () =>
|
||||||
|
page.evaluate(() => {
|
||||||
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||||
|
const map: any = (window as any)._lsvMap;
|
||||||
|
if (!map) return 0;
|
||||||
|
return map
|
||||||
|
.getStyle()
|
||||||
|
.layers.filter((l: { id: string }) => l.id.startsWith('ws/')).length;
|
||||||
|
}),
|
||||||
|
{ timeout: 75_000, intervals: [1000, 2000, 3000] },
|
||||||
|
)
|
||||||
|
.toBeGreaterThan(0);
|
||||||
|
});
|
||||||
Loading…
Add table
Add a link
Reference in a new issue