Merge branch 'development' into talkback-prototyping

Author: howard-e

CHANGELOG.md

@@ -1,3 +1,19 @@
+## [1.17.0](https://github.com/w3c/aria-at-app/compare/v1.16.0...v1.17.0) (2025-07-01)
+
+
+### Features
+
+* add at versions and browser version to conflicts table ([#1445](https://github.com/w3c/aria-at-app/issues/1445)) ([5e1cae6](https://github.com/w3c/aria-at-app/commit/5e1cae6bf1db07dfc8a5cd0f55e6c776e0bfec2e))
+
+
+### Bug Fixes
+
+* Allow admins to approve Candidate Reports ([#1428](https://github.com/w3c/aria-at-app/issues/1428)) ([27fe7f2](https://github.com/w3c/aria-at-app/commit/27fe7f2ac5b9e7e8d71ef46f97b0ea95ee5ab332))
+* Fix negative side effect phrases in test plan reports ([#1438](https://github.com/w3c/aria-at-app/issues/1438)) ([d7a7663](https://github.com/w3c/aria-at-app/commit/d7a7663348ef3be9b9379b94619ea6b63090958d))
+* improve feedback on results of automated report update ([#1441](https://github.com/w3c/aria-at-app/issues/1441)) ([511a73a](https://github.com/w3c/aria-at-app/commit/511a73a067fce805e484bc978a5169483046a0fb))
+* Improve form UI for untestable assertions ([#1446](https://github.com/w3c/aria-at-app/issues/1446)) ([f391bf8](https://github.com/w3c/aria-at-app/commit/f391bf8451f47aec7246cc16870bb413c92e8a72))
+* table row minimum at fix ([#1443](https://github.com/w3c/aria-at-app/issues/1443)) ([6e1709a](https://github.com/w3c/aria-at-app/commit/6e1709ae4c2911254d080032803c3b34cd8d8cad))
+
 ## [1.16.0](https://github.com/w3c/aria-at-app/compare/v1.15.2...v1.16.0) (2025-06-16)
 
 ### Features

client/components/CandidateReview/CandidateModals/ProvideFeedbackModal/index.jsx

@@ -16,8 +16,7 @@ const ProvideFeedbackModal = ({
   changesRequestedIssues = [],
   changesRequestedGithubUrl = '',
   testPlan = '',
-  username = '',
-  isAdmin = false
+  username = ''
 }) => {
   const [selectedRadio, setSelectedRadio] = useState('not-approved-input');
 
@@ -71,8 +70,6 @@ const ProvideFeedbackModal = ({
                   name="radio-feedback"
                   id="approve-input"
                   type="radio"
-                  disabled={isAdmin}
-                  aria-disabled={isAdmin}
                 />
                 <FormCheck.Label htmlFor="approve-input">
                   Approve
@@ -124,8 +121,7 @@ ProvideFeedbackModal.propTypes = {
   feedbackGithubUrl: PropTypes.string,
   show: PropTypes.bool,
   testPlan: PropTypes.string,
-  username: PropTypes.string,
-  isAdmin: PropTypes.bool
+  username: PropTypes.string
 };
 
 export default ProvideFeedbackModal;

client/components/CandidateReview/CandidateTestPlanRun/index.jsx

@@ -35,6 +35,8 @@ import FailingAssertionsSummaryTable from '../../FailingAssertionsSummary/Table'
 import FailingAssertionsSummaryHeading from '../../FailingAssertionsSummary/Heading';
 import NegativeSideEffectsSummaryTable from '../../NegativeSideEffectsSummary/Table';
 import NegativeSideEffectsSummaryHeading from '../../NegativeSideEffectsSummary/Heading';
+import UntestableAssertionsSummaryTable from '../../UntestableAssertionsSummary/Table';
+import UntestableAssertionsSummaryHeading from '../../UntestableAssertionsSummary/Heading';
 import styles from './CandidateTestPlanRun.module.css';
 import feedbackStyles from '../FeedbackListItem/FeedbackListItem.module.css';
 import testRunStyles from '../../TestRun/TestRun.module.css';
@@ -52,8 +54,7 @@ const vendorReviewStatusMap = {
   IN_PROGRESS: 'In Progress',
   APPROVED: 'Approved'
 };
-const FAILING_ASSERTIONS_INDEX = -1;
-const NEGATIVE_SIDE_EFFECTS = -2;
+const SUMMARY_OF_FAILURES_INDEX = -1;
 
 const CandidateTestPlanRun = () => {
   const { atId, testPlanVersionId } = useParams();
@@ -67,7 +68,7 @@ const CandidateTestPlanRun = () => {
   const [viewedTests, setViewedTests] = useState([]);
   const [testsLength, setTestsLength] = useState(0);
   const [currentTestIndex, setCurrentTestIndex] = useUrlTestIndex({
-    minTestIndex: -2,
+    minTestIndex: SUMMARY_OF_FAILURES_INDEX,
     maxTestIndex: testsLength
   });
   const [showTestNavigator, setShowTestNavigator] = useState(true);
@@ -122,7 +123,6 @@ const CandidateTestPlanRun = () => {
   );
 
   const auth = evaluateAuth(data?.me ? data?.me : {});
-  const { isAdmin } = auth;
   const { data: reviewerStatusData } = useQuery(REVIEWER_STATUS_QUERY, {
     variables: {
       userId: auth.id,
@@ -131,9 +131,22 @@ const CandidateTestPlanRun = () => {
     skip: !testPlanReport
   });
 
-  const isSummaryView =
-    currentTestIndex === FAILING_ASSERTIONS_INDEX ||
-    currentTestIndex === NEGATIVE_SIDE_EFFECTS;
+  const isSummaryView = currentTestIndex === SUMMARY_OF_FAILURES_INDEX;
+
+  const shouldShowFailingAssertionsSummary = useMemo(() => {
+    return (
+      testPlanReport?.metrics.mustAssertionsFailedCount > 0 ||
+      testPlanReport?.metrics.shouldAssertionsFailedCount > 0
+    );
+  }, [testPlanReport]);
+
+  const shouldShowNegativeSideEffectsSummary = useMemo(() => {
+    return testPlanReport?.metrics.unexpectedBehaviorCount > 0;
+  }, [testPlanReport]);
+
+  const shouldShowUntestableAssertionsSummary = useMemo(() => {
+    return testPlanReport?.metrics.assertionsUntestableCount > 0;
+  }, [testPlanReport]);
 
   const isLaptopOrLarger = useMediaQuery({
     query: '(min-width: 792px)'
@@ -320,7 +333,7 @@ const CandidateTestPlanRun = () => {
   const { recommendedPhaseTargetDate } = testPlanVersion;
 
   const pageTitlePrefix = isSummaryView
-    ? 'Summary of Failing Assertions'
+    ? 'Summary of Failures'
     : `${currentTestIndex + 1}. ${currentTest?.title}`;
 
   const pageTitle = `${pageTitlePrefix} | ${testPlanVersion.title} | Candidate Review | ARIA-AT`;
@@ -410,30 +423,14 @@ const CandidateTestPlanRun = () => {
   const fileBugUrl = AtBugTrackerMap[at];
 
   const getHeading = () => {
-    if (currentTestIndex === FAILING_ASSERTIONS_INDEX) {
+    if (currentTestIndex === SUMMARY_OF_FAILURES_INDEX) {
       return (
         <>
           <span className={testRunStyles.taskLabel}>
             Candidate Test Plan Review
           </span>
-          <FailingAssertionsSummaryHeading
-            metrics={testPlanReport.metrics}
-            as="h1"
-          />
-        </>
-      );
-    }
 
-    if (currentTestIndex === NEGATIVE_SIDE_EFFECTS) {
-      return (
-        <>
-          <span className={testRunStyles.taskLabel}>
-            Candidate Test Plan Review
-          </span>
-          <NegativeSideEffectsSummaryHeading
-            metrics={testPlanReport.metrics}
-            as="h1"
-          />
+          <h1>Summary of Failures</h1>
         </>
       );
     }
@@ -579,34 +576,72 @@ const CandidateTestPlanRun = () => {
   };
 
   const getContent = () => {
-    if (currentTestIndex === FAILING_ASSERTIONS_INDEX) {
+    if (currentTestIndex === SUMMARY_OF_FAILURES_INDEX) {
       return (
-        <div
-          className={
-            failingAssertionsSummaryStyles.failingAssertionsSummaryTableContainer
-          }
-        >
-          <FailingAssertionsSummaryTable
-            testPlanReport={testPlanReports[0]}
-            atName={at}
-            getLinkUrl={assertion => `#${assertion.testIndex + 1}`}
-          />
-        </div>
-      );
-    }
-    if (currentTestIndex === NEGATIVE_SIDE_EFFECTS) {
-      return (
-        <div
-          className={
-            failingAssertionsSummaryStyles.failingAssertionsSummaryTableContainer
-          }
-        >
-          <NegativeSideEffectsSummaryTable
-            testPlanReport={testPlanReports[0]}
-            atName={at}
-            getLinkUrl={assertion => `#${assertion.testIndex + 1}`}
-          />
-        </div>
+        <>
+          {shouldShowFailingAssertionsSummary && (
+            <>
+              <FailingAssertionsSummaryHeading
+                metrics={testPlanReport.metrics}
+                as="h2"
+              />
+
+              <div
+                className={
+                  failingAssertionsSummaryStyles.failingAssertionsSummaryTableContainer
+                }
+              >
+                <FailingAssertionsSummaryTable
+                  testPlanReport={testPlanReports[0]}
+                  atName={at}
+                  getLinkUrl={assertion => `#${assertion.testIndex + 1}`}
+                />
+              </div>
+            </>
+          )}
+
+          {shouldShowNegativeSideEffectsSummary && (
+            <>
+              <NegativeSideEffectsSummaryHeading
+                metrics={testPlanReport.metrics}
+                as="h2"
+              />
+
+              <div
+                className={
+                  failingAssertionsSummaryStyles.failingAssertionsSummaryTableContainer
+                }
+              >
+                <NegativeSideEffectsSummaryTable
+                  testPlanReport={testPlanReports[0]}
+                  atName={at}
+                  getLinkUrl={assertion => `#${assertion.testIndex + 1}`}
+                />
+              </div>
+            </>
+          )}
+
+          {shouldShowUntestableAssertionsSummary && (
+            <>
+              <UntestableAssertionsSummaryHeading
+                metrics={testPlanReport.metrics}
+                as="h2"
+              />
+
+              <div
+                className={
+                  failingAssertionsSummaryStyles.failingAssertionsSummaryTableContainer
+                }
+              >
+                <UntestableAssertionsSummaryTable
+                  testPlanReport={testPlanReports[0]}
+                  atName={at}
+                  getLinkUrl={assertion => `#${assertion.testIndex + 1}`}
+                />
+              </div>
+            </>
+          )}
+        </>
       );
     }
     return (
@@ -827,7 +862,6 @@ const CandidateTestPlanRun = () => {
           changesRequestedGithubUrl={changesRequestedGithubUrl}
           handleAction={submitApproval}
           handleHide={() => setFeedbackModalShowing(false)}
-          isAdmin={isAdmin}
         />
       )}
       {!!confirmationModal && confirmationModal}

client/components/ManageBotRunDialog/WithButton.jsx

@@ -4,7 +4,6 @@ import { Button } from 'react-bootstrap';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faRobot } from '@fortawesome/free-solid-svg-icons';
 import ManageBotRunDialog from '.';
-import { useTestPlanRunIsFinished } from '../../hooks/useTestPlanRunIsFinished';
 import { TestPlanRunPropType, UserPropType } from '../common/proptypes';
 
 const ManageBotRunDialogWithButton = ({
@@ -14,11 +13,7 @@ const ManageBotRunDialogWithButton = ({
   testers,
   onChange
 }) => {
-  const { runIsFinished } = useTestPlanRunIsFinished(testPlanRun.id);
   const [showDialog, setShowDialog] = useState(false);
-  if (runIsFinished) {
-    return null;
-  }
 
   return (
     <>

client/components/Reports/SummarizeTestPlanReport.jsx

@@ -27,6 +27,8 @@ import FailingAssertionsSummaryTable from '../FailingAssertionsSummary/Table';
 import FailingAssertionsSummaryHeading from '../FailingAssertionsSummary/Heading';
 import NegativeSideEffectsSummaryTable from '../NegativeSideEffectsSummary/Table';
 import NegativeSideEffectsSummaryHeading from '../NegativeSideEffectsSummary/Heading';
+import UntestableAssertionsSummaryTable from '../UntestableAssertionsSummary/Table';
+import UntestableAssertionsSummaryHeading from '../UntestableAssertionsSummary/Heading';
 import styles from './SummarizeTestPlanReport.module.css';
 import commonStyles from '../common/styles.module.css';
 
@@ -209,6 +211,31 @@ const SummarizeTestPlanReport = ({ testPlanVersion, testPlanReports }) => {
     );
   };
 
+  const renderUntestableAssertionsSummary = () => {
+    // Use truthiness check (rather than strict equality to zero) in order to
+    // support legacy reports whose metrics have been memoized and thus do not
+    // include properties for untestable assertions.
+    if (
+      !testPlanReport.metrics.mustAssertionsUntestableCount &&
+      !testPlanReport.metrics.shouldAssertionsUntestableCount
+    ) {
+      return null;
+    }
+
+    return (
+      <>
+        <UntestableAssertionsSummaryHeading metrics={testPlanReport.metrics} />
+        <UntestableAssertionsSummaryTable
+          testPlanReport={testPlanReport}
+          atName={testPlanReport.at.name}
+          getLinkUrl={assertion =>
+            `/report/${testPlanVersion.id}/targets/${testPlanReport.id}#result-${assertion.testResultId}`
+          }
+        />
+      </>
+    );
+  };
+
   return (
     <Container id="main" as="main" tabIndex="-1">
       <Helmet>
@@ -285,6 +312,7 @@ const SummarizeTestPlanReport = ({ testPlanVersion, testPlanReports }) => {
       {renderResultsForTargetTable()}
       {renderFailingAssertionsSummary()}
       {renderNegativeSideEffectsSummary()}
+      {renderUntestableAssertionsSummary()}
       {testPlanReport.finalizedTestResults.map((testResult, index) => {
         const test = testResult.test;
 

client/components/TestPlanReportStatusDialog/index.jsx

@@ -42,27 +42,27 @@ const TestPlanReportStatusDialog = ({
     return { requiredReportsCount: requiredCount, sortedStatuses: sorted };
   }, [testPlanReportStatuses]);
 
-  const [tableRowMinimumAtVersions, setTableRowMinimumAtVersions] = useState(
-    sortedStatuses.map((status, index) => ({
-      index,
-      minimumAtVersion: status.minimumAtVersion
-    }))
+  // Track only user overrides for minimum AT versions using Map to avoid array sync issues
+  const [minimumAtVersionOverrides, setMinimumAtVersionOverrides] = useState(
+    new Map()
   );
 
   const tableRowMinimumAtVersionChange = (index, newMinimumAtVersion) => {
-    setTableRowMinimumAtVersions(prevRows =>
-      prevRows.map(row =>
-        row.index === index
-          ? { ...row, minimumAtVersion: newMinimumAtVersion }
-          : row
-      )
-    );
+    setMinimumAtVersionOverrides(prev => {
+      const next = new Map(prev);
+      next.set(index, newMinimumAtVersion);
+      return next;
+    });
+  };
+
+  const getMinimumAtVersionForIndex = (index, status) => {
+    return minimumAtVersionOverrides.get(index) || status.minimumAtVersion;
   };
 
   const tableRows = sortedStatuses.map((status, index) => {
     const { isRequired, at, browser, exactAtVersion, testPlanReport } = status;
 
-    const minimumAtVersion = tableRowMinimumAtVersions[index].minimumAtVersion;
+    const minimumAtVersion = getMinimumAtVersionForIndex(index, status);
 
     const key =
       `${at.name}-${browser.name}-` +