test-reporting 3.2.0__tar.gz → 3.2.2__tar.gz

{test_reporting-3.2.0/test_reporting.egg-info → test_reporting-3.2.2}/PKG-INFO

@@ -1,6 +1,6 @@
 Metadata-Version: 2.4
 Name: test-reporting
-Version: 3.2.0
+Version: 3.2.2
 Summary: Multi-project test reporting dashboard — collect results locally or push to S3
 Home-page: https://github.com/amahdy77/test-reporting.git
 Author: Ashfaqur Mahdy

{test_reporting-3.2.0 → test_reporting-3.2.2}/reporting/templates/project.html

@@ -6,7 +6,7 @@
   <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
   <meta http-equiv="Pragma" content="no-cache" />
   <meta http-equiv="Expires" content="0" />
-  <title>Project — Test Dashboard</title>
+  <title>Project - Test Dashboard</title>
   <script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.0/dist/chart.umd.min.js"></script>
   <style>
     *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
@@ -139,6 +139,37 @@
     .section-explain { font-size: 13px; color: var(--muted); line-height: 1.5; }
     .section-body { padding: 20px 24px; }
     .section-body-flush { }
+    
+    /* Collapsible sections with preview */
+    .section-head.collapsible { cursor: pointer; user-select: none; display: flex;
+                                 justify-content: space-between; align-items: flex-start; }
+    .section-head.collapsible:hover { background: var(--bg); }
+    .section-head-content { flex: 1; }
+    .section-toggle { color: var(--muted); font-size: 14px; transition: transform .2s;
+                      flex-shrink: 0; margin-left: 12px; margin-top: 2px; }
+    .section-toggle.collapsed { transform: rotate(-90deg); }
+    
+    /* Preview mode - show partial content */
+    .section-body-flush.preview { max-height: 200px; overflow: hidden; position: relative;
+                                   cursor: pointer; transition: max-height .3s ease; }
+    .section-body-flush.preview:hover { background: var(--blue-bg); }
+    .section-body-flush.preview::after {
+      content: 'Click to expand ▼'; position: absolute; bottom: 0; left: 0; right: 0;
+      height: 60px; display: flex; align-items: flex-end; justify-content: center;
+      padding-bottom: 12px; font-size: 13px; font-weight: 600; color: var(--blue);
+      background: linear-gradient(to bottom, transparent, var(--surface) 50%);
+      pointer-events: none; transition: opacity .2s;
+    }
+    .section-body-flush.preview:hover::after { opacity: 0.8; }
+    .section-body-flush.expanded { max-height: none; cursor: pointer; }
+    .section-body-flush.expanded:hover { background: var(--blue-bg); }
+    .section-body-flush.expanded::after {
+      content: 'Click to collapse ▲'; position: relative; display: block;
+      text-align: center; padding: 16px; font-size: 13px; font-weight: 600;
+      color: var(--blue); background: var(--bg); border-top: 1px solid var(--border);
+      transition: background .1s;
+    }
+    .section-body-flush.expanded:hover::after { background: var(--border); }
 
     /* ── Two-column grid ── */
     .two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@@ -157,6 +188,8 @@
     td { padding: 12px 16px; border-bottom: 1px solid var(--border); vertical-align: middle; }
     tr:last-child td { border-bottom: none; }
     tr:hover td { background: var(--bg); }
+    tr.clickable-row { cursor: pointer; }
+    tr.clickable-row:hover td { background: var(--blue-bg); }
     .test-name { font-weight: 600; max-width: 280px; overflow: hidden;
                  text-overflow: ellipsis; white-space: nowrap; }
     .file-name { color: var(--muted); font-size: 12px; margin-top: 2px; }
@@ -271,6 +304,13 @@
       opacity: 0; transition: opacity .15s; z-index: 200;
     }
     [data-tooltip]:hover::after { opacity: 1; }
+
+    /* ── Expandable tables ── */
+    .table-expand-btn { padding: 12px 24px; text-align: center; border-top: 1px solid var(--border);
+                        cursor: pointer; color: var(--blue); font-size: 13px; font-weight: 600;
+                        transition: background .1s; }
+    .table-expand-btn:hover { background: var(--bg); }
+    .table-row-hidden { display: none; }
   </style>
 </head>
 <body>
@@ -325,7 +365,7 @@
 
   /* ── Helpers ── */
   function relTime(iso) {
-    if (!iso) return '—';
+    if (!iso) return '-';
     const diff = Date.now() - new Date(iso).getTime();
     const m = Math.floor(diff / 60000);
     if (m < 1) return 'Just now';
@@ -336,12 +376,12 @@
   }
 
   function fmtDate(iso) {
-    if (!iso) return '—';
+    if (!iso) return '-';
     return new Date(iso).toLocaleDateString(undefined, { month: 'short', day: 'numeric', year: 'numeric' });
   }
 
   function fmtDur(s) {
-    if (!s || s === 0) return '—';
+    if (!s || s === 0) return '-';
     if (s >= 60) return Math.floor(s / 60) + 'm ' + Math.floor(s % 60) + 's';
     return s.toFixed(1) + 's';
   }
@@ -519,7 +559,7 @@
     return hero +
       '<div class="section">' +
         '<div class="section-head">' +
-          '<h3>Regressions</h3>' +
+          '<h3>Recent Test Runs</h3>' +
           '<p class="section-explain">Each group shows all test files that ran together on a given tag. Click a test file to see the full test breakdown.</p>' +
         '</div>' +
         '<div class="section-body">' + regsHtml + '</div>' +
@@ -533,6 +573,31 @@
     ch.classList.toggle('open', open);
   }
 
+  function toggleTableRows(btn) {
+    const table = btn.previousElementSibling;
+    const hiddenRows = table.querySelectorAll('.table-row-hidden');
+    const isExpanded = hiddenRows[0].style.display === 'table-row';
+    
+    hiddenRows.forEach(function(row) {
+      row.style.display = isExpanded ? 'none' : 'table-row';
+    });
+    
+    const count = hiddenRows.length;
+    btn.textContent = isExpanded 
+      ? 'Show ' + count + ' more ▼'
+      : 'Show less ▲';
+  }
+
+  function toggleSectionExpand(body) {
+    if (body.classList.contains('preview')) {
+      body.classList.remove('preview');
+      body.classList.add('expanded');
+    } else if (body.classList.contains('expanded')) {
+      body.classList.remove('expanded');
+      body.classList.add('preview');
+    }
+  }
+
   function goToRun(runId) {
     if (runId) location.href = 'run.html?r=' + encodeURIComponent(runId) + '&p=' + encodeURIComponent(projectName);
   }
@@ -567,33 +632,31 @@
         '</div>' +
       '</div>' +
 
-      '<div class="two-col">' +
-        '<div class="section">' +
-          '<div class="section-head">' +
-            '<h3>Why Are Tests Failing?</h3>' +
-            '<p class="section-explain">Failure type breakdown. Real bugs need code fixes; infrastructure issues are environment problems.</p>' +
-          '</div>' +
-          '<div class="section-body">' +
-            ((a.failure_type_breakdown || []).length === 0
-              ? '<p class="empty-section">No failures recorded yet.</p>'
-              : '<div class="chart-wrap chart-wrap-sm"><canvas id="failureTypeChart"></canvas></div>') +
-          '</div>' +
+      '<div class="section">' +
+        '<div class="section-head">' +
+          '<h3>Why Are Tests Failing?</h3>' +
+          '<p class="section-explain">Failure type breakdown. Real bugs need code fixes; infrastructure issues are environment problems.</p>' +
         '</div>' +
+        '<div class="section-body">' +
+          ((a.failure_type_breakdown || []).length === 0
+            ? '<p class="empty-section">No failures recorded yet.</p>'
+            : '<div class="chart-wrap chart-wrap-sm"><canvas id="failureTypeChart"></canvas></div>') +
+        '</div>' +
+      '</div>' +
 
-        '<div class="section">' +
-          '<div class="section-head">' +
-            '<h3>Test File Reliability (Treemap)</h3>' +
-            '<p class="section-explain">Each block = one file. Size ∝ test count. Color = pass rate. Worst files at top-left.</p>' +
-          '</div>' +
-          '<div class="section-body">' +
-            renderTreemap(a.file_health || []) +
-          '</div>' +
+      '<div class="section">' +
+        '<div class="section-head">' +
+          '<h3>Test File Reliability (Treemap)</h3>' +
+          '<p class="section-explain">Each block = one file. Size ∝ test count. Color = pass rate. Worst files at top-left.</p>' +
+        '</div>' +
+        '<div class="section-body">' +
+          renderTreemap(a.file_health || []) +
         '</div>' +
       '</div>' +
 
       '<div class="section">' +
         '<div class="section-head">' +
-          '<h3>Duration vs Failures — Scatter</h3>' +
+          '<h3>Duration vs Failures - Scatter</h3>' +
           '<p class="section-explain">Each dot = one test. X = avg duration, Y = failure count. Top-right quadrant = highest priority fixes.</p>' +
         '</div>' +
         '<div class="section-body">' +
@@ -607,10 +670,10 @@
 
       '<div class="section">' +
         '<div class="section-head">' +
-          '<h3>Unreliable Tests — Flaky</h3>' +
+          '<h3>Unreliable Tests - Flaky</h3>' +
           '<p class="section-explain">Tests that pass sometimes and fail other times without code changes. Flaky tests erode trust in your test suite.</p>' +
         '</div>' +
-        '<div class="section-body-flush">' +
+        '<div class="section-body-flush preview" onclick="toggleSectionExpand(this)">' +
           renderFlakyTable(a.flaky_tests || []) +
         '</div>' +
       '</div>' +
@@ -618,32 +681,30 @@
       '<div class="section">' +
         '<div class="section-head">' +
           '<h3>Tests That Break the Most</h3>' +
-          '<p class="section-explain">Highest-priority fixes — resolving these has the biggest positive impact on your overall pass rate.</p>' +
+          '<p class="section-explain">Highest-priority fixes - resolving these has the biggest positive impact on your overall pass rate.</p>' +
         '</div>' +
-        '<div class="section-body-flush">' +
+        '<div class="section-body-flush preview" onclick="toggleSectionExpand(this)">' +
           renderHotspotsTable(a.failure_hotspots || []) +
         '</div>' +
       '</div>' +
 
-      '<div class="two-col">' +
-        '<div class="section">' +
-          '<div class="section-head">' +
-            '<h3>Slowest Tests</h3>' +
-            '<p class="section-explain">Tests taking the longest to run. Good candidates for optimization.</p>' +
-          '</div>' +
-          '<div class="section-body-flush">' +
-            renderSlowTable(a.slowest_tests || []) +
-          '</div>' +
+      '<div class="section">' +
+        '<div class="section-head">' +
+          '<h3>Slowest Tests</h3>' +
+          '<p class="section-explain">Tests taking the longest to run. Good candidates for optimization.</p>' +
+        '</div>' +
+        '<div class="section-body-flush preview" onclick="toggleSectionExpand(this)">' +
+          renderSlowTable(a.slowest_tests || []) +
         '</div>' +
+      '</div>' +
 
-        '<div class="section">' +
-          '<div class="section-head">' +
-            '<h3>Tests Getting Slower</h3>' +
-            '<p class="section-explain">Tests that have become significantly slower over the last 7 days. A slowing test can signal feature degradation.</p>' +
-          '</div>' +
-          '<div class="section-body-flush">' +
-            renderRegressionTable(a.performance_regressions || []) +
-          '</div>' +
+      '<div class="section">' +
+        '<div class="section-head">' +
+          '<h3>Tests Getting Slower</h3>' +
+          '<p class="section-explain">Tests that have become significantly slower over the last 7 days. A slowing test can signal feature degradation.</p>' +
+        '</div>' +
+        '<div class="section-body-flush preview" onclick="toggleSectionExpand(this)">' +
+          renderRegressionTable(a.performance_regressions || []) +
         '</div>' +
       '</div>';
   }
@@ -750,55 +811,79 @@
 
   function renderFlakyTable(tests) {
     if (tests.length === 0) return '<p class="empty-section" style="padding:20px">No flaky tests detected.</p>';
+    const limit = 5;
     const rows = tests.map(function(t, i) {
-      return '<tr class="anim-row" style="animation-delay:' + (i * 0.04) + 's">' +
+      const hiddenClass = i >= limit ? ' table-row-hidden' : '';
+      const clickAttr = t.last_run_id ? ' class="anim-row clickable-row' + hiddenClass + '" onclick="goToRun(\'' + t.last_run_id + '\')"' : ' class="anim-row' + hiddenClass + '"';
+      return '<tr' + clickAttr + ' style="animation-delay:' + (i * 0.04) + 's">' +
         '<td><div class="test-name" title="' + t.test_name + '">' + t.test_name + '</div><div class="file-name">' + t.file_name + '</div></td>' +
         '<td><span class="pill pill-yellow">' + t.pass_rate + '% pass rate</span></td>' +
         '<td style="text-align:center">' + t.passed + '</td>' +
         '<td style="text-align:center;color:var(--red)">' + t.failed + '</td>' +
         '<td style="text-align:center">' + t.total_runs + '</td>' +
-        '<td style="color:var(--muted);font-size:12px">' + (t.last_failed ? fmtDate(t.last_failed) : '—') + '</td>' +
+        '<td style="color:var(--muted);font-size:12px">' + (t.last_failed ? fmtDate(t.last_failed) : '-') + '</td>' +
       '</tr>';
     }).join('');
-    return '<table><thead><tr><th>Test</th><th>Consistency</th><th>Passed</th><th>Failed</th><th>Total Runs</th><th>Last Failed</th></tr></thead><tbody>' + rows + '</tbody></table>';
+    const expandBtn = tests.length > limit
+      ? '<div class="table-expand-btn" onclick="toggleTableRows(this)">Show ' + (tests.length - limit) + ' more ▼</div>'
+      : '';
+    return '<table><thead><tr><th>Test</th><th>Consistency</th><th>Passed</th><th>Failed</th><th>Total Runs</th><th>Last Failed</th></tr></thead><tbody>' + rows + '</tbody></table>' + expandBtn;
   }
 
   function renderHotspotsTable(tests) {
     if (tests.length === 0) return '<p class="empty-section" style="padding:20px">No failure hotspots detected yet.</p>';
+    const limit = 5;
     const rows = tests.map(function(t, i) {
-      return '<tr class="anim-row" style="animation-delay:' + (i * 0.04) + 's">' +
+      const hiddenClass = i >= limit ? ' table-row-hidden' : '';
+      const clickAttr = t.last_run_id ? ' class="anim-row clickable-row' + hiddenClass + '" onclick="goToRun(\'' + t.last_run_id + '\')"' : ' class="anim-row' + hiddenClass + '"';
+      return '<tr' + clickAttr + ' style="animation-delay:' + (i * 0.04) + 's">' +
         '<td><div class="test-name" title="' + t.test_name + '">' + t.test_name + '</div><div class="file-name">' + t.file_name + '</div></td>' +
         '<td><span class="pill pill-red">' + t.failure_count + ' failures</span></td>' +
         '<td>' + t.failure_label + '</td>' +
-        '<td style="color:var(--muted);font-size:12px">' + (t.last_failed ? fmtDate(t.last_failed) : '—') + '</td>' +
+        '<td style="color:var(--muted);font-size:12px">' + (t.last_failed ? fmtDate(t.last_failed) : '-') + '</td>' +
       '</tr>';
     }).join('');
-    return '<table><thead><tr><th>Test</th><th>Failure Count</th><th>Cause</th><th>Last Failed</th></tr></thead><tbody>' + rows + '</tbody></table>';
+    const expandBtn = tests.length > limit
+      ? '<div class="table-expand-btn" onclick="toggleTableRows(this)">Show ' + (tests.length - limit) + ' more ▼</div>'
+      : '';
+    return '<table><thead><tr><th>Test</th><th>Failure Count</th><th>Cause</th><th>Last Failed</th></tr></thead><tbody>' + rows + '</tbody></table>' + expandBtn;
   }
 
   function renderSlowTable(tests) {
     if (tests.length === 0) return '<p class="empty-section" style="padding:20px">Not enough data yet.</p>';
+    const limit = 5;
     const rows = tests.map(function(t, i) {
-      return '<tr class="anim-row" style="animation-delay:' + (i * 0.04) + 's">' +
+      const hiddenClass = i >= limit ? ' table-row-hidden' : '';
+      const clickAttr = t.last_run_id ? ' class="anim-row clickable-row' + hiddenClass + '" onclick="goToRun(\'' + t.last_run_id + '\')"' : ' class="anim-row' + hiddenClass + '"';
+      return '<tr' + clickAttr + ' style="animation-delay:' + (i * 0.04) + 's">' +
         '<td><div class="test-name" title="' + t.test_name + '">' + t.test_name + '</div><div class="file-name">' + t.file_name + '</div></td>' +
         '<td style="font-weight:700">' + fmtDur(t.avg_duration) + '</td>' +
         '<td style="color:var(--muted);font-size:12px">' + fmtDur(t.max_duration) + ' max</td>' +
       '</tr>';
     }).join('');
-    return '<table><thead><tr><th>Test</th><th>Avg Duration</th><th>Max</th></tr></thead><tbody>' + rows + '</tbody></table>';
+    const expandBtn = tests.length > limit
+      ? '<div class="table-expand-btn" onclick="toggleTableRows(this)">Show ' + (tests.length - limit) + ' more ▼</div>'
+      : '';
+    return '<table><thead><tr><th>Test</th><th>Avg Duration</th><th>Max</th></tr></thead><tbody>' + rows + '</tbody></table>' + expandBtn;
   }
 
   function renderRegressionTable(tests) {
     if (tests.length === 0) return '<p class="empty-section" style="padding:20px">No performance regressions detected.</p>';
+    const limit = 5;
     const rows = tests.map(function(t, i) {
-      return '<tr class="anim-row" style="animation-delay:' + (i * 0.04) + 's">' +
+      const hiddenClass = i >= limit ? ' table-row-hidden' : '';
+      const clickAttr = t.last_run_id ? ' class="anim-row clickable-row' + hiddenClass + '" onclick="goToRun(\'' + t.last_run_id + '\')"' : ' class="anim-row' + hiddenClass + '"';
+      return '<tr' + clickAttr + ' style="animation-delay:' + (i * 0.04) + 's">' +
         '<td><div class="test-name" title="' + t.test_name + '">' + t.test_name + '</div><div class="file-name">' + t.file_name + '</div></td>' +
         '<td style="color:var(--muted);font-size:12px">' + fmtDur(t.historical_avg) + '</td>' +
         '<td style="font-weight:700">' + fmtDur(t.recent_avg) + '</td>' +
         '<td><span class="pill pill-red">+' + t.percent_slower + '% slower</span></td>' +
       '</tr>';
     }).join('');
-    return '<table><thead><tr><th>Test</th><th>Was</th><th>Now</th><th>Change</th></tr></thead><tbody>' + rows + '</tbody></table>';
+    const expandBtn = tests.length > limit
+      ? '<div class="table-expand-btn" onclick="toggleTableRows(this)">Show ' + (tests.length - limit) + ' more ▼</div>'
+      : '';
+    return '<table><thead><tr><th>Test</th><th>Was</th><th>Now</th><th>Change</th></tr></thead><tbody>' + rows + '</tbody></table>' + expandBtn;
   }
 
   /* ═══════════════════════════════════════════════════
@@ -835,7 +920,7 @@
       return '<tr>' +
         '<td>' + fmtDate(run.timestamp) + '</td>' +
         '<td><div style="font-weight:600;font-size:13px">' + run.file_name + '</div></td>' +
-        '<td>' + (run.regression_tag || '—') + '</td>' +
+        '<td>' + (run.regression_tag || '-') + '</td>' +
         '<td><span class="pill ' + pc + '">' + run.pass_rate.toFixed(0) + '%</span></td>' +
         '<td>' + run.total_tests + '</td>' +
         '<td style="color:var(--red)">' + run.failed + '</td>' +
@@ -850,7 +935,7 @@
         var canvas = document.getElementById(sid);
         if (!canvas) continue;
         var pts = sparklineIds[sid];
-        if (pts.length < 2) { canvas.outerHTML = '<span class="sparkline-none-sm">—</span>'; continue; }
+        if (pts.length < 2) { canvas.outerHTML = '<span class="sparkline-none-sm">-</span>'; continue; }
         new Chart(canvas, {
           type: 'line',
           data: {
@@ -1041,7 +1126,7 @@
 
     document.getElementById('pageTitle').textContent = proj.name;
     document.getElementById('lastRun').textContent   = 'Last run ' + relTime(proj.last_run);
-    document.title = proj.name + ' — Test Dashboard';
+    document.title = proj.name + ' - Test Dashboard';
 
     const analytics = proj.analytics || {};
 

{test_reporting-3.2.0 → test_reporting-3.2.2}/reporting/templates/run.html

@@ -6,7 +6,7 @@
   <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
   <meta http-equiv="Pragma" content="no-cache" />
   <meta http-equiv="Expires" content="0" />
-  <title>Run Details — Test Dashboard</title>
+  <title>Run Details - Test Dashboard</title>
   <style>
     *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
 
@@ -322,14 +322,14 @@
   var projectName = params.get('p') || '';
 
   function fmtDate(iso) {
-    if (!iso) return '—';
+    if (!iso) return '-';
     return new Date(iso).toLocaleString(undefined, {
       month:'short', day:'numeric', year:'numeric',
       hour:'2-digit', minute:'2-digit'
     });
   }
   function fmtDur(s) {
-    if (!s || s === 0) return '—';
+    if (!s || s === 0) return '-';
     if (s >= 60) return Math.floor(s/60) + 'm ' + Math.floor(s%60) + 's';
     return s.toFixed(1) + 's';
   }
@@ -374,13 +374,13 @@
       var cls = segClass(f.pass_rate);
       var label = pct > 8 ? f.file_name.replace(/\.py$/, '') : '';
       return '<div class="timeline-seg ' + cls + '" style="flex:' + pct.toFixed(2) + '"'
-        + ' title="' + f.file_name + ' — ' + f.pass_rate.toFixed(0) + '% passing (' + f.passed + '/' + f.total + ')"'
+        + ' title="' + f.file_name + ' - ' + f.pass_rate.toFixed(0) + '% passing (' + f.passed + '/' + f.total + ')"'
         + ' onclick="scrollToFile(\'' + f.file_name.replace(/'/g, '') + '\')">'
         + label + '</div>';
     }).join('');
 
     return '<div class="timeline-wrap">'
-      + '<div class="timeline-label">Test File Map — click to jump</div>'
+      + '<div class="timeline-label">Test File Map - click to jump</div>'
       + '<div class="timeline-bar">' + segs + '</div>'
       + '<div class="timeline-legend">'
       + '<div class="timeline-legend-item"><div class="legend-dot" style="background:#38a169"></div>Passing (≥95%)</div>'
@@ -410,7 +410,7 @@
       return;
     }
 
-    document.title = (run.suite_name || 'Run') + ' — Test Dashboard';
+    document.title = (run.suite_name || 'Run') + ' - Test Dashboard';
     document.getElementById('pageTitle').textContent =
       (run.suite_name || 'Run') + '  ·  ' + (run.project_name || '');
     document.getElementById('runTime').textContent = fmtDate(run.timestamp);
@@ -441,7 +441,7 @@
     /* Timeline */
     var timeline = buildTimeline(files, total);
 
-    /* Hero — ring card + metric cards */
+    /* Hero - ring card + metric cards */
     var rateColor2 = ringColor(rate);
     var ringHtml = buildRing(rate);
     var hero = '<div class="hero">'

{test_reporting-3.2.0 → test_reporting-3.2.2}/setup.py

@@ -9,7 +9,7 @@ with open("README.md", "r", encoding="utf-8") as fh:
 
 setup(
     name='test-reporting',
-    version='3.2.0',
+    version='3.2.2',
     description='Multi-project test reporting dashboard — collect results locally or push to S3',
     long_description=long_description,
     long_description_content_type="text/markdown",

{test_reporting-3.2.0 → test_reporting-3.2.2/test_reporting.egg-info}/PKG-INFO

@@ -1,6 +1,6 @@
 Metadata-Version: 2.4
 Name: test-reporting
-Version: 3.2.0
+Version: 3.2.2
 Summary: Multi-project test reporting dashboard — collect results locally or push to S3
 Home-page: https://github.com/amahdy77/test-reporting.git
 Author: Ashfaqur Mahdy