@testomatio/reporter 2.7.4-beta.allure-1 → 2.7.5

package/lib/template/testomatio.hbs

@@ -741,6 +741,18 @@
             min-width: 0;
         }
 
+        .step-header {
+            display: flex;
+            align-items: center;
+            gap: 12px;
+            width: 100%;
+        }
+
+        .step-main {
+            flex: 1;
+            min-width: 0;
+        }
+
         .step-text {
             font-size: 14px;
             color: var(--gray-700);
@@ -755,6 +767,35 @@
             margin-top: 4px;
         }
 
+        .step-toggle {
+            width: 24px;
+            height: 24px;
+            border: none;
+            border-radius: 6px;
+            background: var(--gray-100);
+            color: var(--gray-600);
+            display: inline-flex;
+            align-items: center;
+            justify-content: center;
+            cursor: pointer;
+            flex-shrink: 0;
+            transition: var(--transition);
+            margin-top: 2px;
+        }
+
+        .step-toggle:hover {
+            background: var(--gray-200);
+            color: var(--gray-700);
+        }
+
+        .step-toggle.collapsed i {
+            transform: rotate(-90deg);
+        }
+
+        .step-toggle i {
+            transition: transform 0.2s ease;
+        }
+
         .step-status {
             width: 8px;
             height: 8px;
@@ -790,6 +831,10 @@
             padding-left: 0;
         }
 
+        .step-children.collapsed {
+            display: none;
+        }
+
         .step-children::before {
             content: '';
             position: absolute;
@@ -867,6 +912,30 @@
             border-left-color: var(--info-color);
         }
 
+        .message-block.passed {
+            border-left-color: var(--success-color);
+        }
+
+        .message-block.skipped,
+        .message-block.todo {
+            border-left-color: var(--warning-color);
+        }
+
+        .message-block.failed {
+            border-left-color: var(--danger-color);
+        }
+
+        .step-attachments {
+            display: grid;
+            grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
+            gap: 12px;
+            margin-top: 12px;
+        }
+
+        .step-attachments .attachment-item {
+            min-height: 120px;
+        }
+
         .metadata-grid {
             display: grid;
             grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
@@ -2377,6 +2446,11 @@
             const isTodo = statusClass === 'todo';
             const isSkippedOrTodo = statusClass === 'skipped' || statusClass === 'todo';
             const displayTime = isSkippedOrTodo ? '-' : formatDuration(test.run_time || 0);
+            const hasMessage = hasMeaningfulMessage(test.message);
+            const initialTab = getInitialTestTab({ isTodo, hasMessage, hasSteps: test.stepsArray?.length || test.steps });
+            const initialMessageClass = initialTab === 'message' ? ' active' : '';
+            const initialStepsClass = initialTab === 'steps' ? ' active' : '';
+            const initialInfoClass = initialTab === 'info' ? ' active' : '';
 
             testItem.innerHTML = `
                 <div class='test-header' onclick='toggleTest(this)'>
@@ -2411,14 +2485,14 @@
                 <div class='test-content'>
                     <div class='test-tabs'>
                         ${isTodo ? `
-                            <button class='test-tab active' onclick='showTestTab(this, \"info\")'>
+                            <button class='test-tab${initialInfoClass}' onclick='showTestTab(this, \"info\")'>
                                 <i class='fas fa-info-circle'></i> Info
                             </button>
                         ` : `
-                            <button class='test-tab active' onclick='showTestTab(this, \"steps\")'>
+                            <button class='test-tab${initialStepsClass}' onclick='showTestTab(this, \"steps\")'>
                                 <i class='fas fa-list-ol'></i> Steps
                             </button>
-                            <button class='test-tab' onclick='showTestTab(this, \"message\")'>
+                            <button class='test-tab${initialMessageClass}' onclick='showTestTab(this, \"message\")'>
                                 <i class='fas fa-comment-dots'></i> Message
                             </button>
                             ${hasStack ? `<button class='test-tab' onclick='showTestTab(this, \"stack\")'>
@@ -2439,7 +2513,7 @@
                         `}
                     </div>
                     ${isTodo ? `
-                        <div class='test-tab-content active' data-tab='info'>
+                        <div class='test-tab-content${initialInfoClass}' data-tab='info'>
                             <div class='todo-info'>
                                 <div class='todo-title'>
                                     <i class='fas fa-list-ul'></i>
@@ -2456,7 +2530,7 @@
                             </div>
                         </div>
                     ` : `
-                        <div class='test-tab-content active' data-tab='steps'>
+                        <div class='test-tab-content${initialStepsClass}' data-tab='steps'>
                             <div class='steps-container' id='steps-${index}'>
                                 ${(() => {
                                     const hasStepsArray = test.stepsArray && Array.isArray(test.stepsArray) && test.stepsArray.length > 0;
@@ -2476,7 +2550,7 @@
                                 })()}
                             </div>
                         </div>
-                        <div class='test-tab-content' data-tab='message'>
+                        <div class='test-tab-content${initialMessageClass}' data-tab='message'>
                             <div class='message-block ${statusClass}'>
                                 <strong>${statusClass.toUpperCase()}:</strong><br>
                                 ${test.message || 'No message available'}
@@ -2542,6 +2616,16 @@
             }
         }
 
+        function hasMeaningfulMessage(message) {
+            return typeof message === 'string' && message.trim().length > 0 && message !== 'No message available';
+        }
+
+        function getInitialTestTab({ isTodo, hasMessage }) {
+            if (isTodo) return 'info';
+            if (hasMessage) return 'message';
+            return 'steps';
+        }
+
         function parseStepsToHtml(stepsText) {
             if (!stepsText || stepsText === 'No steps recorded') {
                 return `<div class="step-item">
@@ -2629,25 +2713,33 @@
                     const status = step.status || 'passed';
                     const duration = step.duration || 0;
                     const category = step.category || '';
+                    const hasArtifacts = Array.isArray(step.artifacts) && step.artifacts.length > 0;
 
                     html += `
                         <div class="step-item step-level-${depth}" data-step-id="${stepId}">
-                            <div class="step-number">${stepNumber}</div>
                             <div class="step-content">
-                                <p class="step-text">${step.title || 'Untitled step'}</p>
-                                ${category && category !== 'user' ? `<div class="step-category">${category}</div>` : ''}
-                                <div class="step-time">
-                                    Step ${stepNumber}
-                                    ${duration > 0 ? `<span class="step-duration"><i class="fas fa-clock"></i> ${formatDuration(duration)}</span>` : ''}
+                                <div class="step-header">
+                                    <div class="step-number">${stepNumber}</div>
+                                    <div class="step-main">
+                                        <p class="step-text">${step.title || 'Untitled step'}</p>
+                                        ${category && category !== 'user' ? `<div class="step-category">${category}</div>` : ''}
+                                        ${duration > 0 ? `<div class="step-time"><span class="step-duration"><i class="fas fa-clock"></i> ${formatDuration(duration)}</span></div>` : ''}
+                                        ${hasArtifacts ? `<div class="step-attachments">${createAttachmentItems(step.artifacts)}</div>` : ''}
+                                    </div>
+                                    ${hasChildren ? `
+                                        <button class="step-toggle" type="button" aria-expanded="true" onclick="toggleStepChildren(this)">
+                                            <i class="fas fa-chevron-down"></i>
+                                        </button>
+                                    ` : ''}
+                                    <div class="step-status ${status}"></div>
                                 </div>
                             </div>
-                            <div class="step-status ${status}"></div>
                         </div>
                     `;
 
                     if (hasChildren) {
                         html += `
-                            <div class="step-children">
+                            <div class="step-children" data-parent-step-id="${stepId}">
                                 ${renderStepsTree(step.steps, depth + 1)}
                             </div>
                         `;
@@ -2673,19 +2765,38 @@
         function createStepHtml(text, number, status = null, category = null) {
             const statusClass = status || 'passed';
             const categoryText = category && category !== 'user' ? `<div class="step-category">${category}</div>` : '';
-            const durationIcon = status ? `<div class="step-duration"><i class="fas fa-clock"></i> auto</div>` : '';
+            const durationIcon = status ? `<div class="step-time"><span class="step-duration"><i class="fas fa-clock"></i> auto</span></div>` : '';
 
             return `<div class="step-item">
-                <div class="step-number">${number}</div>
                 <div class="step-content">
-                    <p class="step-text">${text}</p>
-                    ${categoryText}
-                    <div class="step-time">Step ${number}${durationIcon}</div>
+                    <div class="step-header">
+                        <div class="step-number">${number}</div>
+                        <div class="step-main">
+                            <p class="step-text">${text}</p>
+                            ${categoryText}
+                            ${durationIcon}
+                        </div>
+                        <div class="step-status ${statusClass}"></div>
+                    </div>
                 </div>
-                <div class="step-status ${statusClass}"></div>
             </div>`;
         }
 
+        function toggleStepChildren(button) {
+            const stepItem = button.closest('.step-item');
+            if (!stepItem) return;
+
+            const stepId = stepItem.getAttribute('data-step-id');
+            if (!stepId) return;
+
+            const children = stepItem.parentElement.querySelector(`.step-children[data-parent-step-id="${stepId}"]`);
+            if (!children) return;
+
+            const collapsed = children.classList.toggle('collapsed');
+            button.classList.toggle('collapsed', collapsed);
+            button.setAttribute('aria-expanded', collapsed ? 'false' : 'true');
+        }
+
         function createRetryAttempts(retries) {
             const attempts = Array.isArray(retries?.attempts) ? retries.attempts : [];
             if (!attempts.length) return '';

package/lib/utils/utils.js

@@ -324,15 +324,6 @@ const fetchSourceCode = (contents, opts = {}) => {
             if (lineIndex === -1)
                 lineIndex = lines.findIndex(l => l.includes(`${title}(`));
         }
-        else if (opts.lang === 'kotlin') {
-            lineIndex = lines.findIndex(l => l.includes(`fun test${title}`));
-            if (lineIndex === -1)
-                lineIndex = lines.findIndex(l => l.includes(`@DisplayName("${title}`));
-            if (lineIndex === -1)
-                lineIndex = lines.findIndex(l => l.includes(`fun ${title}`));
-            if (lineIndex === -1)
-                lineIndex = lines.findIndex(l => l.includes(`${title}(`));
-        }
         else if (opts.lang === 'csharp') {
             // Find the method declaration line
             let methodLineIndex = lines.findIndex(l => l.includes(`public void ${title}(`));

package/lib/xmlReader.js

@@ -661,16 +661,18 @@ function reduceTestCases(prev, item) {
 function processTestSuite(testsuite) {
     if (!testsuite)
         return [];
-    if (testsuite.testsuite)
+    if (testsuite.testsuite && !testsuite.testcase)
         return processTestSuite(testsuite.testsuite);
     if (testsuite['test-suite'] && !testsuite['test-case'])
         return processTestSuite(testsuite['test-suite']);
     let suites = testsuite;
-    if (!Array.isArray(testsuite)) {
+    if (!Array.isArray(testsuite))
         suites = [testsuite];
-    }
-    const subSuites = suites.filter(s => s['test-suite'] && !testsuite['test-case']);
-    return [...subSuites.map(s => processTestSuite(s['test-suite'])), ...suites.reduce(reduceTestCases, [])].flat();
+    const subSuites = suites.filter(s => (s['test-suite'] || s.testsuite) && !(s['test-case'] || s.testcase));
+    return [
+        ...suites.reduce(reduceTestCases, []),
+        ...subSuites.map(s => processTestSuite(s['test-suite'] || s.testsuite)),
+    ].flat();
 }
 function fetchProperties(item) {
     const tags = [];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@testomatio/reporter",
-  "version": "2.7.4-beta.allure-1",
+  "version": "2.7.5",
   "description": "Testomatio Reporter Client",
   "engines": {
     "node": ">=18"

package/src/adapter/vitest.js

@@ -19,21 +19,37 @@ const debug = createDebugMessages('@testomatio/reporter:adapter-jest');
 class VitestReporter {
   constructor(config = {}) {
     this.client = new TestomatioClient({ apiKey: config?.apiKey });
-    /**
-     * @type {(TestData & {status: string})[]} tests
-     */
+    /** @type {(TestData & {status: string, _reportKey?: string | null})[]} tests */
     this.tests = [];
     this._finalized = false;
     this._finalizing = false;
+    this._runStartedAtMs = null;
+    this._runStartedAtMicros = null;
+    this._reportedTestKeys = new Set();
+    this._liveQueue = Promise.resolve();
   }
 
   // on run start
   onInit() {
+    const now = Date.now();
     this._finalized = false;
     this._finalizing = false;
+    this._runStartedAtMs = now;
+    this._runStartedAtMicros = now * 1000;
+    this._reportedTestKeys = new Set();
+    this._liveQueue = Promise.resolve();
     this.client.createRun();
   }
 
+  /**
+   * Vitest 3/4 callback fired when test run starts.
+   */
+  onTestRunStart() {
+    const now = Date.now();
+    this._runStartedAtMs = now;
+    this._runStartedAtMicros = now * 1000;
+  }
+
   /**
    * @param {VitestTestFile[] | undefined} files // array with results;
    * @param {unknown[] | undefined} errors // errors does not contain errors from tests; probably its testrunner errors
@@ -68,13 +84,18 @@ class VitestReporter {
 
       // send tests to Testomat.io
       for (const test of this.tests) {
+        if (test._reportKey && this._reportedTestKeys.has(test._reportKey)) continue;
+        if (test._reportKey) this._reportedTestKeys.add(test._reportKey);
         await this.client.addTestRun(test.status, test);
       }
+      await this._liveQueue;
 
       console.log('finished');
       if (errors.length) console.error('Vitest adapter errors:', errors);
 
-      await this.client.updateRunStatus(getRunStatusFromResults(files));
+      const startedAtMs = this._runStartedAtMs || getEarliestTestStartMs(files) || Date.now();
+      const duration = Math.max(0, (Date.now() - startedAtMs) / 1000);
+      await this.client.updateRunStatus(getRunStatusFromResults(files), { duration });
       this._finalized = true;
     } finally {
       this._finalizing = false;
@@ -94,6 +115,28 @@ class VitestReporter {
     await this.onFinished(files, errors);
   }
 
+  /**
+   * Vitest 4 callback fired when single test case is finished.
+   *
+   * @param {unknown} testCase
+   */
+  async onTestCaseResult(testCase) {
+    await this.#reportLive(testCase);
+  }
+
+  /**
+   * Vitest 3 fallback callback with task updates.
+   *
+   * @param {unknown[] | undefined} packs
+   */
+  async onTaskUpdate(packs) {
+    if (!Array.isArray(packs) || !packs.length) return;
+    for (const pack of packs) {
+      const test = getTestFromTaskUpdatePack(pack);
+      if (test) await this.#reportLive(test);
+    }
+  }
+
   /* non-used listeners
   onUserConsoleLog(log) {}
   onPathsCollected(paths) {} // paths array to files with tests
@@ -128,25 +171,52 @@ class VitestReporter {
   /**
    * Processes task and returns test data ready to be sent to Testomat.io
    *
-   * @param {VitestTest} test
+   * @param {any} test
    *
-   * @returns {TestData & {status: 'passed' | 'failed' | 'skipped'}}
+   * @returns {TestData & {status: 'passed' | 'failed' | 'skipped', _reportKey?: string | null}}
    */
   #getDataFromTest(test) {
+    const normalized = normalizeVitestTest(test);
+    const reportKey = getReportKey(test, normalized);
+    const startMicros =
+      typeof normalized.startTime === 'number'
+        ? Math.floor(normalized.startTime * 1000)
+        : this._runStartedAtMicros || undefined;
+
     return {
-      error: test.result?.errors ? test.result.errors[0] : undefined,
-      file: test.file?.name || test.file?.filepath || '',
-      logs: test.logs ? transformLogsToString(test.logs) : '',
-      meta: test.meta,
+      _reportKey: reportKey,
+      error: normalized.error,
+      file: normalized.file,
+      logs: normalized.logs,
+      meta: normalized.meta,
       // @ts-ignore - STATUS values are string literals but type system sees them as string
-      status: getTestStatus(test),
-      suite_title: test.suite?.name || test.file?.name || test.file?.filepath,
-      test_id: getTestomatIdFromTestTitle(test.name),
-      time: test.result?.duration || 0,
-      title: test.name,
+      status: getTestStatus(normalized.state, normalized.mode),
+      suite_title: normalized.suiteTitle,
+      test_id: getTestomatIdFromTestTitle(normalized.name),
+      time: normalized.duration,
+      timestamp: startMicros,
+      title: normalized.name,
       // testomatio functions (artifacts, logs, steps, meta) are not supported
     };
   }
+
+  /**
+   * @param {unknown} testCase
+   */
+  async #reportLive(testCase) {
+    if (this._finalized || this._finalizing) return;
+    const normalized = normalizeVitestTest(testCase);
+    if (!isLiveReportableState(normalized.state, normalized.mode)) return;
+
+    const data = this.#getDataFromTest(testCase);
+    if (!data._reportKey || this._reportedTestKeys.has(data._reportKey)) return;
+    this._reportedTestKeys.add(data._reportKey);
+
+    this._liveQueue = this._liveQueue
+      .then(() => this.client.addTestRun(data.status, data))
+      .catch(() => undefined);
+    await this._liveQueue;
+  }
 }
 
 /**
@@ -162,17 +232,16 @@ function getRunStatusFromResults(files) {
   let status = 'finished'; // default status (if no failed or passed tests)
 
   files.forEach(file => {
-    // search for failed tests
-    file.tasks.forEach(taskOrSuite => {
-      if (taskOrSuite.result?.state === 'fail') {
+    getTasks(file).forEach(taskOrSuite => {
+      if (isFailedState(taskOrSuite?.result?.state)) {
         status = 'failed'; // set status to failed if any test failed
       }
     });
 
     // if there are no failed tests > search for passed tests
     if (status !== 'failed') {
-      file.tasks.forEach(taskOrSuite => {
-        if (taskOrSuite.result?.state === 'pass') {
+      getTasks(file).forEach(taskOrSuite => {
+        if (isPassedState(taskOrSuite?.result?.state)) {
           status = 'passed'; // set status to passed if any test passed (and there are no failed tests)
         }
       });
@@ -185,14 +254,15 @@ function getRunStatusFromResults(files) {
 /**
  * Returns test status in Testomat.io format
  *
- * @param {VitestTest} test
+ * @param {string | undefined} state
+ * @param {string | undefined} mode
  * @returns 'passed' | 'failed' | 'skipped'
  */
-function getTestStatus(test) {
-  if (test.result?.state === 'fail') return STATUS.FAILED;
-  if (test.result?.state === 'pass') return STATUS.PASSED;
-  if (test.result?.state === 'skip' || (!test.result && test.mode === 'skip')) return STATUS.SKIPPED;
-  console.error(pc.red('Unprocessed case for defining test status. Contact dev team. Test:'), test);
+function getTestStatus(state, mode) {
+  if (isFailedState(state)) return STATUS.FAILED;
+  if (isPassedState(state)) return STATUS.PASSED;
+  if (isSkippedState(state) || (!state && mode === 'skip')) return STATUS.SKIPPED;
+  console.error(pc.red('Unprocessed case for defining test status. Contact dev team. State:'), state);
   return STATUS.SKIPPED;
 }
 
@@ -220,9 +290,166 @@ function getTasks(node) {
   if (!node) return [];
   if (Array.isArray(node.tasks)) return node.tasks;
   if (Array.isArray(node.children)) return node.children;
+  if (node.children && typeof node.children[Symbol.iterator] === 'function') return Array.from(node.children);
   if (node.task) return [node.task];
   return [];
 }
 
+/**
+ * @param {string | undefined} state
+ * @returns {boolean}
+ */
+function isFailedState(state) {
+  return state === 'fail' || state === 'failed';
+}
+
+/**
+ * @param {string | undefined} state
+ * @returns {boolean}
+ */
+function isPassedState(state) {
+  return state === 'pass' || state === 'passed';
+}
+
+/**
+ * @param {string | undefined} state
+ * @returns {boolean}
+ */
+function isSkippedState(state) {
+  return state === 'skip' || state === 'skipped' || state === 'todo';
+}
+
+/**
+ * Accept only completed test states for live upload to avoid reporting
+ * intermediate task updates as skipped.
+ *
+ * @param {string | undefined} state
+ * @param {string | undefined} mode
+ * @returns {boolean}
+ */
+function isLiveReportableState(state, mode) {
+  if (isFailedState(state) || isPassedState(state) || isSkippedState(state)) return true;
+  if (!state && mode === 'skip') return true;
+  return false;
+}
+
+/**
+ * @param {VitestTestFile[] | undefined} files
+ * @returns {number | null}
+ */
+function getEarliestTestStartMs(files) {
+  let earliest = null;
+  const walk = node => {
+    if (!node) return;
+    const startTime = node?.result?.startTime;
+    if (typeof startTime === 'number' && !Number.isNaN(startTime)) {
+      if (earliest == null || startTime < earliest) earliest = startTime;
+    }
+    getTasks(node).forEach(walk);
+  };
+  (files || []).forEach(walk);
+  return earliest;
+}
+
+/**
+ * @param {any} test
+ * @returns {{
+ *  name: string,
+ *  state: string | undefined,
+ *  mode: string | undefined,
+ *  duration: number,
+ *  startTime: number | undefined,
+ *  error: any,
+ *  file: string,
+ *  suiteTitle: string,
+ *  logs: string,
+ *  meta: any
+ * }}
+ */
+function normalizeVitestTest(test) {
+  if (test && typeof test.result === 'function') {
+    const result = test.result();
+    const diagnostic = typeof test.diagnostic === 'function' ? test.diagnostic() : undefined;
+    const state = result?.state;
+    const duration = diagnostic?.duration || 0;
+    const startTime = diagnostic?.startTime;
+    const error = Array.isArray(result?.errors) ? result.errors[0] : undefined;
+    const file =
+      test.module?.relativeModuleId ||
+      test.module?.moduleId ||
+      test.task?.file?.name ||
+      test.task?.file?.filepath ||
+      '';
+    const suiteTitle =
+      (test.parent?.type === 'suite' ? test.parent?.name : null) ||
+      test.task?.suite?.name ||
+      test.task?.file?.name ||
+      file;
+
+    return {
+      name: test.name || test.task?.name || '',
+      state,
+      mode: test.options?.mode || test.task?.mode,
+      duration,
+      startTime,
+      error,
+      file,
+      suiteTitle,
+      logs: '',
+      meta: typeof test.meta === 'function' ? test.meta() : {},
+    };
+  }
+
+  return {
+    name: test?.name || '',
+    state: test?.result?.state,
+    mode: test?.mode,
+    duration: test?.result?.duration || 0,
+    startTime: test?.result?.startTime,
+    error: test?.result?.errors ? test.result.errors[0] : undefined,
+    file: test?.file?.name || test?.file?.filepath || '',
+    suiteTitle: test?.suite?.name || test?.file?.name || test?.file?.filepath || '',
+    logs: test?.logs ? transformLogsToString(test.logs) : '',
+    meta: test?.meta,
+  };
+}
+
+/**
+ * @param {any} test
+ * @param {{file: string, suiteTitle: string, name: string, startTime?: number}} normalized
+ * @returns {string | null}
+ */
+function getReportKey(test, normalized) {
+  if (test?.id) return String(test.id);
+  if (test?.task?.id) return String(test.task.id);
+  if (!normalized?.name) return null;
+  const loc = test?.location || test?.task?.location;
+  const locationKey = loc ? `${loc.line || ''}:${loc.column || ''}` : '';
+  const startKey =
+    typeof normalized.startTime === 'number' && !Number.isNaN(normalized.startTime) ? String(normalized.startTime) : '';
+  return `${normalized.file}::${normalized.suiteTitle}::${normalized.name}::${locationKey}::${startKey}`;
+}
+
+/**
+ * Vitest can pass task updates as tuples. Try to extract a test-like object.
+ *
+ * @param {unknown} pack
+ * @returns {any | null}
+ */
+function getTestFromTaskUpdatePack(pack) {
+  if (!pack) return null;
+
+  if (Array.isArray(pack)) {
+    if (pack[2]?.type === 'test') return pack[2];
+    if (pack[1]?.type === 'test') return pack[1];
+    if (pack[0]?.type === 'test') return pack[0];
+    return null;
+  }
+
+  const objectPack = /** @type {any} */ (pack);
+  if (typeof objectPack === 'object' && objectPack?.type === 'test') return objectPack;
+  return null;
+}
+
 export default VitestReporter;
 export { VitestReporter };