diff --git a/frontend/src/app/Results/ResultsPageTestingFarm.tsx b/frontend/src/app/Results/ResultsPageTestingFarm.tsx index aba4a228..cb53cec4 100644 --- a/frontend/src/app/Results/ResultsPageTestingFarm.tsx +++ b/frontend/src/app/Results/ResultsPageTestingFarm.tsx @@ -22,6 +22,7 @@ import { DataListCell, DataListToggle, ClipboardCopy, + CardHeader, } from "@patternfly/react-core"; import { ErrorConnection } from "../Errors/ErrorConnection"; @@ -45,6 +46,7 @@ import { import { Preloader } from "../Preloader/Preloader"; import { ResultsPageCoprDetails } from "./ResultsPageCoprDetails"; import { SHACopy } from "../utils/SHACopy"; +import { TestingFarmPoC } from "./TestingFarmPoC"; export interface TestingFarmOverview { pipeline_id: string; // UUID @@ -218,6 +220,24 @@ const ResultsPageTestingFarm = () => { + + + + + Testing Farm proof of concept + + + {!data ? ( + + ) : ( + + )} + + + + {!data ? ( diff --git a/frontend/src/app/Results/TestcaseLog.tsx b/frontend/src/app/Results/TestcaseLog.tsx new file mode 100644 index 00000000..d1892f2c --- /dev/null +++ b/frontend/src/app/Results/TestcaseLog.tsx @@ -0,0 +1,23 @@ +// Copyright Contributors to the Packit project. +// SPDX-License-Identifier: MIT + +import { LogViewer } from "@patternfly/react-log-viewer"; +import { useQuery } from "@tanstack/react-query"; +import { fetchLog } from "./TestingFarmPoC"; + +export const TestcaseLog: React.FC<{ testCase: Element }> = ({ testCase }) => { + const logs = Array.from(testCase.querySelectorAll("logs > log")); + const logToDisplay = logs + .find((log) => log.getAttribute("name")?.endsWith("testout.log")) + ?.getAttribute("href"); + + const { data, isInitialLoading } = useQuery([logToDisplay], () => + logToDisplay ? fetchLog(logToDisplay) : "", + ); + + if (isInitialLoading) { + return ; + } + + return ; +}; diff --git a/frontend/src/app/Results/TestingFarmPoC.tsx b/frontend/src/app/Results/TestingFarmPoC.tsx new file mode 100644 index 00000000..53e7780d --- /dev/null +++ b/frontend/src/app/Results/TestingFarmPoC.tsx @@ -0,0 +1,127 @@ +// Copyright Contributors to the Packit project. +// SPDX-License-Identifier: MIT + +import { Tab, TabTitleText, Tabs } from "@patternfly/react-core"; +import { LogViewer } from "@patternfly/react-log-viewer"; +import { useQuery } from "@tanstack/react-query"; +import { name } from "ejs"; +import { useMemo, useState } from "react"; +import { Preloader } from "../Preloader/Preloader"; + +const fetchTestingFarm = (url: string): Promise => + fetch(url).then((response) => { + if (!response.ok && response.status !== 404) { + throw Promise.reject(response); + } + return response.json(); + }); + +interface TestingFarmPoCProps { + url: string; +} +export const TestingFarmPoC: React.FC = ({ url }) => { + const { data, isError, isInitialLoading } = useQuery([url], () => + fetchTestingFarm(url), + ); + if (isInitialLoading) { + return <>Loading; + } + const xunit = new DOMParser().parseFromString(data.result.xunit, "text/xml"); + console.log(xunit); + console.log(xunit.getElementsByTagName("testsuites")); + const testsuitesDom = Array.from(xunit.getElementsByTagName("testsuites")); + const testsuiteDom = Array.from( + testsuitesDom[0].getElementsByTagName("testsuite"), + ); //.map(testSuite => <>test) + console.log(testsuiteDom); + return ( + <> + Overall status: {testsuitesDom[0].getAttribute("overall-result")} + + + ); +}; + +const TestSuiteTabs: React.FC<{ testSuitesDom: Element[] }> = ({ + testSuitesDom, +}) => { + const [activeKey, setActiveKey] = useState(0); // Toggle currently active tab + const handleTabClick = ( + event: React.MouseEvent | React.KeyboardEvent | MouseEvent, + tabIndex: string | number, + ) => { + setActiveKey(tabIndex); + }; + const t = testSuitesDom.map((testSuite, i) => { + const testsuiteTabs = Array.from( + testSuite.getElementsByTagName("testsuite"), + ).map((testSuite, j) => testSuiteTab(j, testSuite)); + return ( + + {testsuiteTabs} + + ); + }); + return <>{t}; +}; + +const testSuiteTab = (eventKey: string | number, testSuiteDom: Element) => { + const testcases = Array.from(testSuiteDom.getElementsByTagName("testcase")); + return ( + + {testSuiteDom.getAttribute("name")} -{" "} + {testSuiteDom.getAttribute("result")} + + } + > + + {testcases.map((testcase, i) => ( + + {testcase.getAttribute("name")} -{" "} + {testSuiteDom.getAttribute("result")} + + } + > + + + ))} + + + ); +}; + +const fetchLog = async (url: string): Promise => { + const response = await fetch(url); + if (!response.ok && response.status !== 404) { + throw Promise.reject(response); + } + return await response.text(); +}; + +const TestcaseLog: React.FC<{ testCase: Element }> = ({ testCase }) => { + const logs = Array.from(testCase.querySelectorAll("logs > log")); + const logToDisplay = logs + .find((log) => log.getAttribute("name")?.endsWith("testout.log")) + ?.getAttribute("href"); + + console.log("logToDisplay", logToDisplay); + const { data, isInitialLoading } = useQuery({ + queryKey: [logToDisplay], + queryFn: () => (logToDisplay ? fetchLog(logToDisplay) : ""), + enabled: !!logToDisplay, + }); + + if (isInitialLoading) { + return ; + } + + return ; +};