testeranto 0.167.0 → 0.172.0

package/src/components/pure/TestPageView.tsx

@@ -0,0 +1,278 @@
+import React from 'react';
+import { Tab, Container, Alert, Button } from 'react-bootstrap';
+import { NavBar } from '../../NavBar';
+import { TestStatusBadge } from '../TestStatusBadge';
+
+export const TestPageView = ({
+  route,
+  setRoute,
+  navigate,
+  projectName,
+  testName,
+  decodedTestPath,
+  runtime,
+  testData,
+  logs,
+  typeErrors,
+  lintErrors,
+  testsExist,
+  errorCounts,
+}) => {
+  return (
+    <Container fluid={true}>
+      <NavBar
+        title={decodedTestPath}
+        backLink={`/projects/${projectName}`}
+        navItems={[
+          {
+            label: '',
+            badge: {
+              variant: runtime === 'node' ? 'primary' :
+                runtime === 'web' ? 'success' :
+                  'info',
+              text: runtime
+            },
+            className: 'pe-none d-flex align-items-center gap-2'
+          },
+          {
+            to: `#results`,
+            label: (
+              <TestStatusBadge
+                testName={decodedTestPath}
+                testsExist={testsExist}
+                runTimeErrors={errorCounts.runTimeErrors}
+                variant="compact"
+              />
+            ),
+            className: !testsExist || errorCounts.runTimeErrors > 0
+              ? 'text-danger fw-bold'
+              : '',
+            active: route === 'results'
+          },
+          {
+            to: `#logs`,
+            label: `Runtime logs`,
+            active: route === 'logs'
+          },
+          {
+            to: `#types`,
+            label: errorCounts.typeErrors > 0
+              ? `tsc (❌ * ${errorCounts.typeErrors})`
+              : 'tsc ✅ ',
+            active: route === 'types'
+          },
+          {
+            to: `#lint`,
+            label: errorCounts.staticErrors > 0
+              ? `eslint (❌ *${errorCounts.staticErrors}) `
+              : 'eslint ✅',
+            active: route === 'lint'
+          },
+        ]}
+        rightContent={
+          <Button
+            variant="info"
+            onClick={async () => {
+              try {
+                const promptPath = `testeranto/reports/${projectName}/${testName.split('.').slice(0, -1).join('.')}/${runtime}/prompt.txt`;
+                const messagePath = `testeranto/reports/${projectName}/${testName.split('.').slice(0, -1).join('.')}/${runtime}/message.txt`;
+                const command = `aider --load ${promptPath} --message-file ${messagePath}`;
+                await navigator.clipboard.writeText(command);
+                alert("Copied aider command to clipboard!");
+              } catch (err) {
+                alert("Failed to copy command to clipboard");
+                console.error("Copy failed:", err);
+              }
+            }}
+            className="ms-2"
+          >
+            🤖
+          </Button>
+        }
+      />
+
+      <Tab.Container activeKey={route} onSelect={(k) => {
+        if (k) {
+          setRoute(k);
+          navigate(`#${k}`, { replace: true });
+        }
+      }}>
+        <Tab.Content className="mt-3">
+          <Tab.Pane eventKey="results">
+            {!testsExist ? (
+              <Alert variant="danger" className="mt-3">
+                <h4>Tests did not run to completion</h4>
+                <p>The test results file (tests.json) was not found or could not be loaded.</p>
+                <div className="mt-3">
+                  <Button
+                    variant="outline-light"
+                    onClick={() => setRoute('logs')}
+                    className="me-2"
+                  >
+                    View Runtime Logs
+                  </Button>
+                  <Button
+                    variant="outline-light"
+                    onClick={() => navigate(`/projects/${projectName}#${runtime}`)}
+                  >
+                    View Build Logs
+                  </Button>
+                </div>
+              </Alert>
+            ) : testData ? (
+              <div className="test-results">
+                {testData.givens.map((given, i) => (
+                  <div key={i} className="mb-4 card">
+                    <div className="card-header bg-primary text-white">
+                      <div className="d-flex justify-content-between align-items-center">
+                        <h4>Given: {given.name}</h4>
+                        {given.artifacts?.length > 0 && (
+                          <div className="dropdown">
+                            <button
+                              className="btn btn-sm btn-light dropdown-toggle"
+                              type="button"
+                              data-bs-toggle="dropdown"
+                            >
+                              Artifacts ({given.artifacts.length})
+                            </button>
+                            <ul className="dropdown-menu dropdown-menu-end">
+                              {given.artifacts.map((artifact, ai) => (
+                                <li key={ai}>
+                                  <a
+                                    className="dropdown-item"
+                                    href={`/testeranto/reports/${projectName}/${testName.split('.').slice(0, -1).join('.')}/${runtime}/${artifact}`}
+                                    target="_blank"
+                                    rel="noopener noreferrer"
+                                  >
+                                    {artifact.split('/').pop()}
+                                  </a>
+                                </li>
+                              ))}
+                            </ul>
+                          </div>
+                        )}
+                      </div>
+                    </div>
+                    <div className="card-body">
+                      {given.whens.map((when, j) => (
+                        <div key={`w-${j}`} className={`p-3 mb-2 ${when.error ? 'bg-danger text-white' : 'bg-success text-white'}`}>
+                          <div className="d-flex justify-content-between align-items-start">
+                            <div>
+                              <strong>When:</strong> {when.name}
+                              {when.error && <pre className="mt-2">{when.error}</pre>}
+                            </div>
+                            {when.artifacts?.length > 0 && (
+                              <div className="ms-3">
+                                <strong>Artifacts:</strong>
+                                <ul className="list-unstyled">
+                                  {when.artifacts.map((artifact, ai) => (
+                                    <li key={ai}>
+                                      <a
+                                        href={`/testeranto/reports/${projectName}/${testName.split('.').slice(0, -1).join('.')}/${runtime}/${artifact}`}
+                                        target="_blank"
+                                        className="text-white"
+                                        rel="noopener noreferrer"
+                                      >
+                                        {artifact.split('/').pop()}
+                                      </a>
+                                    </li>
+                                  ))}
+                                </ul>
+                              </div>
+                            )}
+                          </div>
+                        </div>
+                      ))}
+                      {given.thens.map((then, k) => (
+                        <div key={`t-${k}`} className={`p-3 mb-2 ${then.error ? 'bg-danger text-white' : 'bg-success text-white'}`}>
+                          <div className="d-flex justify-content-between align-items-start">
+                            <div>
+                              <strong>Then:</strong> {then.name}
+                              {then.error && <pre className="mt-2">{then.error}</pre>}
+                            </div>
+                            {then.artifacts?.length > 0 && (
+                              <div className="ms-3">
+                                <strong>Artifacts:</strong>
+                                <ul className="list-unstyled">
+                                  {then.artifacts.map((artifact, ai) => (
+                                    <li key={ai}>
+                                      <a
+                                        href={`/testeranto/reports/${projectName}/${testName.split('.').slice(0, -1).join('.')}/${runtime}/${artifact}`}
+                                        target="_blank"
+                                        className="text-white"
+                                        rel="noopener noreferrer"
+                                      >
+                                        {artifact.split('/').pop()}
+                                      </a>
+                                    </li>
+                                  ))}
+                                </ul>
+                              </div>
+                            )}
+                          </div>
+                        </div>
+                      ))}
+                    </div>
+                  </div>
+                ))}
+              </div>
+            ) : (
+              <Alert variant="warning">No test results found</Alert>
+            )}
+          </Tab.Pane>
+          <Tab.Pane eventKey="logs">
+            {logs === undefined ? (
+              <Alert variant="danger">
+                <h4>Logs file missing</h4>
+                <p>The runtime logs file (logs.txt) was not found.</p>
+                <p>This suggests the test may not have executed properly.</p>
+              </Alert>
+            ) : logs === '' ? (
+              <Alert variant="success">
+                <h4>No runtime logs</h4>
+                <p>The test executed successfully with no log output.</p>
+              </Alert>
+            ) : (
+              <pre className="bg-dark text-white p-3">{logs}</pre>
+            )}
+          </Tab.Pane>
+          <Tab.Pane eventKey="types">
+            {typeErrors ? (
+              <pre className="bg-dark text-white p-3">{typeErrors}</pre>
+            ) : (
+              <Alert variant="warning">No type errors found</Alert>
+            )}
+          </Tab.Pane>
+          <Tab.Pane eventKey="lint">
+            {lintErrors ? (
+              <pre className="bg-dark text-white p-3">{lintErrors}</pre>
+            ) : (
+              <Alert variant="warning">No lint errors found</Alert>
+            )}
+          </Tab.Pane>
+          <Tab.Pane eventKey="coverage">
+            <div className="coverage-report">
+              <Alert variant="info">
+                Coverage reports coming soon!
+              </Alert>
+              <div className="coverage-stats">
+                <div className="stat-card bg-success text-white">
+                  <h4>85%</h4>
+                  <p>Lines Covered</p>
+                </div>
+                <div className="stat-card bg-warning text-dark">
+                  <h4>72%</h4>
+                  <p>Branches Covered</p>
+                </div>
+                <div className="stat-card bg-info text-white">
+                  <h4>91%</h4>
+                  <p>Functions Covered</p>
+                </div>
+              </div>
+            </div>
+          </Tab.Pane>
+        </Tab.Content>
+      </Tab.Container>
+    </Container>
+  );
+};

package/src/components/stateful/ProjectPage.tsx

@@ -0,0 +1,83 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import React, { useEffect, useState } from 'react';
+import { useParams, useNavigate, useLocation } from 'react-router-dom';
+import { ProjectPageView } from '../pure/ProjectPageView';
+import { ISummary } from '../../Types';
+
+export const ProjectPage = () => {
+  const [summary, setSummary] = useState<ISummary | null>(null);
+  const [nodeLogs, setNodeLogs] = useState<any>(null);
+  const [webLogs, setWebLogs] = useState<any>(null);
+  const [pureLogs, setPureLogs] = useState<any>(null);
+  const [config, setConfig] = useState<object>({});
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+  const [projectName, setProjectName] = useState('');
+  const navigate = useNavigate();
+  const location = useLocation();
+  const [route, setRoute] = useState('tests');
+
+  useEffect(() => {
+    const hash = location.hash.replace('#', '');
+    if (hash && ['tests', 'node', 'web', 'pure'].includes(hash)) {
+      setRoute(hash);
+    } else {
+      setRoute('tests');
+    }
+  }, [location.hash]);
+
+  const { projectName: name } = useParams();
+
+  useEffect(() => {
+    if (!name) return;
+    setProjectName(name);
+
+    const fetchData = async () => {
+      try {
+        const [summaryRes, nodeRes, webRes, pureRes, configRes] = await Promise.all([
+          fetch(`reports/${name}/summary.json`),
+          fetch(`bundles/node/${name}/metafile.json`),
+          fetch(`bundles/web/${name}/metafile.json`),
+          fetch(`bundles/pure/${name}/metafile.json`),
+          fetch(`reports/${name}/config.json`)
+        ]);
+
+        const [summaryData, nodeData, webData, pureData, configData] = await Promise.all([
+          summaryRes.ok ? summaryRes.json() : {},
+          nodeRes.ok ? nodeRes.json() : { errors: ["Failed to load node build logs"] },
+          webRes.ok ? webRes.json() : { errors: ["Failed to load web build logs"] },
+          pureRes.ok ? pureRes.json() : { errors: ["Failed to load pure build logs"] },
+          configRes.ok ? configRes.json() : { tests: [] }
+        ]);
+
+        setSummary(summaryData);
+        setNodeLogs(nodeData);
+        setWebLogs(webData);
+        setPureLogs(pureData);
+        setConfig(configData);
+      } catch (err) {
+        setError(err instanceof Error ? err.message : 'Unknown error');
+      } finally {
+        setLoading(false);
+      }
+    };
+
+    fetchData();
+  }, [name]);
+
+  return (
+    <ProjectPageView
+      summary={summary}
+      nodeLogs={nodeLogs}
+      webLogs={webLogs}
+      pureLogs={pureLogs}
+      config={config}
+      loading={loading}
+      error={error}
+      projectName={projectName}
+      route={route}
+      setRoute={setRoute}
+      navigate={navigate}
+    />
+  );
+};

package/src/components/stateful/ProjectsPage.tsx

@@ -0,0 +1,73 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import React, { useEffect, useState } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { ProjectsPageView } from '../pure/ProjectsPageView';
+import { ISummary } from '../../Types';
+
+export const ProjectsPage = () => {
+  const [projects, setProjects] = useState<any[]>([]);
+  const [summaries, setSummaries] = useState<Record<string, ISummary>>({});
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+  const [configs, setConfigs] = useState<Record<string, object>>({});
+  const navigate = useNavigate();
+
+  useEffect(() => {
+    const fetchProjects = async () => {
+      try {
+        const projectsRes = await fetch(`projects.json`);
+        const projectNames = await projectsRes.json();
+
+        const projectsData = await Promise.all(
+          projectNames.map(async (name) => {
+            const [summaryRes, nodeRes, webRes, pureRes, configRes] = await Promise.all([
+              fetch(`reports/${name}/summary.json`),
+              fetch(`bundles/node/${name}/metafile.json`),
+              fetch(`bundles/web/${name}/metafile.json`),
+              fetch(`bundles/pure/${name}/metafile.json`),
+              fetch(`reports/${name}/config.json`),
+            ]);
+
+            const [summary, nodeData, webData, pureData, configData] = await Promise.all([
+              summaryRes.json(),
+              nodeRes.ok ? nodeRes.json() : { errors: ["Failed to load node build logs"] },
+              webRes.ok ? webRes.json() : { errors: ["Failed to load web build logs"] },
+              pureRes.ok ? pureRes.json() : { errors: ["Failed to load pure build logs"] },
+              configRes.json(),
+            ]);
+
+            setSummaries(prev => ({ ...prev, [name]: summary }));
+            setConfigs(prev => ({ ...prev, [name]: configData }));
+
+            return {
+              name,
+              testCount: Object.keys(summary).length,
+              nodeStatus: nodeData.errors?.length ? 'failed' : nodeData.warnings?.length ? 'warning' : 'success',
+              webStatus: webData.errors?.length ? 'failed' : webData.warnings?.length ? 'warning' : 'success',
+              pureStatus: pureData.errors?.length ? 'failed' : pureData.warnings?.length ? 'warning' : 'success',
+            };
+          })
+        );
+
+        setProjects(projectsData);
+      } catch (err) {
+        setError(err instanceof Error ? err.message : 'Unknown error');
+      } finally {
+        setLoading(false);
+      }
+    };
+
+    fetchProjects();
+  }, []);
+
+  return (
+    <ProjectsPageView
+      projects={projects}
+      summaries={summaries}
+      configs={configs}
+      loading={loading}
+      error={error}
+      navigate={navigate}
+    />
+  );
+};

package/src/components/stateful/TestPage.tsx

@@ -0,0 +1,107 @@
+import React, { useEffect, useState } from 'react';
+import { useLocation, useNavigate, useParams } from 'react-router-dom';
+
+import { TestPageView } from '../pure/TestPageView';
+import { fetchTestData } from '../../utils/api';
+
+export const TestPage = () => {
+  const navigate = useNavigate();
+  const location = useLocation();
+  const [route, setRoute] = useState('results');
+
+  // Sync route with hash changes
+  useEffect(() => {
+    const hash = location.hash.replace('#', '');
+    if (hash && ['results', 'logs', 'types', 'lint', 'coverage'].includes(hash)) {
+      setRoute(hash);
+    } else {
+      setRoute('results');
+    }
+  }, [location.hash]);
+
+  const [testName, setTestName] = useState('');
+  const [testData, setTestData] = useState(null);
+  const [logs, setLogs] = useState('');
+  const [typeErrors, setTypeErrors] = useState('');
+  const [lintErrors, setLintErrors] = useState('');
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(null);
+  const [testsExist, setTestsExist] = useState(true);
+  const [errorCounts, setErrorCounts] = useState({
+    typeErrors: 0,
+    staticErrors: 0,
+    runTimeErrors: 0
+  });
+  const [summary, setSummary] = useState(null);
+
+  const { projectName, '*': splat } = useParams();
+  const pathParts = splat ? splat.split('/') : [];
+  const runtime = pathParts.pop() || '';
+  const testPath = pathParts.join('/');
+  const decodedTestPath = testPath ? decodeURIComponent(testPath) : '';
+
+  useEffect(() => {
+    if (!projectName || !testPath || !runtime) return;
+    setTestName(testPath);
+
+    const fetchData = async () => {
+      try {
+        const testResponse = await fetchTestData(projectName, testPath, runtime);
+        setTestData(testResponse.testData);
+        setTestsExist(!!testResponse.testData);
+        setLogs(testResponse.logs === null ? undefined : testResponse.logs);
+        setTypeErrors(testResponse.typeErrors);
+        setLintErrors(testResponse.lintErrors);
+
+        try {
+          const summaryResponse = await fetch(`reports/${projectName}/summary.json`);
+          if (!summaryResponse.ok) throw new Error('Failed to fetch summary');
+          const allSummaries = await summaryResponse.json();
+          const testSummary = allSummaries[testPath];
+
+          if (testSummary) {
+            const counts = {
+              typeErrors: Number(testSummary.typeErrors) || 0,
+              staticErrors: Number(testSummary.staticErrors) || 0,
+              runTimeErrors: Number(testSummary.runTimeErrors) || 0
+            };
+
+            setSummary(testSummary);
+            setErrorCounts(counts);
+            setTestsExist(testSummary.testsExist !== false);
+          }
+        } catch (err) {
+          console.error('Failed to load summary:', err);
+        }
+      } catch (err) {
+        setError(err instanceof Error ? err.message : 'Unknown error');
+        setTestsExist(false);
+      } finally {
+        setLoading(false);
+      }
+    };
+
+    fetchData();
+  }, []);
+
+  return (
+    <TestPageView
+      route={route}
+      setRoute={setRoute}
+      navigate={navigate}
+      projectName={projectName}
+      testName={testName}
+      decodedTestPath={decodedTestPath}
+      runtime={runtime}
+      testData={testData}
+      logs={logs}
+      typeErrors={typeErrors}
+      lintErrors={lintErrors}
+      loading={loading}
+      error={error}
+      testsExist={testsExist}
+      errorCounts={errorCounts}
+      summary={summary}
+    />
+  );
+};

package/src/lib/BaseSuite.test/test.ts

@@ -432,7 +432,7 @@ export const testAdapter: ITestAdapter<I> = {
 
       return result;
     } catch (e) {
-      console.error("Then error:", e);
+      console.error("Then error:", e.toString());
       console.error("Full store state:", JSON.stringify(store, null, 2));
       throw e;
     }

package/src/lib/BaseSuite.ts

@@ -19,13 +19,18 @@ export abstract class BaseSuite<I extends Ibdd_in_any, O extends Ibdd_out_any> {
     if (!suiteName) {
       throw new Error("BaseSuite requires a non-empty name");
     }
-    console.log("[DEBUG] BaseSuite constructor - name:", suiteName, "index:", index);
+    console.log(
+      "[DEBUG] BaseSuite constructor - name:",
+      suiteName,
+      "index:",
+      index
+    );
     this.name = suiteName;
     this.index = index;
     this.givens = givens;
     this.fails = 0;
     console.log("[DEBUG] BaseSuite initialized:", this.name, this.index);
-    console.log("[DEBUG] BaseSuite givens:", Object.keys(givens));
+    console.log("[DEBUG] BaseSuite givens:", Object.keys(givens).toString());
   }
 
   public features() {
@@ -36,7 +41,7 @@ export abstract class BaseSuite<I extends Ibdd_in_any, O extends Ibdd_out_any> {
         .filter((value, index, array) => {
           return array.indexOf(value) === index;
         });
-      console.debug("[DEBUG] Features extracted:", features);
+      console.debug("[DEBUG] Features extracted:", features.toString());
       return features || [];
     } catch (e) {
       console.error("[ERROR] Failed to extract features:", e);
@@ -114,7 +119,7 @@ export abstract class BaseSuite<I extends Ibdd_in_any, O extends Ibdd_out_any> {
         .catch((e) => {
           this.failed = true;
           this.fails = this.fails + 1;
-          console.error("Given error 1:", e);
+          // console.error("Given error 1:", e.toString());
           throw e;
         });
     }