diff --git a/client/components/CandidateReview/CandidateTestPlanRun/index.jsx b/client/components/CandidateReview/CandidateTestPlanRun/index.jsx index 33024afe0..ad98d49ad 100644 --- a/client/components/CandidateReview/CandidateTestPlanRun/index.jsx +++ b/client/components/CandidateReview/CandidateTestPlanRun/index.jsx @@ -29,9 +29,12 @@ import createIssueLink, { import RunHistory from '../../common/RunHistory'; import { useUrlTestIndex } from '../../../hooks/useUrlTestIndex'; import { evaluateAuth } from '../../../utils/evaluateAuth'; +import summarizeAssertions from '../../../utils/summarizeAssertions.js'; import NotApprovedModal from '../CandidateModals/NotApprovedModal'; import FailingAssertionsSummaryTable from '../../FailingAssertionsSummary/Table'; import FailingAssertionsSummaryHeading from '../../FailingAssertionsSummary/Heading'; +import NegativeSideEffectsSummaryTable from '../../NegativeSideEffectsSummary/Table'; +import NegativeSideEffectsSummaryHeading from '../../NegativeSideEffectsSummary/Heading'; import styles from './CandidateTestPlanRun.module.css'; import feedbackStyles from '../FeedbackListItem/FeedbackListItem.module.css'; import testRunStyles from '../../TestRun/TestRun.module.css'; @@ -49,6 +52,8 @@ const vendorReviewStatusMap = { IN_PROGRESS: 'In Progress', APPROVED: 'Approved' }; +const FAILING_ASSERTIONS_INDEX = -1; +const NEGATIVE_SIDE_EFFECTS = -2; const CandidateTestPlanRun = () => { const { atId, testPlanVersionId } = useParams(); @@ -62,7 +67,7 @@ const CandidateTestPlanRun = () => { const [viewedTests, setViewedTests] = useState([]); const [testsLength, setTestsLength] = useState(0); const [currentTestIndex, setCurrentTestIndex] = useUrlTestIndex({ - minTestIndex: -1, + minTestIndex: -2, maxTestIndex: testsLength }); const [showTestNavigator, setShowTestNavigator] = useState(true); @@ -126,7 +131,9 @@ const CandidateTestPlanRun = () => { skip: !testPlanReport }); - const isSummaryView = currentTestIndex === -1; + const isSummaryView = + currentTestIndex === FAILING_ASSERTIONS_INDEX || + currentTestIndex === NEGATIVE_SIDE_EFFECTS; const isLaptopOrLarger = useMediaQuery({ query: '(min-width: 792px)' @@ -139,7 +146,7 @@ const CandidateTestPlanRun = () => { }, [data?.testPlanReports]); const handleTestClick = async index => { setCurrentTestIndex(index); - if (index === -1) { + if (index < 0) { // Summary view setIsFirstTest(false); setIsLastTest(false); @@ -403,44 +410,56 @@ const CandidateTestPlanRun = () => { const fileBugUrl = AtBugTrackerMap[at]; const getHeading = () => { + if (currentTestIndex === FAILING_ASSERTIONS_INDEX) { + return ( + <> + + Candidate Test Plan Review + + + + ); + } + + if (currentTestIndex === NEGATIVE_SIDE_EFFECTS) { + return ( + <> + + Candidate Test Plan Review + + + + ); + } + return ( -
- {isSummaryView ? ( - <> - - Candidate Test Plan Review - - - - ) : ( - <> -
- Viewing Test {currentTest.title}, Test {currentTest.seq} of{' '} - {tests.length} - {currentTest.seq === tests.length - ? 'You are on the last test.' - : ''} -
- - Reviewing Test {currentTest.seq} of {tests.length}: - -

- {`${currentTest.seq}. ${currentTest.title}`}{' '} - using {`${at}`}{' '} - {`${testPlanReport?.latestAtVersionReleasedAt?.name ?? ''}`} - {viewedTests.includes(currentTest.id) && !firstTimeViewing && ' '} - {viewedTests.includes(currentTest.id) && !firstTimeViewing && ( - - Previously Viewed - - )} -

- - )} -
+ <> +
+ Viewing Test {currentTest.title}, Test {currentTest.seq} of{' '} + {tests.length} + {currentTest.seq === tests.length ? 'You are on the last test.' : ''} +
+ + Reviewing Test {currentTest.seq} of {tests.length}: + +

+ {`${currentTest.seq}. ${currentTest.title}`}{' '} + using {`${at}`}{' '} + {`${testPlanReport?.latestAtVersionReleasedAt?.name ?? ''}`} + {viewedTests.includes(currentTest.id) && !firstTimeViewing && ' '} + {viewedTests.includes(currentTest.id) && !firstTimeViewing && ( + + Previously Viewed + + )} +

+ ); }; @@ -560,93 +579,100 @@ const CandidateTestPlanRun = () => { }; const getContent = () => { + if (currentTestIndex === FAILING_ASSERTIONS_INDEX) { + return ( +
+ `#${assertion.testIndex + 1}`} + /> +
+ ); + } + if (currentTestIndex === NEGATIVE_SIDE_EFFECTS) { + return ( +
+ `#${assertion.testIndex + 1}`} + /> +
+ ); + } return ( -
- {isSummaryView ? ( -
- `#${assertion.testIndex + 1}`} + <> +

+ {currentTest.title} +

+ + `Test Results for ${testPlanReport.browser.name}` + ), + 'Run History' + ]} + onClick={[ + () => setShowInstructions(!showInstructions), + ...showBrowserClicks, + () => setShowRunHistory(!showRunHistory) + ]} + expanded={[showInstructions, ...showBrowserBools, showRunHistory]} + disclosureContainerView={[ + , + ...testPlanReports.map(testPlanReport => { + const testResult = + testPlanReport.finalizedTestResults[currentTestIndex]; + + const assertionsSummary = summarizeAssertions( + getMetrics({ + testResult + }) + ); + + return ( + <> +

+ Test Results ({assertionsSummary}) +

+ + + ); + }), + -
- ) : ( - <> -

- {currentTest.title} -

- - `Test Results for ${testPlanReport.browser.name}` - ), - 'Run History' - ]} - onClick={[ - () => setShowInstructions(!showInstructions), - ...showBrowserClicks, - () => setShowRunHistory(!showRunHistory) - ]} - expanded={[showInstructions, ...showBrowserBools, showRunHistory]} - disclosureContainerView={[ - , - ...testPlanReports.map(testPlanReport => { - const testResult = - testPlanReport.finalizedTestResults[currentTestIndex]; - - const { - assertionsPassedCount, - mustAssertionsFailedCount, - shouldAssertionsFailedCount, - mayAssertionsFailedCount - } = getMetrics({ testResult }); - - const mustShouldAssertionsFailedCount = - mustAssertionsFailedCount + shouldAssertionsFailedCount; - - return ( - <> -

- Test Results ( - {assertionsPassedCount} passed,  - {mustShouldAssertionsFailedCount} failed,  - {mayAssertionsFailedCount} unsupported) -

- - - ); - }), - - ]} - >
- - )} -
+ ]} + > + ); }; @@ -668,14 +694,14 @@ const CandidateTestPlanRun = () => { /> - {getHeading()} +
{getHeading()}
{getTestInfo()} {getFeedback()} - {getContent()} +
{getContent()}