@andrian.yablonskyy/thub-coordinator 1.0.41 → 1.0.43

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@andrian.yablonskyy/thub-coordinator",
-  "version": "1.0.41",
+  "version": "1.0.43",
   "description": "TestHub Coordinator — job queue, resource registry, scheduler, heartbeat monitor, log/artifact store and web dashboard",
   "main": "src/server.js",
   "engines": {

package/public/css/thub.css

@@ -227,3 +227,111 @@
     animation: none;
   }
 }
+
+/* Mobile / tablet menu (below lg, where the navbar collapses; layout.pug).
+   It drops down over the page instead of pushing it down, scrolls inside
+   itself on short screens, and is laid out for thumbs: pages as a two-column
+   grid, the tools in one row, the account in the next. public/js/actions.js
+   closes it on a tap outside, Esc, or choosing a page. */
+.thub-nav-break {
+  display: none;
+}
+
+@media (max-width: 991.98px) {
+  .navbar .thub-nav {
+    position: absolute;
+    top: 100%;
+    left: 0;
+    right: 0;
+    z-index: 1035;
+    max-height: calc(100dvh - 4rem);
+    overflow-y: auto;
+    padding: 0.75rem 1rem 1rem;
+    background: var(--bs-tertiary-bg);
+    border-bottom: 1px solid var(--bs-border-color);
+    box-shadow: 0 0.75rem 1.5rem rgba(0, 0, 0, 0.15);
+  }
+
+  .thub-nav-pages {
+    display: grid;
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    gap: 0.375rem;
+    padding-bottom: 0.75rem;
+    border-bottom: 1px solid var(--bs-border-color);
+  }
+
+  .thub-nav-pages .nav-link {
+    display: flex;
+    align-items: center;
+    min-height: 2.75rem;
+    padding: 0.5rem 0.75rem;
+    border-radius: var(--bs-border-radius);
+    background: var(--bs-body-bg);
+    border: 1px solid var(--bs-border-color-translucent);
+  }
+
+  .thub-nav-pages .nav-link.active {
+    background: var(--bs-primary-bg-subtle);
+    border-color: var(--bs-primary-border-subtle);
+    color: var(--bs-primary-text-emphasis);
+    font-weight: 500;
+  }
+
+  .thub-nav-tools {
+    flex-direction: row;
+    flex-wrap: wrap;
+    align-items: center;
+    gap: 0.5rem 0.75rem;
+    padding-top: 0.75rem;
+  }
+
+  .thub-nav-tools > li {
+    margin: 0 !important;
+  }
+
+  /* Bigger tap targets for the icon buttons. */
+  .thub-nav-tools .btn-sm {
+    min-width: 2.5rem;
+    min-height: 2.5rem;
+  }
+
+  /* The account row: the profile link takes the line, sign-out at its end. */
+  .thub-nav-break {
+    display: block;
+    flex-basis: 100%;
+    height: 0;
+  }
+
+  .thub-nav-account {
+    flex: 1 1 auto;
+    min-height: 2.5rem;
+  }
+}
+
+/* Phones: wide tables scroll sideways inside their own box instead of
+   running off the page, with one-line headers (wrapped headers of squeezed
+   columns used to make the header row very tall). The resource card's tab
+   row scrolls sideways too rather than wrapping onto several lines. */
+@media (max-width: 767.98px) {
+  main .table:not(.table-responsive .table) {
+    display: block;
+    max-width: 100%;
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+  }
+
+  main .table th {
+    white-space: nowrap;
+  }
+
+  .thub-resource-card .nav-tabs {
+    flex-wrap: nowrap;
+    overflow-x: auto;
+    overflow-y: hidden;
+    scrollbar-width: thin;
+  }
+
+  .thub-resource-card .nav-tabs .nav-link {
+    white-space: nowrap;
+  }
+}

package/public/js/actions.js

@@ -39,6 +39,29 @@
     }
   });
 
+  // The collapsed (mobile) menu drops down over the page (thub.css
+  // .thub-nav): close it on a tap outside, on Esc, and once a page in it is
+  // chosen — over the content, it shouldn't stay open in the way.
+  const nav = document.getElementById('nav'),
+    closeNav = () => {
+      if (nav?.classList.contains('show')){
+        window.bootstrap?.Collapse.getOrCreateInstance(nav, { toggle: false }).hide();
+      }
+    };
+  document.addEventListener('click', (e) => {
+    if (!nav?.classList.contains('show')){
+      return;
+    }
+    if (!e.target.closest('#nav, .navbar-toggler') || e.target.closest('#nav a[href]')){
+      closeNav();
+    }
+  });
+  document.addEventListener('keydown', (e) => {
+    if (e.key === 'Escape'){
+      closeNav();
+    }
+  });
+
   // <form data-submit-busy>: disable its button and show a spinner while
   // the request runs (e.g. the navbar's check for updates).
   document.addEventListener('submit', (e) => {

package/public/js/tooltips.js

@@ -16,5 +16,10 @@
 // Delegated (one instance per element, created on first hover/focus), so
 // content swapped in by live updates (public/js/live.js) gets tooltips too.
 (function (){
+  // On touch screens a tap would open a tooltip and leave it stuck there
+  // (no hover to end it) — over the mobile menu, too: no tooltips there.
+  if (!window.matchMedia('(hover: hover)').matches){
+    return;
+  }
   new bootstrap.Tooltip(document.body, { selector: '[data-bs-toggle="tooltip"]' });
 })();

package/src/api/sse.js

@@ -28,6 +28,12 @@ function attachJobStream(req, res, { jobId, services }){
     res.status(404).json({ error: 'Unknown job' });
     return;
   }
+  // HEAD (a monitoring check, a proxy): no stream — one opened for it would
+  // never end, and block every later request on the same connection.
+  if (req.method === 'HEAD'){
+    res.status(204).end();
+    return;
+  }
 
   res.writeHead(200, {
     'Content-Type': 'text/event-stream',

package/src/web/routes.js

@@ -395,6 +395,14 @@ function createWebRouter({ services, config }){
   const LIVE_PING_MS = 25_000,
     LIVE_SESSION_CHECK_MS = 15_000;
   router.get('/live', (req, res) => {
+    // HEAD (live.js asks it whether the session is still alive): answer and
+    // finish. Express sends HEAD to this GET handler, and a stream opened
+    // for it would never end: the browser — or a proxy — reuses the
+    // connection once the headers are in, and every later request on it
+    // would queue behind that response forever (stuck page loads).
+    if (req.method === 'HEAD'){
+      return res.status(204).end();
+    }
     res.writeHead(200, {
       'Content-Type': 'text/event-stream',
       'Cache-Control': 'no-cache, no-transform',

package/test/stream-head.test.js

@@ -0,0 +1,75 @@
+/**
+ * @file        packages/coordinator/test/stream-head.test.js
+ * @description Tests: a HEAD request to a stream endpoint (/live, job log streams) finishes, and doesn't block its keep-alive connection
+ *
+ * @author      Andrian Yablonskyy
+ * @copyright   Copyright (c) 2026 Andrian Yablonskyy. All rights reserved.
+ *
+ * This file is part of TestHub and is proprietary and confidential.
+ * Unauthorized copying, modification, distribution, or use of this file,
+ * via any medium, is strictly prohibited without prior written permission
+ * from AdSystem.PRO.
+ */
+
+'use strict';
+
+const test = require('node:test'),
+  assert = require('node:assert/strict'),
+  fs = require('node:fs'),
+  http = require('node:http'),
+  os = require('node:os'),
+  path = require('node:path'),
+  { loadConfig } = require('../src/config'),
+  { buildServices, createApp } = require('../src/server');
+
+// What a browser does: one keep-alive connection, reused as soon as a
+// response is complete — and a HEAD response is complete with its headers.
+function oneConnection(port){
+  const agent = new http.Agent({ keepAlive: true, maxSockets: 1 }),
+    request = (method, url, headers = {}) => new Promise((resolve, reject) => {
+      const req = http.request({ host: '127.0.0.1', port, method, path: url, headers, agent }, (res) => {
+        res.resume();
+        res.on('end', () => resolve(res.statusCode));
+      });
+      req.setTimeout(3000, () => req.destroy(new Error(`${method} ${url}: no answer within 3 s — the connection is blocked`)));
+      req.on('error', reject);
+      req.end();
+    });
+  return { request, close: () => agent.destroy() };
+}
+
+test('HEAD on a stream endpoint answers at once and leaves the connection usable (no stuck page loads)', async (t) => {
+  const dir = fs.mkdtempSync(path.join(os.tmpdir(), 'thub-head-')),
+    file = path.join(dir, 'coordinator.json');
+  fs.writeFileSync(file, JSON.stringify({ dataDir: path.join(dir, 'data'), updates: { checkIntervalMin: 0 } }));
+  const config = loadConfig(file),
+    services = buildServices(config),
+    server = createApp(config, services).listen(0, '127.0.0.1');
+  t.after(() => new Promise((r) => {
+    server.closeAllConnections?.();
+    server.close(r);
+  }));
+  await new Promise((r) => server.on('listening', r));
+  const port = server.address().port;
+  services.adminUsers.create({ username: 'admin', password: 'pw', role: 'admin' });
+  const cookie = (await fetch(`http://127.0.0.1:${port}/login`, {
+      method: 'POST', body: new URLSearchParams({ username: 'admin', password: 'pw' }), redirect: 'manual'
+    })).headers.get('set-cookie').split(';')[0],
+    { agent, token } = services.agents.create({ name: 'ci', kind: 'ci' }),
+    // A Client the job can wait for (a job nothing could ever run is refused).
+    registered = services.registry.registerAuto({ clientId: 'c1', name: 'lab-sw-01', type: 'sw', labels: [] }),
+    // An active job: its streams stay open for a GET.
+    job = registered && services.jobs.create({ agentId: agent.id, source: 'ci', spec: { target: { type: 'sw' }, command: './t.sh' } });
+
+  for (const [url, headers]of [
+    ['/live', { cookie, 'X-Thub-Live': '1' }], // what live.js probes
+    [`/jobs/${job.id}/stream`, { cookie }],
+    [`/api/v1/jobs/${job.id}/logs/stream`, { authorization: `Bearer ${token}` }]
+  ]){
+    const conn = oneConnection(port);
+    t.after(conn.close);
+    assert.equal(await conn.request('HEAD', url, headers), 204, url);
+    // The next request on the very same connection: answered, not queued forever.
+    assert.equal(await conn.request('GET', '/js/copy-to-clipboard.js'), 200, `after HEAD ${url}`);
+  }
+});

package/views/layout.pug

@@ -29,23 +29,18 @@ html(lang="en" data-bs-theme=(user && user.theme) || "auto")
               )= `v${updates.coordinatorUpdate} available`
         button.navbar-toggler(type="button" data-bs-toggle="collapse" data-bs-target="#nav")
           span.navbar-toggler-icon
-        #nav.collapse.navbar-collapse
-          ul.navbar-nav.me-auto
-            if user
-              li.nav-item
-                a.nav-link(href="/" class=active === 'overview' ? 'active' : '') Overview
-              li.nav-item
-                a.nav-link(href="/resources" class=active === 'resources' ? 'active' : '') Resources
+        #nav.collapse.navbar-collapse.thub-nav
+          //- Below lg the menu drops down over the page (thub.css .thub-nav,
+          //- closed by public/js/actions.js): pages as a two-column grid with
+          //- icons, then the tools in a row, then the account row.
+          - const pages = user ? [['/', 'overview', 'Overview', 'speedometer2'], ['/resources', 'resources', 'Resources', 'hdd-rack'], ['/groups', 'groups', 'Groups', 'collection'], ['/jobs', 'jobs', 'Jobs', 'list-task']].concat(user.role === 'admin' ? [['/admin/agents', 'agents', 'Agents', 'person-badge'], ['/admin/settings', 'settings', 'Settings', 'gear']] : []) : []
+          ul.navbar-nav.me-auto.thub-nav-pages
+            each pg in pages
               li.nav-item
-                a.nav-link(href="/groups" class=active === 'groups' ? 'active' : '') Groups
-              li.nav-item
-                a.nav-link(href="/jobs" class=active === 'jobs' ? 'active' : '') Jobs
-              if user.role === 'admin'
-                li.nav-item
-                  a.nav-link(href="/admin/agents" class=active === 'agents' ? 'active' : '') Agents
-                li.nav-item
-                  a.nav-link(href="/admin/settings" class=active === 'settings' ? 'active' : '') Settings
-          ul.navbar-nav
+                a.nav-link(href=pg[0] class=active === pg[1] ? 'active' : '' aria-current=active === pg[1] ? 'page' : false)
+                  i.bi.me-2.d-lg-none(class=`bi-${pg[3]}` aria-hidden="true")
+                  = pg[2]
+          ul.navbar-nav.thub-nav-tools
             if user && liveTopics
               //- Live-update status, driven by public/js/live.js.
               li.nav-item.d-flex.align-items-center.me-3
@@ -117,7 +112,8 @@ html(lang="en" data-bs-theme=(user && user.theme) || "auto")
               )
                 i.bi.bi-circle-half
             if user
-              li.nav-item.d-flex.align-items-center.me-3
+              li.thub-nav-break(aria-hidden="true")
+              li.nav-item.d-flex.align-items-center.me-3.thub-nav-account
                 a.nav-link.d-flex.align-items-center.p-0(
                   href="/profile"
                   data-bs-toggle="tooltip"
@@ -130,6 +126,7 @@ html(lang="en" data-bs-theme=(user && user.theme) || "auto")
                     span.rounded-circle.bg-secondary.text-white.d-inline-flex.align-items-center.justify-content-center.me-2(style="width: 24px; height: 24px; font-size: 12px;")
                       = ((user.firstName ? user.firstName[0] : user.username[0]) + (user.lastName ? user.lastName[0] : '')).toUpperCase()
                   span= user.firstName ? `${user.firstName} ${user.lastName || ''}`.trim() : user.username
+                  span.small.text-body-secondary.ms-2.d-lg-none= `${user.role} · profile`
               li.nav-item.d-flex.align-items-center
                 form(action="/logout" method="post")
                   button.btn.btn-sm.btn-outline-danger(