371 lines
14 KiB
JavaScript
371 lines
14 KiB
JavaScript
/** @odoo-module */
|
|
|
|
import { Component, onWillRender, useState, xml } from "@odoo/owl";
|
|
import { parseRegExp } from "../../hoot-dom/hoot_dom_utils";
|
|
import { Test } from "../core/test";
|
|
import { EXCLUDE_PREFIX } from "../core/url";
|
|
import { formatTime, getFuzzyScore, normalize } from "../hoot_utils";
|
|
import { HootLogCounters } from "./hoot_log_counters";
|
|
import { HootJobButtons } from "./hoot_job_buttons";
|
|
import { HootTechnicalValue } from "./hoot_technical_value";
|
|
import { HootTestPath } from "./hoot_test_path";
|
|
import { HootTestResult } from "./hoot_test_result";
|
|
|
|
/**
|
|
* @typedef {{
|
|
* }} HootReportingProps
|
|
*
|
|
* @typedef {import("../core/test").Test} Test
|
|
*/
|
|
|
|
//-----------------------------------------------------------------------------
|
|
// Global
|
|
//-----------------------------------------------------------------------------
|
|
|
|
const { Boolean, RegExp } = globalThis;
|
|
|
|
//-----------------------------------------------------------------------------
|
|
// Internal
|
|
//-----------------------------------------------------------------------------
|
|
|
|
/**
|
|
* @param {keyof import("../core/runner").Runner["state"]} varName
|
|
* @param {string} colorClassName
|
|
*/
|
|
const issueTemplate = (varName, colorClassName) => /* xml */ `
|
|
<t t-foreach="runnerState['${varName}']" t-as="key" t-key="key">
|
|
<t t-set="issue" t-value="runnerState['${varName}'][key]" />
|
|
<div
|
|
class="flex flex-col justify-center px-3 py-2 gap-2 border-muted border-b text-${colorClassName} bg-${colorClassName}-900"
|
|
t-att-title="issue.message"
|
|
>
|
|
<h3 class="flex items-center gap-1 whitespace-nowrap">
|
|
<span class="min-w-3 min-h-3 rounded-full bg-${colorClassName}" />
|
|
Global <t t-esc="issue.name" />
|
|
<span t-if="issue.count > 1">
|
|
(x<t t-esc="issue.count" />)
|
|
</span>:
|
|
<small class="ms-auto text-muted whitespace-nowrap italic font-normal">
|
|
stack trace available in the console
|
|
</small>
|
|
</h3>
|
|
<ul>
|
|
<t t-foreach="issue.message.split('\\n')" t-as="messagePart" t-key="messagePart_index">
|
|
<li class="truncate" t-esc="messagePart" />
|
|
</t>
|
|
</ul>
|
|
</div>
|
|
</t>`;
|
|
|
|
const sortByDurationAscending = (a, b) => a.duration - b.duration;
|
|
|
|
const sortByDurationDescending = (a, b) => b.duration - a.duration;
|
|
|
|
const COLORS = {
|
|
failed: "text-fail",
|
|
passed: "text-pass",
|
|
skipped: "text-skip",
|
|
todo: "text-todo",
|
|
};
|
|
|
|
//-----------------------------------------------------------------------------
|
|
// Exports
|
|
//-----------------------------------------------------------------------------
|
|
|
|
/** @extends {Component<HootReportingProps, import("../hoot").Environment>} */
|
|
export class HootReporting extends Component {
|
|
static components = {
|
|
HootLogCounters,
|
|
HootJobButtons,
|
|
HootTechnicalValue,
|
|
HootTestPath,
|
|
HootTestResult,
|
|
};
|
|
|
|
static props = {};
|
|
|
|
static template = xml`
|
|
<div class="${HootReporting.name} flex-1 overflow-y-auto">
|
|
<!-- Errors -->
|
|
${issueTemplate("globalErrors", "fail")}
|
|
|
|
<!-- Warnings -->
|
|
${issueTemplate("globalWarnings", "abort")}
|
|
|
|
<!-- Test results -->
|
|
<t t-set="resultStart" t-value="uiState.resultsPage * uiState.resultsPerPage" />
|
|
<t t-foreach="filteredResults.slice(resultStart, resultStart + uiState.resultsPerPage)" t-as="result" t-key="result.id">
|
|
<HootTestResult
|
|
open="state.openTests.includes(result.test.id)"
|
|
test="result.test"
|
|
>
|
|
<div class="flex items-center gap-2 overflow-hidden">
|
|
<HootTestPath canCopy="true" showStatus="true" test="result.test" />
|
|
<HootLogCounters logs="result.test.logs" />
|
|
</div>
|
|
<div class="flex items-center ms-1 gap-2">
|
|
<small
|
|
class="whitespace-nowrap"
|
|
t-attf-class="text-{{ result.test.config.skip ? 'skip' : 'muted' }}"
|
|
>
|
|
<t t-if="result.test.config.skip">
|
|
skipped
|
|
</t>
|
|
<t t-else="">
|
|
<t t-if="result.test.status === Test.ABORTED">
|
|
aborted after
|
|
</t>
|
|
<t t-esc="formatTime(result.test.lastResults.duration, 'ms')" />
|
|
</t>
|
|
</small>
|
|
<HootJobButtons job="result.test" />
|
|
</div>
|
|
</HootTestResult>
|
|
</t>
|
|
|
|
<!-- "No test" panel -->
|
|
<t t-if="!filteredResults.length">
|
|
<div class="flex items-center justify-center h-full">
|
|
<t t-set="message" t-value="getEmptyMessage()" />
|
|
<t t-if="message">
|
|
<em class="p-5 rounded bg-gray-200 dark:bg-gray-800 whitespace-nowrap text-muted">
|
|
No
|
|
<span
|
|
t-if="message.statusFilter"
|
|
t-att-class="message.statusFilterClassName"
|
|
t-esc="message.statusFilter"
|
|
/>
|
|
tests found
|
|
<t t-if="message.filter">
|
|
matching
|
|
<strong class="text-primary" t-esc="message.filter" />
|
|
</t>
|
|
<t t-if="message.selectedSuiteName">
|
|
in suite
|
|
<strong class="text-primary" t-esc="message.selectedSuiteName" />
|
|
</t>.
|
|
</em>
|
|
</t>
|
|
<t t-else="">
|
|
<div class="flex flex-col gap-3 p-5 rounded bg-gray-200 dark:bg-gray-800">
|
|
<h3 class="border-b border-muted pb-1">
|
|
<strong class="text-primary" t-esc="runnerReporting.tests" />
|
|
/
|
|
<span class="text-primary" t-esc="runnerState.tests.length" />
|
|
tests completed
|
|
</h3>
|
|
<ul class="flex flex-col gap-2">
|
|
<t t-if="runnerReporting.passed">
|
|
<li class="flex gap-1">
|
|
<button
|
|
class="flex items-center gap-1 text-pass"
|
|
t-on-click.stop="() => this.filterResults('passed')"
|
|
>
|
|
<i class="fa fa-check-circle" />
|
|
<strong t-esc="runnerReporting.passed" />
|
|
</button>
|
|
tests passed
|
|
</li>
|
|
</t>
|
|
<t t-if="runnerReporting.failed">
|
|
<li class="flex gap-1">
|
|
<button
|
|
class="flex items-center gap-1 text-fail"
|
|
t-on-click.stop="() => this.filterResults('failed')"
|
|
>
|
|
<i class="fa fa-times-circle" />
|
|
<strong t-esc="runnerReporting.failed" />
|
|
</button>
|
|
tests failed
|
|
</li>
|
|
</t>
|
|
<t t-if="runnerReporting.skipped">
|
|
<li class="flex gap-1">
|
|
<button
|
|
class="flex items-center gap-1 text-skip"
|
|
t-on-click.stop="() => this.filterResults('skipped')"
|
|
>
|
|
<i class="fa fa-pause-circle" />
|
|
<strong t-esc="runnerReporting.skipped" />
|
|
</button>
|
|
tests skipped
|
|
</li>
|
|
</t>
|
|
<t t-if="runnerReporting.todo">
|
|
<li class="flex gap-1">
|
|
<button
|
|
class="flex items-center gap-1 text-todo"
|
|
t-on-click.stop="() => this.filterResults('todo')"
|
|
>
|
|
<i class="fa fa-exclamation-circle" />
|
|
<strong t-esc="runnerReporting.todo" />
|
|
</button>
|
|
tests to do
|
|
</li>
|
|
</t>
|
|
</ul>
|
|
</div>
|
|
</t>
|
|
</div>
|
|
</t>
|
|
</div>
|
|
`;
|
|
|
|
Test = Test;
|
|
formatTime = formatTime;
|
|
|
|
setup() {
|
|
const { runner, ui } = this.env;
|
|
|
|
this.config = useState(runner.config);
|
|
this.runnerReporting = useState(runner.reporting);
|
|
this.runnerState = useState(runner.state);
|
|
this.state = useState({
|
|
/** @type {string[]} */
|
|
openGroups: [],
|
|
/** @type {string[]} */
|
|
openTests: [],
|
|
});
|
|
this.uiState = useState(ui);
|
|
|
|
const { showdetail } = this.config;
|
|
|
|
let didShowDetail = false;
|
|
runner.afterPostTest((test) => {
|
|
if (
|
|
showdetail &&
|
|
!(showdetail === "first-fail" && didShowDetail) &&
|
|
[Test.FAILED, Test.ABORTED].includes(test.status)
|
|
) {
|
|
didShowDetail = true;
|
|
this.state.openTests.push(test.id);
|
|
}
|
|
});
|
|
|
|
onWillRender(() => {
|
|
this.filteredResults = this.computeFilteredResults();
|
|
this.uiState.totalResults = this.filteredResults.length;
|
|
});
|
|
}
|
|
|
|
computeFilteredResults() {
|
|
const { selectedSuiteId, sortResults, statusFilter } = this.uiState;
|
|
|
|
const queryFilter = this.getQueryFilter();
|
|
|
|
const results = [];
|
|
for (const test of this.runnerState.done) {
|
|
let matchFilter = false;
|
|
switch (statusFilter) {
|
|
case "failed": {
|
|
matchFilter = !test.config.skip && test.results.some((r) => !r.pass);
|
|
break;
|
|
}
|
|
case "passed": {
|
|
matchFilter =
|
|
!test.config.todo && !test.config.skip && test.results.every((r) => r.pass);
|
|
break;
|
|
}
|
|
case "skipped": {
|
|
matchFilter = test.config.skip;
|
|
break;
|
|
}
|
|
case "todo": {
|
|
matchFilter = test.config.todo;
|
|
break;
|
|
}
|
|
default: {
|
|
matchFilter = Boolean(selectedSuiteId) || test.results.some((r) => !r.pass);
|
|
break;
|
|
}
|
|
}
|
|
if (matchFilter && selectedSuiteId) {
|
|
matchFilter = test.path.some((suite) => suite.id === selectedSuiteId);
|
|
}
|
|
if (matchFilter && queryFilter) {
|
|
matchFilter = queryFilter(test.key);
|
|
}
|
|
if (!matchFilter) {
|
|
continue;
|
|
}
|
|
results.push({
|
|
duration: test.lastResults?.duration,
|
|
status: test.status,
|
|
id: `test#${test.id}`,
|
|
test: test,
|
|
});
|
|
}
|
|
|
|
if (!sortResults) {
|
|
return results;
|
|
}
|
|
|
|
return results.sort(
|
|
sortResults === "asc" ? sortByDurationAscending : sortByDurationDescending
|
|
);
|
|
}
|
|
|
|
/**
|
|
* @param {typeof this.uiState.statusFilter} status
|
|
*/
|
|
filterResults(status) {
|
|
this.uiState.resultsPage = 0;
|
|
if (this.uiState.statusFilter === status) {
|
|
this.uiState.statusFilter = null;
|
|
} else {
|
|
this.uiState.statusFilter = status;
|
|
}
|
|
}
|
|
|
|
getEmptyMessage() {
|
|
const { selectedSuiteId, statusFilter } = this.uiState;
|
|
if (!statusFilter && !selectedSuiteId) {
|
|
return null;
|
|
}
|
|
return {
|
|
statusFilter,
|
|
statusFilterClassName: COLORS[statusFilter],
|
|
filter: this.config.filter,
|
|
selectedSuiteName: selectedSuiteId && this.env.runner.suites.get(selectedSuiteId).name,
|
|
};
|
|
}
|
|
|
|
getQueryFilter() {
|
|
const { filter } = this.config;
|
|
if (!filter) {
|
|
return null;
|
|
}
|
|
const nFilter = parseRegExp(normalize(filter), { safe: true });
|
|
if (nFilter instanceof RegExp) {
|
|
return (key) => nFilter.test(key);
|
|
}
|
|
|
|
const isExcluding = nFilter.startsWith(EXCLUDE_PREFIX);
|
|
const pattern = isExcluding ? nFilter.slice(EXCLUDE_PREFIX.length) : nFilter;
|
|
return (key) => getFuzzyScore(pattern, key) > 0;
|
|
}
|
|
|
|
/**
|
|
* @param {PointerEvent} ev
|
|
* @param {string} id
|
|
*/
|
|
toggleGroup(ev, id) {
|
|
const index = this.state.openGroups.indexOf(id);
|
|
if (ev.altKey) {
|
|
if (index in this.state.openGroups) {
|
|
this.state.openGroups = [];
|
|
} else {
|
|
this.state.openGroups = this.filteredResults
|
|
.filter((r) => r.suite)
|
|
.map((r) => r.suite.id);
|
|
}
|
|
} else {
|
|
if (index in this.state.openGroups) {
|
|
this.state.openGroups.splice(index, 1);
|
|
} else {
|
|
this.state.openGroups.push(id);
|
|
}
|
|
}
|
|
}
|
|
}
|