SMusatov
/
ydb
mirror of https://github.com/ydb-platform/ydb.git


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370
							<html>
<head>
    <style>
        body {
            font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            width: 100%;
        }
        h1 { 
            font-size: 20px; 
        }
        th {
            text-transform: uppercase;
        }

        th, td {
            padding: 5px;
            word-break: break-word; /* Allow breaking long words */
            font-size: 14px;
            min-width: 80px;
        }
        td.test_name{
            min-width: 79vw;
            max-width: 79vw;
        }
        td.test_name.with_history{
            min-width: 73vw;
            max-width: 73vw;
        }

        table {
            border-collapse: collapse;
            width: 100%;
            left: 5;
        }

        span.test_status {
            font-weight: bold;
        }

        span.test_fail {
            color: red;
        }

        span.test_pass {
            color: green;
        }

        span.test_mute {
            color: blue;
        }
        .svg_passed {
            fill: green;
        }
    
        .svg_failure {
            fill: red;
        }
    
        .svg_skipped {
            fill: gray;
        }
    
        .svg_mute {
            fill: blue;
        }

        .svg-icon {
            float: left;
            width: 14px;
            height: 14px;
            padding-left: 1px;
            padding-right: 1px;
            margin-right: 0px;
            border-radius: 50%;
            position: relative; /* Essential for tooltips */
            cursor: pointer;
        }
    
        .tooltip {
            visibility: hidden;
            max-width: 340px;
            min-width: 260px;
            word-break: break-word;
            background-color: #7d7d92;
            color: #fff;
            text-align: left;
            border-radius: 5px;
            padding: 5px;
            position: absolute;
            z-index: 3;
            bottom: 100%; /* Positioned above the svg icon */
            left: 50%; /* Center the tooltip */
            margin-left: -95px; /* Use negative margin to actually center the tooltip */
            opacity: 0;
            transition: opacity 0.3s;
            overflow: hidden;
            white-space: nowrap; /* Don't forget this one */
            text-overflow: ellipsis;
        }

        .tooltip::after {
            content: "";
            position: absolute;
            top: 100%; /* Arrow will be positioned at the bottom of the tooltip */
            left: 50%;
            margin-left: -5px;
            border-width: 5px;
            border-style: solid;
            border-color: #7d7d92 transparent transparent transparent; /* Arrow color */
        }

        .tooltip.visible {
            visibility: visible;
            opacity: 1;
        }
    
        button.copy {
            float: right;
            position: relative; /* To hold the copied tooltip */
        }
        table > tbody > tr > td:nth-child(2),
        table > tbody > tr > td:nth-child(3),
        table > tbody > tr > td:nth-child(4) {
            text-align: left;
        }
    
        .collapsible-content {
            display: table-row-group;
            position: absolute;
            top: -9999px;
            left: -9999px;
            height: 0;
            overflow: hidden;
        }
    
        .collapsible-content.active {
            position: relative;
            top: 0;
            left: 5;
            height: auto;
        }
    
        .collapsible-header {
            cursor: pointer;
            background-color: #f2f2f2;
            padding: 10px;
            border: 1px solid #ddd;
            margin-bottom: 5px;
        }
    
       
        .toggle-visibility-buttons {
            margin-bottom: 10px;
            overflow:hidden;
            float: right;
        }
    </style>
<script>
    function copyTestNameToClipboard(text) {
        const full_name = text.trim();
        const pieces = /(.+)\/([^$]+)$/.exec(full_name);

        if (!pieces) {
            console.error("Unable to split path/test name from %o", full_name);
            return;
        }
        let [path, testName] = [pieces[1], pieces[2]];

        const namePieces = testName.split('.');

        if (namePieces.length === 2) {
            testName = namePieces[0] + '::' + namePieces[1];
        } else {
            testName = namePieces[0] + '.' + namePieces[1] + '::' + namePieces.slice(2).join('::');
        }

        const cmdArg = `${path} -F '${testName}'`;

        console.log(cmdArg);

        navigator.clipboard.writeText(cmdArg).then(
            () => {
                console.log("Copied!");
                showCopiedTooltip();
            },
            () => {
                console.error("Unable to copy %o to clipboard", cmdArg);
            }
        );
    }

    let lastOpenedTooltip = null;

    function toggleTooltip(event) {
        event.stopPropagation();
        const tooltip = event.currentTarget.querySelector('.tooltip');

        if (tooltip.classList.contains('visible')) {
            tooltip.classList.remove('visible');
            lastOpenedTooltip = null;
        } else {
            hideTooltips();
            tooltip.classList.add('visible');
            lastOpenedTooltip = tooltip;
        }
    }

    function hideTooltips() {
        if (lastOpenedTooltip) {
            lastOpenedTooltip.classList.remove('visible');
            lastOpenedTooltip = null;
        }
    }


    function toggleAllTables(action) {
        const contents = document.querySelectorAll('.collapsible-content');
        if (action === 'expand') {
            contents.forEach(content => content.classList.add('active'));
        } else if (action === 'collapse') {
            contents.forEach(content => content.classList.remove('active'));
        }
    }

    document.addEventListener("DOMContentLoaded", function() {

        document.addEventListener('keydown', function(event) {
            if ((event.ctrlKey && event.keyCode == 70) || (event.metaKey && event.keyCode == 70)) { 
                toggleAllTables('expand');
            }    
        });

        document.addEventListener('click', function(event) {
            if (!event.target.closest('.svg-icon') && !event.target.classList.contains('copy')) {
                hideTooltips();
            }
        });
        const svgIcons = document.querySelectorAll('.svg-icon');
        svgIcons.forEach(icon => {
            icon.addEventListener('click', toggleTooltip);
        });
        const copyButtons = document.querySelectorAll(".copy");
        copyButtons.forEach(button => {
            button.addEventListener('click', function(event) {
                event.preventDefault();
                copyTestNameToClipboard(event.target.closest('.copy').previousElementSibling.textContent);
            });
        });
        const headers = document.querySelectorAll(".collapsible-header");
        headers.forEach(header => {
            header.addEventListener('click', function() {
                const content = this.nextElementSibling;
                if (content.classList.contains('active')) {
                    content.classList.remove('active');
                } else {
                    content.classList.add('active');
                }
            });
        });

        document.getElementById('expand-all').addEventListener('click', function(event) {
             toggleAllTables('expand');
        });
        document.getElementById('collapse-all').addEventListener('click',  function(event) {
            toggleAllTables('collapse');
        });
    });
</script>
</head>
<body>
    <div class="toggle-visibility-buttons">
        <button id="expand-all">Expand All</button>
        <button id="collapse-all">Collapse All</button>
    </div>
{% for status in status_order %}
<h1 id="{{ status.name}}" class="collapsible-header">{{ status.name }} ({{ tests[status] | length }})</h1>
<table class="collapsible-content active" border="1">
    <thead>
    <tr>
        <th>test name</th>
    {% if status.is_error  and history%}
        <th>history<br>
            old->new
        </th>
    {% endif %}
        <th>elapsed</th>
        <th>status</th>
    {% if status in has_any_log %}
        <th>LOG</th>
    {% endif %}
    </tr>
    </thead>
    <tbody>
    {% for t in tests[status] %}
    <tr>
        {% if status.is_error %} 
        <td class="test_name with_history">
        {% else %} 
        <td class="test_name">
        {% endif %}
            <span>{{ t.full_name }}</span>
            {% if status.is_error %} 
            <button class="copy" title="Copy test filter to clipboard" >
                <svg  xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="14" height="14" class="g-icon" fill="currentColor" stroke="none" aria-hidden="true">
                    <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16">
                        <path class="copy_svg" fill="currentColor" fill-rule="evenodd" d="M12 2.5H8A1.5 1.5 0 0 0 6.5 4v1H8a3 3 0 0 1 3 3v1.5h1A1.5 1.5 0 0 0 13.5 8V4A1.5 1.5 0 0 0 12 2.5M11 11h1a3 3 0 0 0 3-3V4a3 3 0 0 0-3-3H8a3 3 0 0 0-3 3v1H4a3 3 0 0 0-3 3v4a3 3 0 0 0 3 3h4a3 3 0 0 0 3-3zM4 6.5h4A1.5 1.5 0 0 1 9.5 8v4A1.5 1.5 0 0 1 8 13.5H4A1.5 1.5 0 0 1 2.5 12V8A1.5 1.5 0 0 1 4 6.5" clip-rule="evenodd"></path>
                    </svg>
                </svg>
            </button>
            {% endif %}
        </td>
        {% if (status.is_error and t.full_name in history) %}
        <td>
            {% for h in history[t.full_name] %}
                <span class="svg-icon">
                    {% if history[t.full_name][h].status == 'failure' %}
                    <svg class="svg_failure" viewBox="0 0 16 16" >
                        <path  fill-rule="evenodd" d="M13.5 8a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0M15 8A7 7 0 1 1 1 8a7 7 0 0 1 14 0M6.53 5.47a.75.75 0 0 0-1.06 1.06L6.94 8 5.47 9.47a.75.75 0 1 0 1.06 1.06L8 9.06l1.47 1.47a.75.75 0 1 0 1.06-1.06L9.06 8l1.47-1.47a.75.75 0 1 0-1.06-1.06L8 6.94z" clip-rule="evenodd"></path>
                    </svg>
                    {% elif history[t.full_name][h].status == 'passed' %}
                    <svg class="svg_passed" viewBox="0 0 16 16" >
                        <path fill-rule="evenodd" d="M13.5 8a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0M15 8A7 7 0 1 1 1 8a7 7 0 0 1 14 0m-3.9-1.55a.75.75 0 1 0-1.2-.9L7.419 8.858 6.03 7.47a.75.75 0 0 0-1.06 1.06l2 2a.75.75 0 0 0 1.13-.08z" clip-rule="evenodd"></path>
                    </svg>
                    {% elif history[t.full_name][h].status == 'mute' %}
                    <svg class="svg_mute" viewBox="0 0 17 16" >
                        <path  fill-rule="evenodd" d="M5.06 9.94A1.5 1.5 0 0 0 4 9.5H2a.5.5 0 0 1-.5-.5V7a.5.5 0 0 1 .5-.5h2a1.5 1.5 0 0 0 1.06-.44l2.483-2.482a.268.268 0 0 1 .457.19v8.464a.268.268 0 0 1-.457.19zM2 5h2l2.482-2.482A1.768 1.768 0 0 1 9.5 3.768v8.464a1.768 1.768 0 0 1-3.018 1.25L4 11H2a2 2 0 0 1-2-2V7a2 2 0 0 1 2-2m10.28.72a.75.75 0 1 0-1.06 1.06L12.44 8l-1.22 1.22a.75.75 0 1 0 1.06 1.06l1.22-1.22 1.22 1.22a.75.75 0 1 0 1.06-1.06L14.56 8l1.22-1.22a.75.75 0 0 0-1.06-1.06L13.5 6.94z" clip-rule="evenodd"></path>                    </svg>
                    </svg>
                    {% endif %}
                    <span class="tooltip">
                        Status: {{history[t.full_name][h].status}}<br>
                        Date: {{ history[t.full_name][h].datetime }}<br>
                        {% if history[t.full_name][h].status_description != "" %}
                        Info: {{ history[t.full_name][h].status_description.split(';')[0][0:100] }}<br>
                        {% endif %}
                        SHA: <a href="https://github.com/ydb-platform/ydb//commit/{{ history[t.full_name][h].commit }}" style="color: #00f;" target="_blank">{{history[t.full_name][h].commit[0:8]}}</a>
                    </span>

                </span>
            {% endfor %}
        </td> 
        {% elif (status.is_error and  history) %}
        <td></td>
        {% elif status.is_error %}
        {% endif %}
        <td><span title="{{ t.elapsed }}s">{{ t.elapsed_display }}</span></td>
        <td>
            <span class="test_status test_{{ t.status_display }}">{{ t.status_display }}</span>
        </td>
        {% if status in has_any_log %}
        <td>
            {% if t.log_urls %}
                {% for log_name, log_url in t.log_urls.items() %}
                <a href="{{ log_url }}">{{ log_name }}</a>{% if not loop.last %} | {% endif %}

                {% endfor %}
            {% else %}
                &nbsp;
            {% endif %}
        </td>
        {% endif %}
    </tr>
    {% endfor %}
    </tbody>
</table>
{% endfor %}
</body>
</html>