---

report js 

  LEGACY_FAIL: "fail",
};

const STATUS_BAR_COLORS = {
  [TEST_STATUS.PASSED]: "#22c55e",
  [TEST_STATUS.FAILED]: "#ef4444",
  [TEST_STATUS.BROKEN]: "#f97316",
  [TEST_STATUS.SKIPPED]: "#9ca3af",
};




















    renderStatusBar(stats) {
      const segments = [
        { key: TEST_STATUS.PASSED, count: stats.passed || 0, label: TEST_STATUS.PASSED },
        { key: TEST_STATUS.FAILED, count: stats.failed || 0, label: TEST_STATUS.FAILED },
        { key: TEST_STATUS.BROKEN, count: stats.broken || 0, label: TEST_STATUS.BROKEN },
        { key: TEST_STATUS.SKIPPED, count: stats.skipped || 0, label: TEST_STATUS.SKIPPED },
      ].filter((segment) => segment.count > 0);

      const totalCount = stats.total || segments.reduce((sum, segment) => sum + segment.count, 0);
      const labelClass = this.getStatusBarLabelClass(totalCount);
      const ariaLabel = segments
        .map((segment) => `${segment.label}: ${segment.count}`)
        .join(", ");

      const segmentHtml = segments
        .map((segment) => {
          const share = totalCount > 0 ? segment.count / totalCount : 0;
          const showLabel = share >= 0.08;
          const title = `${segment.label}: ${segment.count}`;
          const backgroundColor = STATUS_BAR_COLORS[segment.key] || STATUS_BAR_COLORS[TEST_STATUS.FAILED];
          const labelHtml = showLabel
            ? `<span class="${labelClass} leading-none">${this.escapeHtml(String(segment.count))}</span>`
            : "";
          return (
            `<div class="flex items-center justify-center min-w-0 text-white font-semibold" ` +
              `style="flex:${segment.count};background-color:${backgroundColor}" ` +
              `title="${this.escapeHtml(title)}">` +
              labelHtml +
            `</div>`
          );
        })
        .join("");

      return (
        `<div class="flex h-6 w-full rounded overflow-hidden" role="img" ` +
          `aria-label="${this.escapeHtml(ariaLabel)}">` +
          segmentHtml +
        `</div>`
      );
    }
















              `<td class="px-4 py-2 text-sm text-gray-600">${stand}</td>` +
              `<td class="px-4 py-2 text-sm w-full">${statusCell}</td>` +

















html
  <div class="relative overflow-x-auto overflow-y-visible border border-gray-200 rounded-lg"
       data-reports-table-wrapper>
    <table class="min-w-full w-full table-fixed divide-y divide-gray-200">
      <colgroup>
        <col />
        <col />
        <col />
        <col />
        <col class="w-1/3" />
      </colgroup>




                <button type="button"
                        class="flex-1 rounded-md bg-blue-600 px-3 py-2 text-xs font-semibold text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500"
                        data-filter-apply>Применить</button>
              </div>
            </div>
          </th>
          <th class="px-4 py-2 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">Статус</th>