- Install Jest for unit testing with React Testing Library - Install Playwright for end-to-end testing - Configure Jest with proper TypeScript support and module mapping - Create test setup files and utilities for both unit and e2e tests Components: * Jest configuration with coverage thresholds * Playwright configuration with browser automation * Unit tests for LoginForm, AuthContext, and useSocketIO hook * E2E tests for authentication, dashboard, and agents workflows * GitHub Actions workflow for automated testing * Mock data and API utilities for consistent testing * Test documentation with best practices Testing features: - Unit tests with 70% coverage threshold - E2E tests with API mocking and user journey testing - CI/CD integration for automated test runs - Cross-browser testing support with Playwright - Authentication system testing end-to-end 🚀 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
64 lines
1.9 KiB
JavaScript
64 lines
1.9 KiB
JavaScript
const React = require('react');
|
|
|
|
function Ignores({ metrics, metricsToShow }) {
|
|
const metricKeys = Object.keys(metricsToShow);
|
|
const result = [];
|
|
|
|
for (let i = 0; i < metricKeys.length; i++) {
|
|
const metricKey = metricKeys[i];
|
|
if (metricsToShow[metricKey]) {
|
|
const skipped = metrics[metricKey].skipped;
|
|
if (skipped > 0) {
|
|
result.push(
|
|
`${skipped} ${metricKey}${
|
|
skipped === 1 ? '' : metricKey === 'branch' ? 'es' : 's'
|
|
}`
|
|
);
|
|
}
|
|
}
|
|
}
|
|
|
|
if (result.length === 0) {
|
|
return false;
|
|
}
|
|
|
|
return (
|
|
<div className="toolbar__item">
|
|
<span className="strong">{result.join(', ')}</span>
|
|
<span className="quiet">Ignored</span>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
function StatusMetric({ data, name }) {
|
|
return (
|
|
<div className="toolbar__item">
|
|
<span className="strong">{data.pct}%</span>{' '}
|
|
<span className="quiet">{name}</span>{' '}
|
|
<span className={'fraction ' + data.classForPercent}>
|
|
{data.covered}/{data.total}
|
|
</span>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
module.exports = function SummaryHeader({ metrics, metricsToShow }) {
|
|
return (
|
|
<div className="toolbar">
|
|
{metricsToShow.statements && (
|
|
<StatusMetric data={metrics.statements} name="Statements" />
|
|
)}
|
|
{metricsToShow.branches && (
|
|
<StatusMetric data={metrics.branches} name="Branches" />
|
|
)}
|
|
{metricsToShow.functions && (
|
|
<StatusMetric data={metrics.functions} name="Functions" />
|
|
)}
|
|
{metricsToShow.lines && (
|
|
<StatusMetric data={metrics.lines} name="Lines" />
|
|
)}
|
|
<Ignores metrics={metrics} metricsToShow={metricsToShow} />
|
|
</div>
|
|
);
|
|
};
|