test_frontend.py

import os
import pytest
import time
import requests
import uuid
import json

GMT_DIR = os.path.join(os.path.dirname(os.path.abspath(__file__)), '../..')

from lib.global_config import GlobalConfig
from lib.user import User
from lib.db import DB
from lib.encryption import ENCRYPTED_VALUE_PREFIX

from tests import test_functions as Tests
from playwright.sync_api import sync_playwright, TimeoutError as PlaywrightTimeoutError
from datetime import datetime, timedelta

from api.object_specifications import CI_Measurement, CI_MeasurementV3


page = None
context = None
playwright = None
browser = None

API_URL = GlobalConfig().config['cluster']['api_url'] # will be pre-loaded with test-config.yml due to conftest.py

## Shared Playwright setup for all tests
@pytest.fixture(autouse=True, scope='module')
def setup_playwright():
    """Start Playwright once for the entire module"""
    # before
    global playwright #pylint: disable=global-statement
    playwright = sync_playwright().start()

    yield

    # after
    playwright.stop()

# Browser setup for each test
@pytest.fixture(autouse=True)
def setup_browser(setup_playwright): #pylint: disable=unused-argument,redefined-outer-name
    """
    Set up browser for each test
    We must close the browser to clear localStorage
    """
    global page #pylint: disable=global-statement
    global context #pylint: disable=global-statement
    global browser #pylint: disable=global-statement

    browser = playwright.firefox.launch(
        headless=True, # True is default, set to False to use the browser in headful mode
        # slow_mo=50,
    )
    context = browser.new_context(viewport={"width": 1920, "height": 5600})
    page = context.new_page()
    page.set_default_timeout(3_000)

    page.on("pageerror", handle_page_error)

    yield
    page.close()
    context.close()
    browser.close()

def handle_page_error(exception):
    # we really would love to execute page.screenshot() here, but weirdly this leads to the test passing if page is broken ... even a try/except block does not help ...
    raise RuntimeError("JS error occured on page:", exception)


## Fixture for tests that need demo data
@pytest.fixture()
def use_demo_data():
    """Import demo data for standard frontend tests"""
    Tests.import_demo_data()
    yield
    Tests.reset_db()

def insert_demo_run_with_custom_sci_phase_stats():
    run_id = str(uuid.uuid4())
    phases = [
        {"start": 1735933199000000, "name": "[BASELINE]", "hidden": False, "end": 1735933200000000},
        {"start": 1735933200000000, "name": "[RUNTIME]", "hidden": False, "end": 1735933205000000},
        {"start": 1735933200000100, "name": "Hit Generator", "hidden": False, "end": 1735933205000000},
    ]
    usage_scenario = {
        "name": "Custom SCI Demo",
        "author": "Tests",
        "description": "demo",
        "custom_metrics": {
            "custom_my_coolness": {"unit": "gigacools"},
            "custom_hits": {"unit": "Hits", "sci": True},
        },
    }

    DB().query(
        """
        INSERT INTO runs ("id","name","uri","branch","commit_hash","usage_scenario","usage_scenario_variables","filename","machine_id","user_id","failed","logs","phases","created_at","updated_at")
        VALUES (%s,%s,%s,%s,%s,%s,%s,%s,%s,%s,%s,%s,%s,NOW(),NOW())
        """,
        params=(
            run_id,
            'Custom SCI Demo Run',
            '/demo/custom-sci',
            'main',
            'deadbeef123456789abcdef',
            json.dumps(usage_scenario),
            json.dumps({}),
            'tests/data/usage_scenarios/stress_custom_metrics.yml',
            1,
            1,
            False,
            json.dumps({}),
            json.dumps(phases),
        ),
    )

    DB().query(
        """
        INSERT INTO phase_stats ("run_id","metric","detail_name","phase","value","type","max_value","min_value","sampling_rate_avg","sampling_rate_max","sampling_rate_95p","unit","hidden","created_at","updated_at")
        VALUES
        (%s,E'phase_time_syscall_system',E'[SYSTEM]',E'000_[BASELINE]',1000000,E'TOTAL',NULL,NULL,NULL,NULL,NULL,E'us',FALSE,NOW(),NULL),
        (%s,E'embodied_carbon_share_machine',E'[SYSTEM]',E'000_[BASELINE]',10000,E'TOTAL',NULL,NULL,NULL,NULL,NULL,E'ug',FALSE,NOW(),NULL),
        (%s,E'phase_time_syscall_system',E'[SYSTEM]',E'001_Hit Generator',5000000,E'TOTAL',NULL,NULL,NULL,NULL,NULL,E'us',FALSE,NOW(),NULL),
        (%s,E'custom_hits',E'test-container',E'001_Hit Generator',1000,E'TOTAL',1000,1000,100000,100000,100000,E'Hits',FALSE,NOW(),NULL),
        (%s,E'custom_hits_sci_global',E'test-container',E'001_Hit Generator',120000,E'TOTAL',NULL,NULL,NULL,NULL,NULL,E'ugCO2e/Hits',FALSE,NOW(),NULL),
        (%s,E'custom_my_coolness',E'test-container',E'001_Hit Generator',42,E'TOTAL',42,42,100000,100000,100000,E'gigacools',FALSE,NOW(),NULL),
        (%s,E'phase_time_syscall_system',E'[SYSTEM]',E'002_[RUNTIME]',5000000,E'TOTAL',NULL,NULL,NULL,NULL,NULL,E'us',FALSE,NOW(),NULL),
        (%s,E'custom_hits',E'test-container',E'002_[RUNTIME]',1000,E'TOTAL',1000,1000,100000,100000,100000,E'Hits',FALSE,NOW(),NULL),
        (%s,E'custom_hits_sci_global',E'test-container',E'002_[RUNTIME]',120000,E'TOTAL',NULL,NULL,NULL,NULL,NULL,E'ugCO2e/Hits',FALSE,NOW(),NULL),
        (%s,E'custom_my_coolness',E'test-container',E'002_[RUNTIME]',42,E'TOTAL',42,42,100000,100000,100000,E'gigacools',FALSE,NOW(),NULL)
        """,
        params=(run_id, run_id, run_id, run_id, run_id, run_id, run_id, run_id, run_id, run_id),
    )

    return run_id

def insert_demo_run_with_component_carbon_phase_stats():
    # Mirrors a run where the carbon post-processing has created operational carbon values
    # not only for the machine, but for all energy components (CPU, DRAM, ...) as well.
    run_id = str(uuid.uuid4())
    phases = [
        {"start": 1735933199000000, "name": "[BASELINE]", "hidden": False, "end": 1735933200000000},
        {"start": 1735933200000000, "name": "[RUNTIME]", "hidden": False, "end": 1735933205000000},
        {"start": 1735933200000100, "name": "Hit Generator", "hidden": False, "end": 1735933205000000},
    ]
    usage_scenario = {
        "name": "Component Carbon Demo",
        "author": "Tests",
        "description": "demo",
    }

    DB().query(
        """
        INSERT INTO runs ("id","name","uri","branch","commit_hash","usage_scenario","usage_scenario_variables","filename","machine_id","user_id","failed","logs","phases","created_at","updated_at")
        VALUES (%s,%s,%s,%s,%s,%s,%s,%s,%s,%s,%s,%s,%s,NOW(),NOW())
        """,
        params=(
            run_id,
            'Component Carbon Demo Run',
            '/demo/component-carbon',
            'main',
            'deadbeef123456789abcdef',
            json.dumps(usage_scenario),
            json.dumps({}),
            'tests/data/usage_scenarios/stress_application.yml',
            1,
            1,
            False,
            json.dumps({}),
            json.dumps(phases),
        ),
    )

    DB().query(
        """
        INSERT INTO phase_stats ("run_id","metric","detail_name","phase","value","type","max_value","min_value","sampling_rate_avg","sampling_rate_max","sampling_rate_95p","unit","hidden","created_at","updated_at")
        VALUES
        (%s,E'phase_time_syscall_system',E'[SYSTEM]',E'000_[BASELINE]',1000000,E'TOTAL',NULL,NULL,NULL,NULL,NULL,E'us',FALSE,NOW(),NULL),
        (%s,E'phase_time_syscall_system',E'[SYSTEM]',E'001_Hit Generator',5000000,E'TOTAL',NULL,NULL,NULL,NULL,NULL,E'us',FALSE,NOW(),NULL),
        (%s,E'cpu_carbon_rapl_msr_component',E'Package_0',E'001_Hit Generator',2500000,E'TOTAL',NULL,NULL,NULL,NULL,NULL,E'ugCO2e',FALSE,NOW(),NULL),
        (%s,E'memory_carbon_rapl_msr_component',E'Package_0',E'001_Hit Generator',1500000,E'TOTAL',NULL,NULL,NULL,NULL,NULL,E'ugCO2e',FALSE,NOW(),NULL),
        (%s,E'phase_time_syscall_system',E'[SYSTEM]',E'002_[RUNTIME]',5000000,E'TOTAL',NULL,NULL,NULL,NULL,NULL,E'us',FALSE,NOW(),NULL),
        (%s,E'cpu_carbon_rapl_msr_component',E'Package_0',E'002_[RUNTIME]',2500000,E'TOTAL',NULL,NULL,NULL,NULL,NULL,E'ugCO2e',FALSE,NOW(),NULL),
        (%s,E'memory_carbon_rapl_msr_component',E'Package_0',E'002_[RUNTIME]',1500000,E'TOTAL',NULL,NULL,NULL,NULL,NULL,E'ugCO2e',FALSE,NOW(),NULL)
        """,
        params=(run_id, run_id, run_id, run_id, run_id, run_id, run_id),
    )

    return run_id

@pytest.mark.usefixtures('use_demo_data')
class TestFrontendFunctionality:
    """Functional frontend tests"""

    def test_home(self):
        page.goto(GlobalConfig().config['cluster']['metrics_url'] + '/index.html')
        value = page.locator("div.ui.cards.link > div.ui.card:nth-child(1) a.header").text_content()

        assert value== 'ScenarioRunner'

        value = page.locator("#scenario-runner-count").text_content()
        assert value== '8'

        page.goto(GlobalConfig().config['cluster']['metrics_url'] + '/index.html')
        value = page.locator("div.ui.cards.link > div.ui.card:nth-child(2) a.header").text_content()

        assert value== 'Eco CI'


    def test_runs(self):
        page.goto(GlobalConfig().config['cluster']['metrics_url'] + '/runs.html')
        page.locator("#menu").get_by_role("link", name="Runs / Repos", exact=True).click()

        value = page.locator("#runs-and-repos-table > tbody tr:nth-child(3) > td:nth-child(1) > a").text_content()

        assert value== 'Stress Test #2'


    def test_eco_ci_demo_data(self):
        page.goto(GlobalConfig().config['cluster']['metrics_url'] + '/index.html')
        page.locator("#menu").get_by_role("link", name="Eco CI", exact=True).click()

        page.wait_for_load_state("load") # ALL JS should be done

        page.locator("#ci-repositories-table > tbody > tr:nth-child(1) > td > div > div.title").click()
        page.locator('#DataTables_Table_0 > tbody > tr  > td:first-child > a').click()

        page.wait_for_load_state("load") # ALL JS should be done

        page.locator("input[name=range_start]").fill('2024-09-11')
        page.locator("input[name=range_end]").fill('2024-10-11')
        page.get_by_role("button", name="Refresh").click()

        time.sleep(2) # wait for new data to render

        energy_avg_all_steps = page.locator("#label-stats-table-avg > tr:nth-child(1) > td:nth-child(2)").text_content()
        assert energy_avg_all_steps.strip() == '28.60 J (± 3.30%)'

        time_avg_all_steps = page.locator("#label-stats-table-avg > tr:nth-child(1) > td:nth-child(3)").text_content()
        assert time_avg_all_steps.strip() == '12.80 s (± 3.49%)'

        cpu_avg_all_steps = page.locator("#label-stats-table-avg > tr:nth-child(1) > td:nth-child(4)").text_content()
        assert cpu_avg_all_steps.strip() == '44.73% (± 10.65%%)'

        grid_all_steps = page.locator("#label-stats-table-avg > tr:nth-child(1) > td:nth-child(5)").text_content()
        assert grid_all_steps.strip() == '494.20 gCO2/kWh (± 5.47%)'

        carbon_all_steps = page.locator("#label-stats-table-avg > tr:nth-child(1) > td:nth-child(6)").text_content()
        assert carbon_all_steps.strip() == '0.016 gCO2e (± 5.71%)'

        count_all_steps = page.locator("#label-stats-table-avg > tr:nth-child(1) > td:nth-child(7)").text_content()
        assert count_all_steps.strip() == '5'

        energy_avg_single = page.locator("#label-stats-table-avg > tr:nth-child(2) > td:nth-child(2)").text_content()
        assert energy_avg_single.strip() == '24.14 J (± 1.88%)'

        time_avg_single = page.locator("#label-stats-table-avg > tr:nth-child(2) > td:nth-child(3)").text_content()
        assert time_avg_single.strip() == '10.00 s (± 0.00%)'

        cpu_avg_single = page.locator("#label-stats-table-avg > tr:nth-child(2) > td:nth-child(4)").text_content()
        assert cpu_avg_single.strip() == '49.60% (± 5.06%%)'

        grid_single = page.locator("#label-stats-table-avg > tr:nth-child(2) > td:nth-child(5)").text_content()
        assert grid_single.strip() == '494.20 gCO2/kWh (± 5.47%)'

        carbon_single = page.locator("#label-stats-table-avg > tr:nth-child(2) > td:nth-child(6)").text_content()
        assert carbon_single.strip() == '0.0134 gCO2e (± 5.27%)'

        count_single = page.locator("#label-stats-table-avg > tr:nth-child(2) > td:nth-child(7)").text_content()
        assert count_single.strip() == '5'

    def open_and_assert_ci_stats(self):
        page.goto(GlobalConfig().config['cluster']['metrics_url'] + '/index.html')
        page.locator("#menu").get_by_role("link", name="Eco CI", exact=True).click()

        page.locator("#ci-repositories-table > tbody > tr:nth-child(1) > td > div > div.title").click()
        page.locator('#DataTables_Table_0 > tbody > tr  > td:first-child > a').click()

        page.wait_for_load_state("load")

        energy_avg_all_steps = page.locator(
            "#label-stats-table-avg > tr:nth-child(1) > td:nth-child(2)"
        ).text_content()
        assert energy_avg_all_steps.strip() == '78.00 J (± 0.00%)'

        carbon_all_steps = page.locator(
            "#label-stats-table-avg > tr:nth-child(1) > td:nth-child(6)"
        ).text_content()
        assert carbon_all_steps.strip() == '0.9704 gCO2e (± 0.00%)'

        carbon_all_steps = page.locator(
            "#label-stats-table-avg > tr:nth-child(1) > td:nth-child(3)"
        ).text_content()
        assert carbon_all_steps.strip() == '0.11 s (± 0.00%)'

    def test_eco_ci_adding_data(self):
        for index in range(1,4):
            measurement = CI_Measurement(energy_uj=(13_000_000*index),
                        repo='testRepo',
                        branch='testBranch',
                        cpu='testCPU',
                        cpu_util_avg=50,
                        commit_hash='1234asdf',
                        workflow='testWorkflow',
                        run_id='testRunID',
                        source='testSource',
                        label='testLabel',
                        duration_us=35323,
                        workflow_name='testWorkflowName',
                        lat="18.2972",
                        lon="77.2793",
                        city="Nine Mile",
                        carbon_intensity_g=100,
                        carbon_ug=323456
            )
            response = requests.post(f"{API_URL}/v2/ci/measurement/add", json=measurement.model_dump(), timeout=15)
            assert response.status_code == 202, Tests.assertion_info('success', response.text)
        self.open_and_assert_ci_stats()

    def test_eco_ci_adding_data_v3(self):
        for index in range(1, 4):
            measurement = CI_MeasurementV3(energy_uj=(13_000_000 * index),
                                           repo='testRepo',
                                           branch='testBranch',
                                           cpu='testCPU',
                                           cpu_util_avg=50,
                                           commit_hash='1234asdf',
                                           workflow='testWorkflow',
                                           run_id='testRunID',
                                           source='testSource',
                                           label='testLabel',
                                           duration_us=35323,
                                           workflow_name='testWorkflowName',
                                           lat="18.2972",
                                           lon="77.2793",
                                           city="Nine Mile",
                                           carbon_intensity_g=100,
                                           carbon_ug=323456,
                                           os_name='Linux',
                                           cpu_arch='x86_64',
                                           job_id='testJobID',
                                           version='v1.2'
                                           )
            response = requests.post(f"{API_URL}/v3/ci/measurement/add", json=measurement.model_dump(), timeout=15)
            assert response.status_code == 202, Tests.assertion_info('success', response.text)
        self.open_and_assert_ci_stats()


    def test_stats(self):

        page.goto(GlobalConfig().config['cluster']['metrics_url'] + '/index.html')

        page.locator("#menu").get_by_role("link", name="Runs / Repos", exact=True).click()

        with context.expect_page() as new_page_info:
            page.get_by_role("link", name="Stress Test #1", exact=True).click()

        # Get the new page (tab)
        new_page = new_page_info.value
        new_page.set_default_timeout(3_000)

        new_page.wait_for_load_state("networkidle")

        assert new_page.locator("#runtime-hidden-info").is_hidden() is True
        assert new_page.locator("#run-failed").is_hidden() is True
        assert new_page.locator("#run-warnings").is_hidden() is True


        # open details
        new_page.locator('a.step[data-tab="[RUNTIME]"]').click()
        new_page.locator('#runtime-steps phase-metrics .ui.accordion .title > a').first.click()

        machine_energy_value = new_page.locator('#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.segment div.ui.tab[data-tab="energy"] div.ui.blue.card.machine-energy > div.extra.content span.value.bold').text_content()
        phase_duration = new_page.locator('#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.segment div.ui.teal.card.runtime > div.extra.content span.value.bold').text_content()
        cpu_package_power = new_page.locator('#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.segment div.ui.tab[data-tab="power"] div.ui.orange.card.cpu-power > div.extra.content span.value.bold').text_content()
        embodied_carbon = new_page.locator('#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.segment div.ui.teal.card.embodied-carbon > div.extra.content span.value.bold').text_content()
        network_traffic = new_page.locator('#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.segment div.ui.teal.card.network-traffic > div.extra.content span.value.bold').text_content()
        network_data = new_page.locator('#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.segment div.ui.teal.card.network-data > div.extra.content span.value.bold').text_content()

        assert machine_energy_value.strip() == '21.14'
        assert phase_duration.strip() == '5.20'
        assert cpu_package_power.strip() == '8.66'
        assert embodied_carbon.strip() == '0.01'
        assert network_traffic.strip() == '0.37'
        assert network_data.strip() == '0.07'

        # fetch time series
        new_page.locator('button#fetch-time-series').click()

        # expand charts
        new_page.locator('div#chart-container .statistics-chart-card button.toggle-width')
        for el in new_page.locator('div#chart-container .statistics-chart-card button.toggle-width').all():
            el.click()

        chart_label = new_page.locator("#chart-container > div:nth-child(3) > div > div.ui.left.floated.chart-title").text_content()
        assert chart_label.strip() == 'CPU % via procfs'

        table = new_page.locator(
            "#runtime-steps > div.ui.bottom.attached.active.tab.segment "
            "> div.ui.segment.secondary > phase-metrics "
            "> div.ui.accordion > div.content.active > table > tbody"
        )

        # Phase Duration
        assert cell(table, 1, 1).text_content().strip() == "Phase Duration"
        assert cell(table, 1, 6).text_content().strip() == "5.20"
        assert cell(table, 1, 7).text_content().strip() == "s"
        assert cell(table, 1, 10).text_content().replace(" ", "").strip() == " -/\n-/\n-ms".strip()

        # Network I/O
        assert cell(table, 7, 1).text_content().strip() == "Network I/O"
        assert cell(table, 7, 6).text_content().strip() == "0.07"
        assert cell(table, 7, 6).inner_html().strip() == '<span title="71208 Bytes/s">0.07</span>'
        assert cell(table, 7, 7).text_content().strip() == "MB/s"
        assert cell(table, 7, 4).text_content().strip() == "gcb-alpine-stress"

        # Network Traffic
        assert cell(table, 8, 1).text_content().strip() == "Network Traffic"
        assert cell(table, 8, 4).text_content().strip() == "gcb-alpine-stress"
        assert cell(table, 8, 6).text_content().strip() == "0.37"
        assert cell(table, 8, 6).inner_html().strip() == '<span title="367908 Bytes">0.37</span>'

        # Machine Energy
        assert cell(table, 9, 1).text_content().strip() == "Machine Energy"
        assert cell(table, 9, 6).text_content().strip() == "21.14"
        assert cell(table, 9, 7).text_content().strip() == "mWh"
        assert cell(table, 9, 10).text_content().replace(" ", "").strip() == "99/\n100/\n101ms"

        # Machine Power
        assert cell(table, 10, 1).text_content().strip() == "Machine Power"
        assert cell(table, 10, 6).text_content().strip() == "14.62"
        assert cell(table, 10, 7).text_content().strip() == "W"
        assert cell(table, 10, 10).text_content().replace(" ", "").strip() == "99/\n100/\n101ms"

        # Network Transmission CO₂
        assert cell(table, 13, 1).text_content().strip() == "Network Transmission CO₂"
        assert cell(table, 13, 6).inner_html().strip() == (
            '<span title="425 ug">0.00</span> '
            '<span data-tooltip="Value is lower than rounding. Unrounded value is 425 ug" '
            'data-position="bottom center" data-inverted=""><i class="question circle icon link"></i></span>'
        )
        assert cell(table, 13, 7).text_content().strip() == "g"


        # click on baseline
        new_page.locator('a.step[data-tab="[BASELINE]"]').click()
        new_page.locator('div[data-tab="[BASELINE]"] .ui.accordion .title > a').click()

        first_metric = new_page.locator("#main > div.ui.tab.attached.segment.secondary.active > phase-metrics > div.ui.accordion > div.content.active > table > tbody > tr:nth-child(8) > td:nth-child(1)").text_content()
        assert first_metric.strip() == 'Machine CO₂ (embodied)'

        first_value = new_page.locator("#main > div.ui.tab.attached.segment.secondary.active > phase-metrics > div.ui.accordion > div.content.active > table > tbody > tr:nth-child(8) > td:nth-child(6)").text_content()
        assert first_value.strip() == '0.01'

        first_unit = new_page.locator("#main > div.ui.tab.attached.segment.secondary.active > phase-metrics > div.ui.accordion > div.content.active > table > tbody > tr:nth-child(8) > td:nth-child(7)").text_content()
        assert first_unit.strip() == 'g'

    def test_stats_multi_network(self):

        page.goto(GlobalConfig().config['cluster']['metrics_url'] + '/index.html')

        page.locator("#menu").get_by_role("link", name="Runs / Repos", exact=True).click()

        with context.expect_page() as new_page_info:
            page.get_by_role("link", name="Stress Test #1 - Copy with additional network - Phase Stats Stub only no metrics").click()

        # Get the new page (tab)
        new_page = new_page_info.value
        new_page.set_default_timeout(3_000)

        new_page.wait_for_load_state("networkidle")

        assert new_page.locator("#runtime-hidden-info").is_hidden() is True
        assert new_page.locator("#run-failed").is_hidden() is True
        assert new_page.locator("#run-warnings").is_hidden() is True

        # open details
        new_page.locator('a.step[data-tab="[RUNTIME]"]').click()
        new_page.locator('#runtime-steps phase-metrics .ui.accordion .title > a').first.click()

        machine_energy_value = new_page.locator('#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.segment div.ui.tab[data-tab="energy"] div.ui.blue.card.machine-energy > div.extra.content span.value.bold').text_content()
        phase_duration = new_page.locator('#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.segment div.ui.teal.card.runtime > div.extra.content span.value.bold').text_content()
        cpu_package_power = new_page.locator('#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.segment div.ui.tab[data-tab="power"] div.ui.orange.card.cpu-power > div.extra.content span.value.bold').text_content()
        embodied_carbon = new_page.locator('#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.segment div.ui.teal.card.embodied-carbon > div.extra.content span.value.bold').text_content()
        network_traffic_node = new_page.locator('#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.segment div.ui.teal.card.network-traffic > div.extra.content span.value.bold')
        network_data_node = new_page.locator('#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.segment div.ui.teal.card.network-data > div.extra.content span.value.bold')

        assert machine_energy_value.strip() == '21.14'
        assert phase_duration.strip() == '5.20'
        assert cpu_package_power.strip() == '8.66'
        assert embodied_carbon.strip() == '0.01'
        assert network_traffic_node.inner_html().strip() == '0.41 (<i class="window restore outline icon" title="This is an aggregate value based on multiple sources. Please check metrics table for individual values."></i>)'
        assert network_data_node.inner_html().strip() == '0.16 (<i class="window restore outline icon" title="This is an aggregate value based on multiple sources. Please check metrics table for individual values."></i>)'

        table = new_page.locator(
            "#runtime-steps > div.ui.bottom.attached.active.tab.segment "
            "> div.ui.segment.secondary > phase-metrics "
            "> div.ui.accordion > div.content.active > table > tbody"
        )



        # Phase Duration
        assert cell(table, 1, 1).text_content().strip() == "Phase Duration"
        assert cell(table, 1, 6).text_content().strip() == "5.20"
        assert cell(table, 1, 7).text_content().strip() == "s"
        assert cell(table, 1, 10).text_content().replace(" ", "").strip() == " -/\n-/\n-ms".strip()

        # Network I/O
        assert cell(table, 7, 1).text_content().strip() == "Network I/O"
        assert cell(table, 7, 6).text_content().strip() == "0.07"
        assert cell(table, 7, 6).inner_html().strip() == '<span title="71208 Bytes/s">0.07</span>'
        assert cell(table, 7, 7).text_content().strip() == "MB/s"
        assert cell(table, 7, 4).text_content().strip() == "gcb-alpine-stress"
        # Network Traffic
        assert cell(table, 9, 1).text_content().strip() == "Network Traffic"
        assert cell(table, 9, 4).text_content().strip() == "gcb-alpine-stress"
        assert cell(table, 9, 6).text_content().strip() == "0.37"
        assert cell(table, 9, 6).inner_html().strip() == '<span title="367908 Bytes">0.37</span>'

        # Network Traffic
        assert cell(table, 10, 1).text_content().strip() == "Network Traffic"
        assert cell(table, 10, 4).text_content().strip() == "gcb-inserted-test"
        assert cell(table, 10, 6).text_content().strip() == "0.04"
        assert cell(table, 10, 6).inner_html().strip() == '<span title="41231 Bytes">0.04</span>'

        # Machine Energy
        assert cell(table, 11, 1).text_content().strip() == "Machine Energy"
        assert cell(table, 11, 6).text_content().strip() == "21.14"
        assert cell(table, 11, 7).text_content().strip() == "mWh"
        assert cell(table, 11, 10).text_content().replace(" ", "").strip() == "99/\n100/\n101ms"

        # Machine Power
        assert cell(table, 12, 1).text_content().strip() == "Machine Power"
        assert cell(table, 12, 6).text_content().strip() == "14.62"
        assert cell(table, 12, 7).text_content().strip() == "W"
        assert cell(table, 12, 10).text_content().replace(" ", "").strip() == "99/\n100/\n101ms"

        # Network Transmission CO₂
        assert cell(table, 15, 1).text_content().strip() == "Network Transmission CO₂"
        assert cell(table, 15, 6).inner_html().strip() == (
            '<span title="425 ug">0.00</span> '
            '<span data-tooltip="Value is lower than rounding. Unrounded value is 425 ug" '
            'data-position="bottom center" data-inverted=""><i class="question circle icon link"></i></span>'
        )
        assert cell(table, 15, 7).text_content().strip() == "g"

    def test_stats_hidden_run(self):

        page.goto(GlobalConfig().config['cluster']['metrics_url'] + '/index.html')

        page.locator("#menu").get_by_role("link", name="Runs / Repos", exact=True).click()

        with context.expect_page() as new_page_info:
            page.get_by_role("link", name="Hidden Phase Run").click()


        new_page = new_page_info.value
        new_page.set_default_timeout(3_000)

        new_page.wait_for_load_state("networkidle")

        assert new_page.locator("#runtime-hidden-info").is_hidden() is False
        assert new_page.locator("#run-failed").is_hidden() is True
        assert new_page.locator("#run-warnings").is_hidden() is True

        assert new_page.locator('#runtime-sub-phases > .item.runtime-step.hidden-phase-tab[data-tab="I am a hidden phase"]').inner_html() == '<i class="low vision icon"></i> <span class="hidden-phase-name hidden">I am a hidden phase</span>'

        new_page.locator('#runtime-sub-phases > .item.runtime-step.hidden-phase-tab[data-tab="I am a hidden phase"]').click()

        assert new_page.locator('#runtime-sub-phases > .item.runtime-step.hidden-phase-tab[data-tab="I am a hidden phase"]').inner_html() == '<i class="low vision icon"></i> <span class="hidden-phase-name">I am a hidden phase</span>'

        assert new_page.locator('#runtime-hidden-info').is_hidden() is True # bc moved to other tab through click

    def test_compare_with_hidden_phases(self):

        page.goto(GlobalConfig().config['cluster']['metrics_url'] + '/index.html')
        page.locator("#menu").get_by_role("link", name="Runs / Repos", exact=True).click()

        page.locator("#DataTables_Table_0 input[type=checkbox]").first.wait_for(timeout=5000) # wait for accordion to fetch XHR and display first checkboxes. otherwise query_selector_all might be empty

        elements = page.query_selector_all("input[type=checkbox]")
        elements[0].click()
        elements[1].click()

        with context.expect_page() as new_page_info:
            page.locator('#compare-button').click() # will do usage-scenario-variables comparison

        new_page = new_page_info.value
        new_page.set_default_timeout(3_000)

        new_page.wait_for_load_state("networkidle")

        assert new_page.locator('#runtime-hidden-info').is_hidden() is False # bc moved to other tab through click

        assert new_page.locator('#runtime-sub-phases > .item.runtime-step.hidden-phase-tab[data-tab="I am a hidden phase"]').inner_html() == '<i class="low vision icon"></i> <span class="hidden-phase-name hidden">I am a hidden phase</span>'

        new_page.locator('#runtime-sub-phases > .item.runtime-step.hidden-phase-tab[data-tab="I am a hidden phase"]').click()

        assert new_page.locator('#runtime-sub-phases > .item.runtime-step.hidden-phase-tab[data-tab="I am a hidden phase"]').inner_html() == '<i class="low vision icon"></i> <span class="hidden-phase-name">I am a hidden phase</span>'

        assert new_page.locator('#runtime-hidden-info').is_hidden() is True # bc moved to other tab through click

    def test_stats_custom_metric_sci(self):
        run_id = insert_demo_run_with_custom_sci_phase_stats()

        stats_url = f"{GlobalConfig().config['cluster']['metrics_url']}/stats.html?id={run_id}"
        page.goto(stats_url)
        page.wait_for_load_state("networkidle")

        page.locator('a.step[data-tab="[RUNTIME]"]').click()
        page.locator('#runtime-steps phase-metrics .ui.accordion .title > a').first.click()

        sci_card = page.locator('div.green.card.custom-metric-custom_hits_sci_global')
        assert sci_card.locator('.metric-name').text_content() == 'Hits (SCI)'
        assert sci_card.locator('.value.bold').text_content().strip() == '0.12'
        assert sci_card.locator('.si-unit').text_content().strip() == 'gCO2e/Hits'
        assert sci_card.locator('.source').text_content().strip() == 'via User supplied'

        sci_table_row = page.locator('table.compare-metrics-table tbody tr', has_text='Hits (SCI)').first
        assert sci_table_row.locator('td:nth-child(6)').text_content().strip() == '0.12'
        assert sci_table_row.locator('td:nth-child(7)').text_content().strip() == 'gCO2e/Hits'

    def test_stats_component_carbon(self):
        # Verifies that operational carbon values are shown in the frontend not only for the
        # machine, but for the individual energy components (CPU, DRAM, ...) as well.
        run_id = insert_demo_run_with_component_carbon_phase_stats()

        stats_url = f"{GlobalConfig().config['cluster']['metrics_url']}/stats.html?id={run_id}"
        page.goto(stats_url)
        page.wait_for_load_state("networkidle")

        page.locator('a.step[data-tab="[RUNTIME]"]').click()
        page.locator('#runtime-steps phase-metrics .ui.accordion .title > a').first.click()

        # active runtime sub-phase ("Hit Generator") segment
        runtime_segment = '#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics'

        # CO₂ key-metric cards
        cpu_co2_card = page.locator(f'{runtime_segment} div.ui.tab[data-tab="co2"] div.ui.black.card.cpu-co2')
        assert cpu_co2_card.locator('.metric-name').text_content().strip() == 'CPU Package CO₂ (operational)'
        assert cpu_co2_card.locator('.value.bold').text_content().strip() == '2.50'
        assert cpu_co2_card.locator('.si-unit').text_content().strip() == 'gCO2e'
        assert cpu_co2_card.locator('.source').text_content().strip() == 'via Formula (RAPL)'

        dram_co2_card = page.locator(f'{runtime_segment} div.ui.tab[data-tab="co2"] div.ui.black.card.dram-co2')
        assert dram_co2_card.locator('.metric-name').text_content().strip() == 'DRAM CO₂ (operational)'
        assert dram_co2_card.locator('.value.bold').text_content().strip() == '1.50'
        assert dram_co2_card.locator('.si-unit').text_content().strip() == 'gCO2e'
        assert dram_co2_card.locator('.source').text_content().strip() == 'via RAPL'

        # detailed metrics table rows
        table = page.locator(f'{runtime_segment} table.compare-metrics-table')

        cpu_row = table.locator('tbody tr', has_text='CPU Package CO₂ (operational)').first
        assert cpu_row.locator('td:nth-child(6)').text_content().strip() == '2.50'
        assert cpu_row.locator('td:nth-child(7)').text_content().strip() == 'gCO2e'

        dram_row = table.locator('tbody tr', has_text='DRAM CO₂ (operational)').first
        assert dram_row.locator('td:nth-child(6)').text_content().strip() == '1.50'
        assert dram_row.locator('td:nth-child(7)').text_content().strip() == 'gCO2e'


    def test_repositories_and_compare_with_diff(self):

        page.goto(GlobalConfig().config['cluster']['metrics_url'] + '/index.html')
        page.locator("#menu").get_by_role("link", name="Runs / Repos", exact=True).click()

        page.locator("#DataTables_Table_0 input[type=checkbox]").first.wait_for(timeout=5000) # wait for accordion to fetch XHR and display first checkboxes. otherwise query_selector_all might be empty

        elements = page.query_selector_all("input[type=checkbox]")
        elements[1].click()
        elements[6].click()

        with context.expect_page() as new_page_info:
            page.locator('#compare-button').click() # will do usage-scenario-variables comparison

        new_page = new_page_info.value
        new_page.set_default_timeout(3_000)

        new_page.locator('#runtime-steps phase-metrics .ui.accordion .title > a').first.click()

        # compare key metrics
        machine_energy_value = new_page.locator('#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.segment div.ui.tab[data-tab="energy"] div.ui.blue.card.machine-energy > div.extra.content span.value.bold').text_content()
        phase_duration = new_page.locator('#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.segment div.ui.teal.card.runtime > div.extra.content span.value.bold').text_content()
        cpu_package_power = new_page.locator('#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.segment div.ui.tab[data-tab="power"] div.ui.orange.card.cpu-power > div.extra.content span.value.bold').text_content()
        embodied_carbon = new_page.locator('#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.segment div.ui.teal.card.embodied-carbon > div.extra.content span.value.bold').text_content()
        network_traffic = new_page.locator('#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.segment div.ui.teal.card.network-traffic > div.extra.content span.value.bold').text_content()
        network_data = new_page.locator('#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.segment div.ui.teal.card.network-data > div.extra.content span.value.bold').text_content()

        assert machine_energy_value.strip() == '+ 8.19 %'
        assert phase_duration.strip() == '+ 4.80 %'
        assert cpu_package_power.strip() == '+ 4.99 %'
        assert embodied_carbon.strip() == '+ 4.80 %'
        assert network_traffic.strip() == 'Not comparable ()'
        assert network_data.strip() == 'Not comparable ()'

        table = new_page.locator(
            "#runtime-steps > div.ui.bottom.attached.active.tab.segment "
            "> div.ui.segment.secondary > phase-metrics "
            "> div.ui.accordion > div.content.active > table > tbody"
        )


        # --- Phase Duration (row 1) ---
        first_metric = cell(table, 1, 1)
        assert first_metric.text_content().strip() == "Phase Duration"
        assert first_metric.inner_html().strip() == '<i class="question circle icon"></i>Phase Duration'

        first_value = cell(table, 1, 6)
        assert first_value.text_content().strip() == "5.06"
        assert first_value.inner_html().strip() == '<span title="5064843 us">5.06</span>'

        assert cell(table, 1, 8).inner_html().strip() == "s"
        assert cell(table, 1, 9).inner_html().strip() == "+ 4.80 %"

        # --- Network Traffic (row 9) ---
        assert cell(table, 9, 1).text_content().strip() == "Network Traffic"
        assert cell(table, 9, 4).text_content().strip() == "gcb-alpine-stress"
        assert cell(table, 9, 6).text_content().strip() == "0.35"
        assert cell(table, 9, 7).text_content().strip() == "0.39"
        assert cell(table, 9, 8).text_content().strip() == "MB"
        assert cell(table, 9, 9).text_content().strip() == "+ 8.94 %"


        # --- Network Traffic (row 10) ---
        assert cell(table, 10, 1).text_content().strip() == "Network Traffic"
        assert cell(table, 10, 4).text_content().strip() == "gcb-inserted-test"
        assert cell(table, 10, 6).text_content().strip() == "0.04"
        assert cell(table, 10, 7).text_content().strip() == "undefined"
        assert cell(table, 10, 8).text_content().strip() == "MB"
        assert cell(table, 10, 9).text_content().strip() == "not comparable %"

        # --- Machine Energy (row 11) ---
        assert cell(table, 11, 1).text_content().strip() == "Machine Energy"
        assert cell(table, 11, 6).text_content().strip() == "20.16"
        assert cell(table, 11, 7).text_content().strip() == "21.81"
        assert cell(table, 11, 8).text_content().strip() == "mWh"
        assert cell(table, 11, 9).text_content().strip() == "+ 8.19 %"


        # --- Network Transmission CO₂ (row 15) ---
        assert cell(table, 15, 1).text_content().strip() == "Network Transmission CO₂"

        assert cell(table, 15, 6).inner_html().strip() == (
            '<span title="409 ug">0.00</span> '
            '<span data-tooltip="Value is lower than rounding. Unrounded value is 409 ug" '
            'data-position="bottom center" data-inverted=""><i class="question circle icon link"></i></span>'
        )

        assert cell(table, 15, 7).inner_html().strip() == (
            '<span title="446 ug">0.00</span> '
            '<span data-tooltip="Value is lower than rounding. Unrounded value is 446 ug" '
            'data-position="bottom center" data-inverted=""><i class="question circle icon link"></i></span>'
        )

        assert cell(table, 15, 8).inner_html().strip() == "g"
        assert cell(table, 15, 9).inner_html().strip() == "+ 9.05 %"

    def test_repositories_compare_not_comparable_on_aggregate(self):

        page.goto(GlobalConfig().config['cluster']['metrics_url'] + '/index.html')
        page.locator("#menu").get_by_role("link", name="Runs / Repos", exact=True).click()

        page.locator("#DataTables_Table_0 input[type=checkbox]").first.wait_for(timeout=5000) # wait for accordion to fetch XHR and display first checkboxes. otherwise query_selector_all might be empty

        elements = page.query_selector_all("input[type=checkbox]")
        elements[6].click()
        elements[7].click()

        with context.expect_page() as new_page_info:
            page.locator('#compare-button').click() # will do usage-scenario-variables comparison

        new_page = new_page_info.value
        new_page.set_default_timeout(3_000)

        new_page.locator('#runtime-steps phase-metrics .ui.accordion .title > a').first.click()

        # compare key metrics
        machine_energy_value = new_page.locator('#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.segment div.ui.tab[data-tab="energy"] div.ui.blue.card.machine-energy > div.extra.content span.value.bold').text_content()
        network_traffic = new_page.locator('#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.segment div.ui.teal.card.network-traffic > div.extra.content span.value.bold').inner_html()
        network_data = new_page.locator('#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.segment div.ui.teal.card.network-data > div.extra.content span.value.bold').inner_html()

        assert machine_energy_value.strip() == '-4.62 %'
        assert network_traffic == 'Not comparable (<i class="window restore outline icon" title="This is an aggregate value based on multiple sources. Please check metrics table for individual values."></i>)'
        assert network_data == 'Not comparable (<i class="window restore outline icon" title="This is an aggregate value based on multiple sources. Please check metrics table for individual values."></i>)'


    def test_repositories_and_compare_repeated_run(self):

        page.goto(GlobalConfig().config['cluster']['metrics_url'] + '/index.html')
        page.locator("#menu").get_by_role("link", name="Runs / Repos", exact=True).click()
        page.get_by_role("button", name="Switch to repository view").click()

        page.get_by_text("/home/arne/Sites/green-coding/example-applications/").click()
        page.locator("#DataTables_Table_0 input[type=checkbox]").first.wait_for(timeout=5000) # wait for accordion to fetch XHR and display first checkboxes. otherwise query_selector_all might be empty

        elements = page.query_selector_all("input[type=checkbox]")
        elements[0].click()
        elements[1].click()
        elements[2].click()

        with context.expect_page() as new_page_info:
            page.locator('#compare-button').click()

        new_page = new_page_info.value
        new_page.set_default_timeout(3_000)

        comparison_type = new_page.locator('#run-data-top > tbody:nth-child(1) > tr > td:nth-child(2)').text_content()
        assert comparison_type == 'Repeated Run on same Commit Hash'

        runs_compared = new_page.locator('#run-data-top > tbody:nth-child(2) > tr > td:nth-child(2)').text_content()
        assert runs_compared == '3'

        # open details
        new_page.locator('a.step[data-tab="[RUNTIME]"]').click()
        new_page.locator('#runtime-steps phase-metrics .ui.accordion .title > a').first.click()

        first_metric = new_page.locator("#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.accordion > div.content.active > table > tbody > tr:nth-child(3) > td:nth-child(1)").text_content()
        assert first_metric.strip() == 'CPU Package Power'

        first_type = new_page.locator("#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.accordion > div.content.active > table > tbody > tr:nth-child(3) > td:nth-child(5)")
        assert first_type.text_content().strip() == 'MEAN'

        first_value = new_page.locator("#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.accordion > div.content.active > table > tbody > tr:nth-child(3) > td:nth-child(6)")
        assert first_value.text_content().strip() == '8.64'
        assert first_value.inner_html().strip() == '<span title="8637 mW">8.64</span>'

        first_unit = new_page.locator("#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.accordion > div.content.active > table > tbody > tr:nth-child(3) > td:nth-child(7)").text_content()
        assert first_unit.strip() == 'W'

        first_stddev = new_page.locator("#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.accordion > div.content.active > table > tbody > tr:nth-child(3) > td:nth-child(8)").text_content()
        assert first_stddev.strip() == '± 2.85%'


        assert new_page.locator("#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.accordion > div.content.active > table > tbody > tr:nth-child(13) > td:nth-child(6)").inner_html() == '<span title="435.5 ug">0.00</span> <span data-tooltip="Value is lower than rounding. Unrounded value is 435.5 ug" data-position="bottom center" data-inverted=""><i class="question circle icon link"></i></span>'

        assert new_page.locator("#runtime-steps > div.ui.bottom.attached.active.tab.segment > div.ui.segment.secondary > phase-metrics > div.ui.accordion > div.content.active > table > tbody > tr:nth-child(13) > td:nth-child(8)").inner_html() == '± 3.41%'


        # click on baseline
        new_page.locator('a.step[data-tab="[BASELINE]"]').click()
        new_page.locator('div[data-tab="[BASELINE]"] .ui.accordion a').click()

        first_metric = new_page.locator("#main > div.ui.tab.attached.segment.secondary.active > phase-metrics > div.ui.accordion > div.content.active > table > tbody > tr:nth-child(2) > td:nth-child(1)").text_content()
        assert first_metric.strip() == 'CPU Package Energy'

        first_value = new_page.locator("#main > div.ui.tab.attached.segment.secondary.active > phase-metrics > div.ui.accordion > div.content.active > table > tbody > tr:nth-child(2) > td:nth-child(6)").text_content()
        assert first_value.strip() == '2.62'

        first_unit = new_page.locator("#main > div.ui.tab.attached.segment.secondary.active > phase-metrics > div.ui.accordion > div.content.active > table > tbody > tr:nth-child(2) > td:nth-child(7)").text_content()
        assert first_unit.strip() == 'mWh'

        first_stddev = new_page.locator("#main > div.ui.tab.attached.segment.secondary.active > phase-metrics > div.ui.accordion > div.content.active > table > tbody > tr:nth-child(2) > td:nth-child(8)").text_content()
        assert first_stddev.strip() == '± 3.89%'

        new_page.close()

    def test_expert_compare_mode(self):

        page.goto(GlobalConfig().config['cluster']['metrics_url'] + '/index.html')
        page.wait_for_load_state("load")  # wait JS

        page.locator("#menu").get_by_role("link", name="Runs / Repos", exact=True).click()

        page.locator("#DataTables_Table_0 input[type=checkbox]").first.wait_for(timeout=5000) # wait for accordion to fetch XHR and display first checkboxes. otherwise query_selector_all might be empty

        elements = page.query_selector_all("input[type=checkbox]")
        elements[1].click()
        elements[2].click()
        elements[3].click()
        elements[5].click()

        with context.expect_page() as new_page_info:
            page.locator('#compare-button').click()

        new_page = new_page_info.value
        new_page.set_default_timeout(3_000)

        assert new_page.locator("#run-data-top > tbody:first-child > tr:first-child > td:nth-child(2)").text_content() == 'Usage Scenario'

        new_page.close()


        page.locator('#unselect-button').click()
        elements = page.query_selector_all("input[type=checkbox]")
        elements[1].click()
        elements[2].click()
        elements[3].click()
        elements[5].click()

        page.locator('#compare-force-mode').select_option("Machines")

        with context.expect_page() as new_page_info:
            page.locator('#compare-button').click()

        new_page = new_page_info.value
        new_page.set_default_timeout(3_000)

        assert new_page.locator("#run-data-top > tbody:first-child > tr > td:nth-child(2)").text_content() == 'Machine'

        assert new_page.locator("#run-data-top > tbody:nth-child(2) > tr > td:first-child").text_content() == 'Number of runs compared'

        assert new_page.locator("#run-data-top > tbody:nth-child(2) > tr > td:nth-child(2)").text_content() == '4'

        assert new_page.locator("#run-data-top > tbody:nth-child(3) > tr > td:nth-child(1)").text_content() == 'Machine'

        assert new_page.locator("#run-data-top > tbody:nth-child(3) > tr > td:nth-child(2)").text_content() == 'Development machine for testing'


        new_page.close()


    def test_new_usage_scenario_variables_compare_mode(self):
        page.goto(GlobalConfig().config['cluster']['metrics_url'] + '/index.html')

        page.locator("#menu").get_by_role("link", name="Runs / Repos", exact=True).click()

        page.locator("#DataTables_Table_0 input[type=checkbox]").first.wait_for(timeout=5000) # wait for accordion to fetch XHR and display first checkboxes. otherwise query_selector_all might be empty

        elements = page.query_selector_all("input[type=checkbox]")

        elements[0].click()
        elements[1].click()
        elements[2].click()
        elements[3].click()
        elements[4].click()
        elements[5].click()

        page.locator('#compare-force-mode').select_option('Variables')

        with context.expect_page() as new_page_info:
            page.locator('#compare-button').click()

        new_page = new_page_info.value
        new_page.set_default_timeout(3_000)

        assert new_page.locator("#run-data-top > tbody:first-child > tr:first-child > td:nth-child(2)").text_content() == 'Usage Scenario Variables'

        assert new_page.locator("#run-data-top > tbody:nth-child(2) > tr > td:first-child").text_content() == 'Number of runs compared'

        assert new_page.locator("#run-data-top > tbody:nth-child(2) > tr > td:nth-child(2)").text_content() == '6'

        table_cell = new_page.locator("#run-data-top > tbody:nth-child(3) > tr > td:nth-child(2)")
        assert "Variable" in table_cell.text_content()  # Should contain table header
        assert "__GMT_VAR_STATUS__" in table_cell.text_content()  # Should contain the variable name
        assert "I love the GMT!" in table_cell.text_content()  # Should contain the value

        new_page.close()

    def test_stats_commit_hash_display(self):
        """Verify commit_hash renders as link for HTTPS/SSH URIs, plain text for local paths."""
        github_run_id = str(uuid.uuid4())
        github_ssh_run_id = str(uuid.uuid4())
        github_dotgit_run_id = str(uuid.uuid4())
        gitlab_run_id = str(uuid.uuid4())
        gitlab_ssh_run_id = str(uuid.uuid4())
        bitbucket_run_id = str(uuid.uuid4())
        local_run_id = str(uuid.uuid4())

        base_insert = """
        INSERT INTO runs (id, name, uri, branch, commit_hash, usage_scenario, filename, machine_id, user_id, failed, logs, created_at, updated_at)
        VALUES (%s, %s, %s, %s, %s, %s, %s, %s, %s, %s, %s, NOW(), NOW())
        """
        empty_scenario = json.dumps({"name": "test", "flow": []})
        commit_hash = 'aabbccddee0011223344'

        DB().query(base_insert, params=(
            github_run_id, 'GitHub HTTPS',
            'https://github.com/org/demo-repo', 'main',
            commit_hash, empty_scenario, 'test.yml', 1, 1, False, '{}'
        ))
        DB().query(base_insert, params=(
            github_ssh_run_id, 'GitHub SSH',
            'git@github.com:org/demo-repo.git', 'main',
            commit_hash, empty_scenario, 'test.yml', 1, 1, False, '{}'
        ))
        DB().query(base_insert, params=(
            github_dotgit_run_id, 'GitHub HTTPS .git',
            'https://github.com/org/demo-repo.git', 'main',
            commit_hash, empty_scenario, 'test.yml', 1, 1, False, '{}'
        ))
        DB().query(base_insert, params=(
            gitlab_run_id, 'GitLab HTTPS',
            'https://gitlab.com/org/demo-repo', 'main',
            commit_hash, empty_scenario, 'test.yml', 1, 1, False, '{}'
        ))
        DB().query(base_insert, params=(
            gitlab_ssh_run_id, 'GitLab SSH',
            'git@gitlab.com:org/demo-repo.git', 'main',
            commit_hash, empty_scenario, 'test.yml', 1, 1, False, '{}'
        ))
        DB().query(base_insert, params=(
            bitbucket_run_id, 'Bitbucket HTTPS',
            'https://bitbucket.org/org/demo-repo', 'main',
            commit_hash, empty_scenario, 'test.yml', 1, 1, False, '{}'
        ))
        DB().query(base_insert, params=(
            local_run_id, 'Local',
            '/home/user/local-project', 'main',
            commit_hash, empty_scenario, 'test.yml', 1, 1, False, '{}'
        ))

        cases = [
            (github_run_id, 'https://github.com/org/demo-repo/tree/', 'GitHub HTTPS'),
            (github_ssh_run_id, 'https://github.com/org/demo-repo/tree/', 'GitHub SSH'),
            (github_dotgit_run_id, 'https://github.com/org/demo-repo/tree/', 'GitHub HTTPS .git'),
            (gitlab_run_id, 'https://gitlab.com/org/demo-repo/-/tree/', 'GitLab HTTPS'),
            (gitlab_ssh_run_id, 'https://gitlab.com/org/demo-repo/-/tree/', 'GitLab SSH'),
            (bitbucket_run_id, 'https://bitbucket.org/org/demo-repo/src/', 'Bitbucket HTTPS'),
        ]

        for run_id, expected_base, label in cases:
            page.goto(GlobalConfig().config['cluster']['metrics_url'] + f'/stats.html?id={run_id}')
            page.wait_for_load_state("networkidle")
            link = page.locator('#run-data-top tr:has(td:has-text("commit_hash")) td:last-child a')
            assert link.count() == 1, f"{label}: expected a link"
            assert link.get_attribute('href') == f'{expected_base}{commit_hash}', f"{label}: href mismatch"
            assert link.text_content() == commit_hash, f"{label}: text mismatch"

        # Local path → plain text, no link
        page.goto(GlobalConfig().config['cluster']['metrics_url'] + f'/stats.html?id={local_run_id}')
        page.wait_for_load_state("networkidle")
        cell = page.locator('#run-data-top tr:has(td:has-text("commit_hash")) td:last-child')
        assert cell.locator('a').count() == 0, "Local: expected no link"
        assert cell.text_content().strip() == commit_hash

    def test_watchlist(self):

        page.goto(GlobalConfig().config['cluster']['metrics_url'] + '/index.html')
        page.locator("#menu").get_by_role("link", name="Watchlist", exact=True).click()
        with context.expect_page() as new_page_info:
            page.get_by_role("link", name="Show Timeline").click()

        new_page = new_page_info.value
        new_page.set_default_timeout(3_000)

        # test before refresh - data missing - Beware that if demo data is updated with new date this might break!
        new_page.wait_for_load_state("load") # ALL JS should be done
        new_page.locator('.ui.active.dimmer') # will be removed after

        new_page.locator("a.item[data-tab=two]").click()
        new_page.locator("input[name=start_date]").fill('01.01.2024')
        new_page.get_by_role("button", name="Refresh Charts & Badges").click()

        # test after refresh
        chart_label = new_page.locator('#chart-container > div:nth-child(2) > div > div.ui.left.floated.chart-title').text_content()
        assert chart_label.strip() == 'CPU Package Power via RAPL - Package_0'

        chart_label = new_page.locator('#chart-container > div:nth-child(3) > div > div.ui.left.floated.chart-title').text_content()
        assert chart_label.strip() == 'Network Transmission Energy via Formula - [FORMULA]'


        assert 0 == new_page.locator('.ui.active.dimmer').count() # must be removed now

        new_page.close()


    def test_status(self):

        page.goto(GlobalConfig().config['cluster']['metrics_url'] + '/index.html')
        page.locator("#menu").get_by_role("link", name="Cluster Status", exact=True).click()

        machine_name = page.locator('#machines-table > tbody > tr:nth-child(1) > td:nth-child(2)').text_content()
        assert machine_name.strip() == 'Development machine for testing'


        awaiting_info = page.locator('#machines-table > tbody > tr:nth-child(1) > td:nth-child(10)').text_content()
        assert awaiting_info.strip() == 'awaiting info'




    def test_settings_display(self):

        page.goto(GlobalConfig().config['cluster']['metrics_url'] + '/index.html')
        page.locator("#menu").get_by_role("link", name="Settings", exact=True).click()

        page.wait_for_load_state("load") # ALL JS should be done

        energy_display = page.locator('#energy-display').text_content()
        assert energy_display.strip() == 'Currently showing milli-Watt-Hours'


        units_display = page.locator('#units-display').text_content()
        assert units_display.strip() == 'Currently showing imperial units'


        fetch_time_series_display = page.locator('#fetch-time-series-display').text_content()
        assert fetch_time_series_display.strip() == 'Currently not fetching time series by default'


        time_series_avg_display = page.locator('#time-series-avg-display').text_content()
        assert time_series_avg_display.strip() == 'Currently not showing AVG in time series'

    def test_settings_does_not_expose_ssh_private_key(self):

        try:
            User(1).update_ssh_private_key(Tests.OPENSSH_EXAMPLE_PRIVATE_KEY)

            page.goto(GlobalConfig().config['cluster']['metrics_url'] + '/index.html')
            with page.expect_response(lambda response: '/v1/user/settings' in response.url and response.status == 200) as response_info:
                page.locator("#menu").get_by_role("link", name="Settings", exact=True).click()

            settings_response = response_info.value.json()
            assert settings_response['success'] is True
            assert '_ssh_private_key' not in settings_response['data']
            assert '_User__decrypted_ssh_private_key' not in settings_response['data']
            assert '_User__encrypted_ssh_private_key' not in settings_response['data']
            assert Tests.OPENSSH_EXAMPLE_PRIVATE_KEY not in json.dumps(settings_response)

            page.wait_for_load_state("load") # ALL JS should be done
            page.locator("a#settings-tab-measurement").click()

            value = page.locator('#ssh-private-key-status').text_content()
            assert value.strip() == 'A private key is stored for this user.'
            assert page.locator('#ssh-private-key').input_value() == ''
        finally:
            User(1).update_ssh_private_key('')

    def test_settings_measurement(self):
        User(1).update_ssh_private_key('')

        page.goto(GlobalConfig().config['cluster']['metrics_url'] + '/index.html')
        page.locator("#menu").get_by_role("link", name="Settings", exact=True).click()

        page.wait_for_load_state("load") # ALL JS should be done

        page.locator("a#settings-tab-measurement").click()
        page.wait_for_load_state("load") # ALL JS should be done

        user = User(1)
        # check default values
        assert user._capabilities['measurement']['disabled_metric_providers'] == []
        assert user._capabilities['measurement']['flow_process_duration'] == 86400
        assert user._capabilities['measurement']['total_duration'] == 86400
        assert user._capabilities['measurement']['dev_no_sleeps'] is False
        assert user._capabilities['measurement']['skip_optimizations'] is False
        assert user._capabilities['measurement']['system_check_threshold'] == 3
        assert user._capabilities['measurement']['pre_test_sleep'] == 5
        assert user._capabilities['measurement']['idle_duration'] == 60
        assert user._capabilities['measurement']['baseline_duration'] == 60
        assert user._capabilities['measurement']['post_test_sleep'] == 5
        assert user._capabilities['measurement']['phase_transition_time'] == 1
        assert user._capabilities['measurement']['wait_time_dependencies'] == 60
        assert user._capabilities['measurement']['skip_volume_inspect'] is False


        value = page.locator('#measurement-disabled-metric-providers').input_value()
        providers = [] if value.strip() == '' else [value.strip()]
        assert providers == user._capabilities['measurement']['disabled_metric_providers']

        value = page.locator('#measurement-flow-process-duration').input_value()
        assert int(value.strip()) == user._capabilities['measurement']['flow_process_duration']

        value = page.locator('#measurement-total-duration').input_value()
        assert int(value.strip()) == user._capabilities['measurement']['total_duration']

        value = page.locator('#measurement-dev-no-sleeps').is_checked()
        assert value is user._capabilities['measurement']['dev_no_sleeps']

        value = page.locator('#measurement-skip-optimizations').is_checked()
        assert value is user._capabilities['measurement']['skip_optimizations']

        value = page.locator('#measurement-system-check-threshold').input_value()
        assert int(value.strip()) == user._capabilities['measurement']['system_check_threshold']

        value = page.locator('#measurement-pre-test-sleep').input_value()
        assert int(value.strip()) == user._capabilities['measurement']['pre_test_sleep']

        value = page.locator('#measurement-idle-duration').input_value()
        assert int(value.strip()) == user._capabilities['measurement']['idle_duration']

        value = page.locator('#measurement-baseline-duration').input_value()
        assert int(value.strip()) == user._capabilities['measurement']['baseline_duration']

        value = page.locator('#measurement-post-test-sleep').input_value()
        assert int(value.strip()) == user._capabilities['measurement']['post_test_sleep']

        value = page.locator('#measurement-phase-transition-time').input_value()
        assert int(value.strip()) == user._capabilities['measurement']['phase_transition_time']

        value = page.locator('#measurement-wait-time-dependencies').input_value()
        assert int(value.strip()) == user._capabilities['measurement']['wait_time_dependencies']

        value = page.locator('#measurement-skip-volume-inspect').is_checked()
        assert value is user._capabilities['measurement']['skip_volume_inspect']

        value = page.locator('#ssh-private-key-status').text_content()
        assert value.strip() == 'No private key stored for this user.'


        page.locator('#measurement-system-check-threshold').fill('2')
        page.evaluate('$("#measurement-disabled-metric-providers").dropdown("set exactly", "network_connections_proxy_container");')
        page.locator('#measurement-flow-process-duration').fill('456')
        page.locator('#measurement-total-duration').fill('123')
        page.locator('#measurement-pre-test-sleep').fill('100')
        page.locator('#measurement-idle-duration').fill('200')
        page.locator('#measurement-baseline-duration').fill('100')
        page.locator('#measurement-post-test-sleep').fill('100')
        page.locator('#measurement-phase-transition-time').fill('2')
        page.locator('#measurement-wait-time-dependencies').fill('120')
        page.locator('#measurement-dev-no-sleeps').click()
        page.locator('#measurement-skip-optimizations').click()
        page.locator('#measurement-skip-volume-inspect').click()

        page.locator('#save-measurement-system-check-threshold').click()
        page.locator('#save-measurement-disabled-metric-providers').click()
        page.locator('#save-measurement-flow-process-duration').click()
        page.locator('#save-measurement-total-duration').click()
        page.locator('#save-measurement-pre-test-sleep').click()
        page.locator('#save-measurement-idle-duration').click()
        page.locator('#save-measurement-baseline-duration').click()
        page.locator('#save-measurement-post-test-sleep').click()
        page.locator('#save-measurement-phase-transition-time').click()
        page.locator('#save-measurement-wait-time-dependencies').click()
        page.locator('#save-measurement-dev-no-sleeps').click()
        page.locator('#save-measurement-skip-optimizations').click()
        page.locator('#save-measurement-skip-volume-inspect').click()
        page.locator('#ssh-private-key').fill(Tests.OPENSSH_EXAMPLE_PRIVATE_KEY)
        page.locator('#save-ssh-private-key').click(timeout=15000)

        #page.wait_for_load_state("networkidle") # Network Idle sadly not enough here. The DB seems to take 1-2 seconds
        time.sleep(3)

        user = User(1)
        assert user._capabilities['measurement']['disabled_metric_providers'] == ['network_connections_proxy_container']
        assert user._capabilities['measurement']['flow_process_duration'] == 456
        assert user._capabilities['measurement']['total_duration'] == 123
        assert user._capabilities['measurement']['dev_no_sleeps'] is True
        assert user._capabilities['measurement']['skip_optimizations'] is True
        assert user._capabilities['measurement']['system_check_threshold'] == 2
        assert user._capabilities['measurement']['pre_test_sleep'] == 100
        assert user._capabilities['measurement']['idle_duration'] == 200
        assert user._capabilities['measurement']['baseline_duration'] == 100
        assert user._capabilities['measurement']['post_test_sleep'] == 100
        assert user._capabilities['measurement']['phase_transition_time'] == 2
        assert user._capabilities['measurement']['wait_time_dependencies'] == 120
        assert user._capabilities['measurement']['skip_volume_inspect'] is True
        assert user.has_ssh_private_key() is True

        page.locator('#clear-ssh-private-key').click()
        time.sleep(1)
        assert User(1).has_ssh_private_key() is False

    def test_settings_docker_credentials(self):
        try:
            User(1).update_docker_credentials(None)

            page.goto(GlobalConfig().config['cluster']['metrics_url'] + '/index.html')
            page.locator("#menu").get_by_role("link", name="Settings", exact=True).click()
            page.wait_for_load_state("load") # ALL JS should be done
            page.locator("a#settings-tab-measurement").click()
            page.wait_for_load_state("load") # ALL JS should be done

            value = page.locator('#docker-credentials-status').text_content()
            assert value.strip() == 'No Docker registry credentials stored for this user.'

            rows = page.locator('#docker-credentials-rows .docker-credential-row')
            assert rows.count() == 1

            rows.nth(0).locator('.docker-cred-registry').fill('ghcr.io')
            rows.nth(0).locator('.docker-cred-username').fill('myuser')
            rows.nth(0).locator('.docker-cred-password').fill('mypassword')

            page.locator('#add-docker-credential-row').click()
            rows = page.locator('#docker-credentials-rows .docker-credential-row')
            assert rows.count() == 2

            rows.nth(1).locator('.docker-cred-registry').fill('docker.io')
            rows.nth(1).locator('.docker-cred-username').fill('anotheruser')
            rows.nth(1).locator('.docker-cred-password').fill('anotherpassword')

            with page.expect_response(lambda response: '/v1/user/setting' in response.url and response.request.method == 'PUT') as response_info:
                page.locator('#save-docker-credentials').click(timeout=15000)
            assert response_info.value.status == 202

            # The stored value must decrypt back to exactly what was submitted through the UI ...
            user = User(1)
            assert user.has_docker_credentials() is True
            creds = user.get_docker_credentials()
            assert len(creds) == 2
            assert creds[0]['registry'] == 'ghcr.io'
            assert creds[0]['username'] == 'myuser'
            assert creds[0]['password'].get_value() == 'mypassword'
            assert creds[1]['registry'] == 'docker.io'
            assert creds[1]['username'] == 'anotheruser'
            assert creds[1]['password'].get_value() == 'anotherpassword'

            # ... but on disk it must only ever exist as an encrypted blob, never in plaintext
            raw_value = DB().fetch_one('SELECT docker_credentials FROM users WHERE id = %s', params=(1,))[0]
            assert raw_value.startswith(ENCRYPTED_VALUE_PREFIX)
            assert 'mypassword' not in raw_value
            assert 'myuser' not in raw_value
            assert 'anotherpassword' not in raw_value
            assert 'anotheruser' not in raw_value

            # Reloading the page must not re-expose the stored secrets either
            page.goto(GlobalConfig().config['cluster']['metrics_url'] + '/index.html')
            with page.expect_response(lambda response: '/v1/user/settings' in response.url and response.status == 200) as response_info:
                page.locator("#menu").get_by_role("link", name="Settings", exact=True).click()

            settings_response = response_info.value.json()
            assert settings_response['data']['_has_docker_credentials'] is True
            assert 'mypassword' not in json.dumps(settings_response)
            assert 'myuser' not in json.dumps(settings_response)
            assert ENCRYPTED_VALUE_PREFIX not in json.dumps(settings_response)

            page.wait_for_load_state("load") # ALL JS should be done
            page.locator("a#settings-tab-measurement").click()
            page.wait_for_load_state("load") # ALL JS should be done

            value = page.locator('#docker-credentials-status').text_content()
            assert value.strip() == 'Docker registry credentials are stored for this user.'
            rows = page.locator('#docker-credentials-rows .docker-credential-row')
            assert rows.count() == 1
            assert rows.nth(0).locator('.docker-cred-registry').input_value() == ''
            assert rows.nth(0).locator('.docker-cred-username').input_value() == ''
            assert rows.nth(0).locator('.docker-cred-password').input_value() == ''

            with page.expect_response(lambda response: '/v1/user/setting' in response.url and response.request.method == 'PUT') as response_info:
                page.locator('#clear-docker-credentials').click()
            assert response_info.value.status == 202

            assert User(1).has_docker_credentials() is False
            raw_value = DB().fetch_one('SELECT docker_credentials FROM users WHERE id = %s', params=(1,))[0]
            assert raw_value is None
        finally:
            User(1).update_docker_credentials(None)


class TestXssSecurity:
    """XSS vulnerability tests"""

    def test_xss_protection_of_run_data(self):
        """
        Test that run-related user-provided fields are properly escaped to prevent XSS attacks across multiple pages.
        Tests run name, branch, filename, URI, usage_scenario, usage_scenario_variables, and logs for XSS vulnerabilities
        on runs, stats (including logs view), watchlist, and compare pages.
        This test should FAIL when vulnerabilities exist and PASS when they're fixed.

        The payload is prefixed with `">` so it breaks out of BOTH HTML text context AND a double-quoted
        attribute value (e.g. href="..."). Without the `">` prefix, a payload interpolated into a href
        attribute value cannot close the surrounding start tag, so the onerror handler never fires and
        href-attribute XSS goes undetected. The `">` prefix ensures the same payload exercises every
        context the value may be interpolated into.
        """
        base_url = GlobalConfig().config['cluster']['metrics_url']

        # Create malicious payloads using IMG_XSS_EXECUTED approach for all user-provided fields.
        # The leading `">` closes any double-quoted attribute value and the surrounding start tag,
        # so the same payload fires in text context AND inside href="...".
        xss_payload = '"><img src=x onerror="window.IMG_XSS_EXECUTED=true">'
        malicious_name = f'{xss_payload}Safe Name'
        malicious_branch = f'{xss_payload}main'
        malicious_filename = f'{xss_payload}test.yml'
        malicious_uri = f'http://evil.com{xss_payload}'
        malicious_usage_scenario = {
            "name": f"{xss_payload}Scenario",
            "flow": [
                {
                    "name": f"{xss_payload}Malicious Flow"
                }
            ]
        }
        malicious_variables = {
            'var1': f'{xss_payload}value1',
            'var2': f'{xss_payload}value2'
        }
        malicious_logs_json = {
            "malicious-container": [
                {
                    "type": "container_execution",
                    "id": "131377540004848",
                    "cmd": f"docker run -it -d --name malicious-container {xss_payload}",
                    "phase": "[MULTIPLE]",
                    "stdout": f"{xss_payload}Container started with malicious output\nStacktrace here"
                },
                {
                    "type": "flow_command",
                    "id": "131377540003888",
                    "cmd": f"docker exec malicious-container {xss_payload}",
                    "phase": "[RUNTIME]",
                    "stdout": f"{xss_payload}Application executed malicious command\nError output here",
                    "flow": f"{xss_payload}Malicious Flow Scenario"
                }
            ]
        }
        malicious_logs = json.dumps(malicious_logs_json)

        # Insert test data with malicious content in multiple fields
        run_id = str(uuid.uuid4())
        run_id2 = str(uuid.uuid4())

        # Insert malicious run data
        run_query = """
        INSERT INTO "runs"("id","name","uri","branch","commit_hash","commit_timestamp","usage_scenario","usage_scenario_variables","filename","machine_id","user_id","failed","logs","relations","created_at","updated_at")
        VALUES (%s, %s, %s, %s, %s, NOW(), %s, %s, %s, %s, %s, %s, %s, %s, NOW(), NOW())
        """

        malicious_relations = {
            "helpers": {
                "url": f'http://evil.com{xss_payload}/helpers.git',
                "commit_hash": "deadbeef"
            },
            "lib": {
                "url": f'git@github.com:evil{xss_payload}/lib.git',
                "commit_hash": "cafebabe"
            }
        }

        DB().query(run_query, params=(
            run_id,
            malicious_name,
            malicious_uri,
            malicious_branch,
            'deadbeef123456789abcdef',
            json.dumps(malicious_usage_scenario),
            json.dumps(malicious_variables),
            malicious_filename,
            1,
            1,
            False,
            malicious_logs,
            json.dumps(malicious_relations)
        ))

        # Insert second run for compare functionality (same params except name and usage scenario variables)
        DB().query(run_query, params=(
            run_id2,
            'Safe Run Name',  # Different name
            malicious_uri,
            malicious_branch,
            'deadbeef123456789abcdef',
            json.dumps(malicious_usage_scenario),
            json.dumps({'var': 'different_value'}),  # Use different variables for comparison
            malicious_filename,
            1,
            1,
            False,
            malicious_logs,
            json.dumps(malicious_relations)
        ))

        # Insert phase_stats for the two runs (needed for the compare view)
        # Include both baseline and flow phases to make the flow visible
        run_query = """
        INSERT INTO phase_stats ("run_id","metric","detail_name","phase","value","type","max_value","min_value","sampling_rate_avg","sampling_rate_max","sampling_rate_95p","unit","created_at","updated_at")
        VALUES
        (%s,E'phase_time_syscall_system',E'[SYSTEM]',E'000_[BASELINE]',5000601,E'TOTAL',NULL,NULL,NULL,NULL,NULL,E'us',E'2025-01-03 19:40:59.13422+00',NULL),
        (%s,E'cpu_energy_rapl_msr_component',E'Package_0',E'000_[BASELINE]',9688000,E'TOTAL',NULL,NULL,99384,99666,99624,E'uJ',E'2025-01-03 19:40:59.13422+00',NULL),
        (%s,E'phase_time_syscall_system',E'[SYSTEM]',E'001_<img src=x onerror="window.IMG_XSS_EXECUTED=true">Malicious Flow',5306934,E'TOTAL',NULL,NULL,NULL,NULL,NULL,E'us',E'2025-01-03 19:40:59.13422+00',NULL),
        (%s,E'cpu_energy_rapl_msr_component',E'Package_0',E'001_<img src=x onerror="window.IMG_XSS_EXECUTED=true">Malicious Flow',3476000,E'TOTAL',NULL,NULL,99120,99132,99131,E'uJ',E'2025-01-03 19:40:59.13422+00',NULL),
        (%s,E'phase_time_syscall_system',E'[SYSTEM]',E'004_[RUNTIME]',5000601,E'TOTAL',NULL,NULL,NULL,NULL,NULL,E'us',E'2025-01-03 19:40:59.13422+00',NULL),
        (%s,E'cpu_energy_rapl_msr_component',E'Package_0',E'000_[RUNTIME]',9688000,E'TOTAL',NULL,NULL,99384,99666,99624,E'uJ',E'2025-01-03 19:40:59.13422+00',NULL),
        (%s,E'phase_time_syscall_system',E'[SYSTEM]',E'000_[BASELINE]',5000601,E'TOTAL',NULL,NULL,NULL,NULL,NULL,E'us',E'2025-01-03 19:40:59.13422+00',NULL),
        (%s,E'cpu_energy_rapl_msr_component',E'Package_0',E'000_[BASELINE]',9688000,E'TOTAL',NULL,NULL,99384,99666,99624,E'uJ',E'2025-01-03 19:40:59.13422+00',NULL),
        (%s,E'phase_time_syscall_system',E'[SYSTEM]',E'001_<img src=x onerror="window.IMG_XSS_EXECUTED=true">Malicious Flow',5306934,E'TOTAL',NULL,NULL,NULL,NULL,NULL,E'us',E'2025-01-03 19:40:59.13422+00',NULL),
        (%s,E'cpu_energy_rapl_msr_component',E'Package_0',E'001_<img src=x onerror="window.IMG_XSS_EXECUTED=true">Malicious Flow',3476000,E'TOTAL',NULL,NULL,99120,99132,99131,E'uJ',E'2025-01-03 19:40:59.13422+00',NULL),
        (%s,E'phase_time_syscall_system',E'[SYSTEM]',E'004_[RUNTIME]',5000601,E'TOTAL',NULL,NULL,NULL,NULL,NULL,E'us',E'2025-01-03 19:40:59.13422+00',NULL),
        (%s,E'cpu_energy_rapl_msr_component',E'Package_0',E'004_[RUNTIME]',9688000,E'TOTAL',NULL,NULL,99384,99666,99624,E'uJ',E'2025-01-03 19:40:59.13422+00',NULL);
        """

        DB().query(run_query, params=(
            run_id,      # 778 - baseline phase_time for run_id
            run_id,      # 779 - baseline cpu_energy for run_id
            run_id,      # 780 - flow phase_time for run_id
            run_id,      # 781 - flow cpu_energy for run_id
            run_id,      # 782 - runtime phase_time for run_id
            run_id,      # 783 - runtime cpu_energy for run_id
            run_id2,     # 784 - baseline phase_time for run_id2
            run_id2,     # 785 - baseline cpu_energy for run_id2
            run_id2,     # 786 - flow phase_time for run_id2
            run_id2,      # 787 - flow cpu_energy for run_id2
            run_id2,     # 788 - runtime phase_time for run_id
            run_id2,     # 789 - runtime cpu_energy for run_id
        ))

        # Insert malicious watchlist data
        watchlist_query = """
        INSERT INTO "watchlist"("name","image_url","repo_url","branch","filename","usage_scenario_variables","machine_id","schedule_mode","user_id","created_at","updated_at")
        VALUES (%s, %s, %s, %s, %s, %s, %s, %s, %s, NOW(), NOW())
        """

        DB().query(watchlist_query, params=(
            malicious_name,
            'http://example.com/image.png',
            malicious_uri,
            malicious_branch,
            malicious_filename,
            json.dumps(malicious_variables),
            1,
            'daily',
            1
        ))

        page.evaluate("window.IMG_XSS_EXECUTED = false")

        # Test 1: Runs page
        page.goto(base_url + '/runs.html')
        page.wait_for_load_state("networkidle", timeout=10000)
        page.wait_for_function("() => document.body.innerText.includes('Safe Name')", timeout=10000)

        runs_xss_executed = page.evaluate("window.IMG_XSS_EXECUTED")
        assert runs_xss_executed is not True, "XSS vulnerability detected on runs page: malicious code executed"

        # Test 2: Stats page
        stats_url = f"{base_url}/stats.html?id={run_id}"
        page.goto(stats_url)
        page.wait_for_load_state("networkidle", timeout=10000)
        page.wait_for_function("() => document.body.innerText.includes('Safe Name')", timeout=10000)

        stats_xss_executed = page.evaluate("window.IMG_XSS_EXECUTED")
        assert stats_xss_executed is not True, "XSS vulnerability detected on stats page: malicious code executed"

        # Test 3: Watchlist page
        page.goto(base_url + '/watchlist.html')
        page.wait_for_load_state("networkidle", timeout=10000)
        page.wait_for_function("() => document.body.innerText.includes('Safe Name')", timeout=10000)

        watchlist_xss_executed = page.evaluate("window.IMG_XSS_EXECUTED")
        assert watchlist_xss_executed is not True, "XSS vulnerability detected on watchlist page: malicious code executed"

        # Test 4: Timeline page
        timeline_url = f"{base_url}/timeline.html?uri={malicious_uri}&branch={malicious_branch}&filename={malicious_filename}&machine_id=1"
        page.goto(timeline_url)
        page.wait_for_load_state("networkidle", timeout=10000)
        page.wait_for_function("() => document.querySelector('input[name=\"uri\"]')?.value.includes('evil.com')", timeout=10000)

        timeline_xss_executed = page.evaluate("window.IMG_XSS_EXECUTED")
        assert timeline_xss_executed is not True, "XSS vulnerability detected on timeline page: malicious code executed"

        # Test 5: Compare page (commit hashes comparison view includes repository uri, filename and usage scenario)
        compare_url = f"{base_url}/compare.html?ids={run_id},{run_id2}&force_mode=commit_hashes"
        page.goto(compare_url)
        page.wait_for_load_state("networkidle", timeout=10000)
        page.wait_for_function("() => document.body.innerText.includes('deadbeef123456789abcdef')", timeout=10000)

        compare_xss_executed = page.evaluate("window.IMG_XSS_EXECUTED")
        assert compare_xss_executed is not True, "XSS vulnerability detected on compare page: malicious code executed"

        # Test 6: Compare page (usage scenario variables)
        compare_url = f"{base_url}/compare.html?ids={run_id},{run_id2}&force_mode=usage_scenario_variables"

        # Temporarily remove the page error handler for this compare test since there's a JS error due to missing phase_stats data
        page.remove_listener("pageerror", handle_page_error)

        page.goto(compare_url)
        page.wait_for_load_state("networkidle", timeout=10000)
        page.wait_for_function("() => document.body.innerText.includes('different_value')", timeout=10000)

        compare_xss_executed = page.evaluate("window.IMG_XSS_EXECUTED")
        assert compare_xss_executed is not True, "XSS vulnerability detected on compare page with usage scenario variables: malicious code executed"


    @pytest.mark.usefixtures('use_demo_data')
    def test_xss_protection_of_notes(self):
        """
        Test that malicious JavaScript in notes does not execute.
        Verifies XSS protection by checking if malicious script runs.
        ECharts handles XSS protection internally for formatter properties.
        """

        malicious_note = '<img src=x onerror="window.IMG_XSS_EXECUTED=true">Legitimate note content'

        # Get an existing run ID from demo data
        existing_runs = DB().fetch_all("SELECT id FROM runs LIMIT 1")
        assert existing_runs, "No demo data available - test setup failed"

        run_id = existing_runs[0][0]

        # Update an existing note with malicious content for XSS testing
        existing_notes = DB().fetch_all("SELECT id FROM notes WHERE run_id = %s LIMIT 1", params=(run_id,))
        assert existing_notes, f"No existing notes found for run_id {run_id} - demo data incomplete"
        update_notes_query = """
        UPDATE "notes" SET "note" = %s WHERE "id" = %s
        """
        DB().query(update_notes_query, params=(malicious_note, existing_notes[0][0]))


        page.evaluate("window.IMG_XSS_EXECUTED = false")

        base_url = GlobalConfig().config['cluster']['metrics_url']
        stats_url = f"{base_url}/stats.html?id={run_id}"


        page.goto(stats_url)
        page.wait_for_load_state("networkidle")

        fetch_button = page.locator('button#fetch-time-series')

        assert fetch_button.count() > 0, "fetch-time-series button not found - test setup failed"
        fetch_button.click()
        page.wait_for_timeout(3000)

        xss_executed = page.evaluate("window.IMG_XSS_EXECUTED")

        # Verify XSS protection worked - script should NOT execute
        assert xss_executed is not True, "XSS vulnerability detected: malicious script executed"

    def test_xss_protection_of_eco_ci_data(self):
        """
        Test XSS protection on ci-index.html and ci.html pages.
        """
        base_url = GlobalConfig().config['cluster']['metrics_url']
        xss_payload = '<img src=x onerror="window.IMG_XSS_EXECUTED=true">'

        malicious_repo = f'{xss_payload}evil/repo'
        malicious_branch = f'{xss_payload}main'
        malicious_workflow = f'{xss_payload}workflow-456'
        clean_repo = 'clean/repo'
        clean_branch = 'main'
        clean_workflow = 'workflow-789'
        malicious_filter_tags = [f'{xss_payload}tag1', f'{xss_payload}tag2']

        filter_tags_sql = f"ARRAY[{','.join(['%s']*len(malicious_filter_tags))}]"
        ci_query = f"""
        INSERT INTO ci_measurements (
            energy_uj, repo, branch, workflow_id, run_id, label, source, cpu, commit_hash,
            duration_us, cpu_util_avg, workflow_name, latitude, longitude, city, carbon_intensity_g,
            carbon_ug, filter_type, filter_project, filter_machine, filter_tags,
            ip_address, user_id, note, created_at
        ) VALUES (
            %s, %s, %s, %s, %s, %s, %s, %s, %s, %s, %s, %s, %s, %s, %s, %s, %s, %s, %s, %s, {filter_tags_sql}, %s, %s, %s, NOW()
        )
        """

        # Two entries needed:
        # - malicious repo identifiers test ci-index.html,
        # - clean repo identifiers test ci.html (API requires valid identifiers for queries)
        params_malicious_repo = [
            1000000, malicious_repo, malicious_branch, malicious_workflow,
            f'{xss_payload}run-456', f'{xss_payload}build', 'github',
            f'{xss_payload}intel-cpu', f'{xss_payload}abc123def', 5000000, 85.5,
            f'{xss_payload}Test Workflow', '52.5200', '13.4050', f'{xss_payload}Berlin',
            400, 500000, 'machine.ci', 'CI/CD', 'test-machine'
        ] + malicious_filter_tags + ['127.0.0.1', 1, f'{xss_payload}Test note']

        params_clean_repo = [
            2000000, clean_repo, clean_branch, clean_workflow,
            f'{xss_payload}run-789', f'{xss_payload}deploy', 'github',
            f'{xss_payload}amd-cpu', f'{xss_payload}def456ghi', 7000000, 75.0,
            f'{xss_payload}Deploy Workflow', '52.5200', '13.4050', f'{xss_payload}Munich',
            350, 600000, 'machine.ci', 'CI/CD', 'test-machine'
        ] + [f'{xss_payload}tag3', f'{xss_payload}tag4'] + ['127.0.0.1', 1, f'{xss_payload}Deploy note']

        DB().query(ci_query, params=params_malicious_repo)
        DB().query(ci_query, params=params_clean_repo)

        page.goto(f"{base_url}/ci-index.html")
        page.wait_for_load_state("networkidle")
        page.wait_for_function("() => document.body.innerText.includes('evil/repo')", timeout=10000)

        img_xss_executed = page.evaluate("window.IMG_XSS_EXECUTED")
        assert img_xss_executed is not True, "XSS vulnerability detected on ci-index.html"

        now = datetime.now()
        start_date = (now - timedelta(days=1)).strftime('%Y-%m-%d')
        end_date = now.strftime('%Y-%m-%d')
        ci_url = f"{base_url}/ci.html?repo={clean_repo}&branch={clean_branch}&workflow={clean_workflow}&start_date={start_date}&end_date={end_date}"

        page.goto(ci_url)
        page.reload()
        page.wait_for_load_state("networkidle")

        try:
            page.wait_for_function("() => document.body.innerText.includes('clean/repo')", timeout=10000)
        except PlaywrightTimeoutError:
            page_text = page.evaluate("() => document.body.innerText")
            if 'No data for time frame' in page_text:
                assert False, "CI data not loaded: No data for time frame"
            elif 'error' in page_text.lower():
                assert False, f"CI data not loaded: {page_text[:200]}"
            else:
                assert False, f"CI data not loaded: {page_text[:200]}"

        ci_img_xss_executed = page.evaluate("window.IMG_XSS_EXECUTED")
        assert ci_img_xss_executed is not True, "XSS vulnerability detected on ci.html"

        page_content = page.content()
        assert '<img src=x onerror="window.IMG_XSS_EXECUTED=true">' not in page_content
        assert "data-tooltip='<img src=x onerror=\"window.IMG_XSS_EXECUTED=true\">" not in page_content
        assert '&lt;img src=x onerror=' in page_content
        assert 'onerror=&quot;window.IMG_XSS_EXECUTED=true&quot;' in page_content


def cell(table, row, col):
    return table.locator(f"tr:nth-child({row}) > td:nth-child({col})")