feat(ci): add e2e duration charts (#2361)

Description

Move E2E report chart generation from the previous JavaScript/Chart.js implementation to a Python renderer based on matplotlib.

The E2E report pipeline now renders chart PNG files in Python before the Loop messenger report is built. Python writes a manifest that maps each cluster to generated chart files, and the JavaScript messenger path only reads that manifest and attaches existing PNG files to Loop thread replies.

Main changes:

Generate the Loop feature-duration-status chart in Python with a stacked per-Describe duration/status layout, 60-second x-axis ticks, value labels, and compact chart margins.
Generate top-N slowest-specs charts in Python for local triage and CI workflow artifacts.
Remove the JavaScript Chart.js renderer, chart configs, builders, snapshots, and chartjs-node-canvas dependency.
Keep Loop chart attachments best-effort: failed file uploads do not drop the report thread text.
Keep local tasks report:render:slowest and report:render:top-slowest writing PNG output under tmp/charts/.
Update the local tmp/test-ci/report/run.sh runner to create a Python venv, install chart dependencies there, generate messenger chart manifests, and attach generated files locally.
Add Python unit tests for aggregation, sorting, manifest generation, artifact names, no-match errors, and chart output.

---------

Signed-off-by: Nikita Korolev <nikita.korolev@flant.com>

Author: universal-itengineer

.github/scripts/js/.prettierrc

@@ -0,0 +1,3 @@
+{
+  "printWidth": 120
+}

.github/scripts/js/e2e/report/cluster-report.js

@@ -13,10 +13,7 @@
 const fs = require("fs");
 
 const { findSingleMatchingFile } = require("./shared/fs-utils");
-const {
-  parseGinkgoOutput,
-  parseGinkgoReport,
-} = require("./shared/ginkgo-report-utils");
+const { parseGinkgoOutput, parseGinkgoReport } = require("./shared/ginkgo-report-utils");
 const {
   archivedReportPattern,
   buildClusterStatus,
@@ -69,11 +66,11 @@ const {
  */
 
 const workflowStages = [
-  { name: "bootstrap",            displayName: "Bootstrap cluster",        needsJobId: "bootstrap" },
-  { name: "configure-sdn",        displayName: "Configure SDN",            needsJobId: "configure-sdn" },
-  { name: "storage-setup",        displayName: "Configure storage",        needsJobId: "configure-storage" },
+  { name: "bootstrap", displayName: "Bootstrap cluster", needsJobId: "bootstrap" },
+  { name: "configure-sdn", displayName: "Configure SDN", needsJobId: "configure-sdn" },
+  { name: "storage-setup", displayName: "Configure storage", needsJobId: "configure-storage" },
   { name: "virtualization-setup", displayName: "Configure Virtualization", needsJobId: "configure-virtualization" },
-  { name: "e2e-test",             displayName: "E2E test",                 needsJobId: "e2e-test" },
+  { name: "e2e-test", displayName: "E2E test", needsJobId: "e2e-test" },
 ];
 
 function readClusterReportConfigFromEnv(env = process.env) {
@@ -178,6 +175,8 @@ async function readStageJobUrlsFromApi(github, context, config, core) {
  *   metrics: ReturnType<typeof zeroMetrics>,
  *   failedTests: string[],
  *   failedTestDetails: Array<{name: string, reason: string}>,
+ *   specTimings: Array<Record<string, any>>,
+ *   suiteTotalMs: number,
  *   startedAt: null,
  *   source: string,
  * }} Empty parsed-report payload.
@@ -187,6 +186,8 @@ function emptyParsedReport(source) {
     metrics: zeroMetrics(),
     failedTests: [],
     failedTestDetails: [],
+    specTimings: [],
+    suiteTotalMs: 0,
     startedAt: null,
     source,
   };
@@ -217,6 +218,8 @@ const ginkgoOutputSource = {
  *   metrics: ReturnType<typeof zeroMetrics>,
  *   failedTests: string[],
  *   failedTestDetails: Array<{name: string, reason: string}>,
+ *   specTimings: Array<Record<string, any>>,
+ *   suiteTotalMs: number,
  *   startedAt: string|null,
  * }} parse Parser function for the source content.
  * @property {function(string): RegExp} pattern Builds the file-name regex for the source.
@@ -232,11 +235,7 @@ const ginkgoOutputSource = {
  * @returns {string|null} Path to the source file, or null when none exists.
  */
 function findGinkgoSource(config, source) {
-  return findSingleMatchingFile(
-    config.reportsDir,
-    source.pattern(config.storageType),
-    source.label
-  );
+  return findSingleMatchingFile(config.reportsDir, source.pattern(config.storageType), source.label);
 }
 
 /**
@@ -252,6 +251,8 @@ function findGinkgoSource(config, source) {
  *   metrics: ReturnType<typeof zeroMetrics>,
  *   failedTests: string[],
  *   failedTestDetails: Array<{name: string, reason: string}>,
+ *   specTimings: Array<Record<string, any>>,
+ *   suiteTotalMs: number,
  *   startedAt: string|null,
  *   source: string,
  * }} Parsed report payload with a source tag.
@@ -268,38 +269,21 @@ function parseGinkgoFile(filePath, core, source) {
       source: source.okSource,
     };
   } catch (error) {
-    core.warning(
-      `Unable to parse ${source.label} ${filePath}: ${error.message}`
-    );
+    core.warning(`Unable to parse ${source.label} ${filePath}: ${error.message}`);
     return emptyParsedReport(source.invalidSource);
   }
 }
 
-function buildReportPayload({
-  config,
-  context,
-  fallbackWorkflowRunUrl,
-  branchName,
-  parsedReport,
-  sourcePath,
-}) {
+function buildReportPayload({ config, context, fallbackWorkflowRunUrl, branchName, parsedReport, sourcePath }) {
   const clusterStatus = buildClusterStatus(config.stageResults);
   const testStatus = buildTestStatus(
     config.stageResults["e2e-test"],
     parsedReport.source,
     clusterStatus,
     parsedReport.metrics
   );
-  const reportSummary = buildReportSummary(
-    config.storageType,
-    clusterStatus,
-    testStatus
-  );
-  const workflowRunUrl = getReportJobUrl(
-    reportSummary,
-    config.stageJobUrls,
-    fallbackWorkflowRunUrl
-  );
+  const reportSummary = buildReportSummary(config.storageType, clusterStatus, testStatus);
+  const workflowRunUrl = getReportJobUrl(reportSummary, config.stageJobUrls, fallbackWorkflowRunUrl);
 
   return {
     schemaVersion: 1,
@@ -320,16 +304,14 @@ function buildReportPayload({
     metrics: parsedReport.metrics,
     failedTests: parsedReport.failedTests,
     failedTestDetails: parsedReport.failedTestDetails,
+    specTimings: parsedReport.specTimings || [],
+    suiteTotalMs: parsedReport.suiteTotalMs || 0,
     sourceReport: sourcePath,
     reportSource: parsedReport.source,
   };
 }
 
-function getReportJobUrl(
-  reportSummary,
-  stageJobUrls = {},
-  fallbackWorkflowRunUrl
-) {
+function getReportJobUrl(reportSummary, stageJobUrls = {}, fallbackWorkflowRunUrl) {
   if (reportSummary.failedStage && stageJobUrls[reportSummary.failedStage]) {
     return stageJobUrls[reportSummary.failedStage];
   }
@@ -367,29 +349,20 @@ function setReportOutputs(report, reportFile, core) {
  * @throws {Error} If config is incomplete or the report file cannot be written.
  */
 async function buildClusterReport({ core, context, github, config } = {}) {
-  const resolvedConfig = requireClusterReportConfig(
-    config || readClusterReportConfigFromEnv()
-  );
+  const resolvedConfig = requireClusterReportConfig(config || readClusterReportConfigFromEnv());
 
   if (!resolvedConfig.stageResults) {
     resolvedConfig.stageResults = readStageResultsFromEnv();
   }
 
   if (!resolvedConfig.stageJobUrls && github) {
-    resolvedConfig.stageJobUrls = await readStageJobUrlsFromApi(
-      github,
-      context,
-      resolvedConfig,
-      core
-    );
+    resolvedConfig.stageJobUrls = await readStageJobUrlsFromApi(github, context, resolvedConfig, core);
   }
 
   const fallbackWorkflowRunUrl = getWorkflowRunUrl(context);
   const branchName = getBranchName(context);
   const rawReportPath = findGinkgoSource(resolvedConfig, ginkgoJsonSource);
-  const outputPath = rawReportPath
-    ? null
-    : findGinkgoSource(resolvedConfig, ginkgoOutputSource);
+  const outputPath = rawReportPath ? null : findGinkgoSource(resolvedConfig, ginkgoOutputSource);
   const sourcePath = rawReportPath || outputPath;
   const sourceDescriptor = rawReportPath ? ginkgoJsonSource : ginkgoOutputSource;
 
@@ -410,14 +383,9 @@ async function buildClusterReport({ core, context, github, config } = {}) {
   });
 
   try {
-    fs.writeFileSync(
-      resolvedConfig.reportFile,
-      `${JSON.stringify(report, null, 2)}\n`
-    );
+    fs.writeFileSync(resolvedConfig.reportFile, `${JSON.stringify(report, null, 2)}\n`);
   } catch (error) {
-    throw new Error(
-      `Unable to write cluster report file ${resolvedConfig.reportFile}: ${error.message}`
-    );
+    throw new Error(`Unable to write cluster report file ${resolvedConfig.reportFile}: ${error.message}`);
   }
 
   setReportOutputs(report, resolvedConfig.reportFile, core);