function displayTable()

in assets/ml-metrics.js [317:380]


function displayTable() {
  const table = document.querySelector('#summary-table tbody');
  table.innerHTML='';

  window.suites.forEach(suite => {
    const testslength = suite.tests.length;
    let isFirstSuiteRow = true;

    suite.tests.forEach(test => {
      const row = document.createElement('tr');

      if (isFirstSuiteRow) {
        row.style.borderTop = '2px solid #ddd';
      }

      const filteredData = window.data.filter(row => row.suite == suite.name && row.test == test.name && row.platform == platformStatus);
      const firefoxAvg_latest = calculate_average(filteredData, 0);
      const firefoxAvg_1wk_ago = calculate_average(filteredData, 7);
      const firefoxAvg_4wk_ago = calculate_average(filteredData, 28);

      const difference_1wk = ((firefoxAvg_latest - firefoxAvg_1wk_ago) / firefoxAvg_latest) * 100;
      const difference_4wk = ((firefoxAvg_latest - firefoxAvg_4wk_ago) / firefoxAvg_latest) * 100;

      let class_1wk = "";
      if (difference_1wk < -5) {
        class_1wk = 'positive-difference';
      } else if (difference_1wk > 5) {
        class_1wk = 'negative-difference';
      }

      let class_4wk = "";
      if (difference_4wk < -5) {
        class_4wk = 'positive-difference';
      } else if (difference_4wk > 5) {
        class_4wk = 'negative-difference';
      }

      // Build row HTML
      row.innerHTML = `
        ${isFirstSuiteRow ? `<td rowspan="${testslength}">${suite.name}</td>` : ''}
        <td class="test-cell ${class_1wk}">${test.name} (${test.unit})</td>
        <td class="${class_1wk}" style="border-left: 1px solid #ddd;">${firefoxAvg_latest.toFixed(2)}</td>
        <td class="${class_1wk}" style="border-left: 1px solid #ddd;">${firefoxAvg_1wk_ago.toFixed(2)}</td>
        <td class="${class_1wk}">${difference_1wk.toFixed(2)}</td>
        <td class="${class_4wk}" style="border-left: 1px solid #ddd;">${firefoxAvg_4wk_ago.toFixed(2)}</td>
        <td class="${class_4wk}">${difference_4wk.toFixed(2)}</td>
      `;

      // Add click handler for the entire row (excluding suite cell)
      row.addEventListener('click', (event) => {
        // Exclude clicks on the suite cell
        const suiteCell = isFirstSuiteRow ? row.querySelector('td[rowspan]') : null;
        if (suiteCell && suiteCell.contains(event.target)) {
          return;
        }
        // Navigate to the corresponding test section
        window.location.hash = `${suite.name}-${test.name}-section`;
      });

      isFirstSuiteRow = false;
      table.appendChild(row);
    });
  });
}