chore(null): make cardSelectionMessageCreator optional for all result sections

src/common/components/cards/instance-details-group.tsx

@@ -26,7 +26,7 @@ export type InstanceDetailsGroupProps = {
     rule: CardRuleResult;
     userConfigurationStoreData: UserConfigurationStoreData;
     targetAppInfo: TargetAppData;
-    cardSelectionMessageCreator: CardSelectionMessageCreator;
+    cardSelectionMessageCreator?: CardSelectionMessageCreator;
 };
 
 export const InstanceDetailsGroup = NamedFC<InstanceDetailsGroupProps>(

src/common/components/cards/instance-details.tsx

@@ -33,7 +33,7 @@ export type InstanceDetailsProps = {
     userConfigurationStoreData: UserConfigurationStoreData;
     targetAppInfo: TargetAppData;
     rule: UnifiedRule;
-    cardSelectionMessageCreator: CardSelectionMessageCreator;
+    cardSelectionMessageCreator?: CardSelectionMessageCreator;
 };
 
 export const InstanceDetails = NamedFC<InstanceDetailsProps>('InstanceDetails', props => {
@@ -63,7 +63,7 @@ export const InstanceDetails = NamedFC<InstanceDetailsProps>('InstanceDetails',
 
     const toggleSelectHandler = (event: React.SyntheticEvent): void => {
         event.stopPropagation();
-        cardSelectionMessageCreator.toggleCardSelection(result.ruleId, result.uid, event);
+        cardSelectionMessageCreator?.toggleCardSelection(result.ruleId, result.uid, event);
     };
 
     const hiddenButton = React.useRef<HTMLButtonElement>(null);
@@ -91,7 +91,7 @@ export const InstanceDetails = NamedFC<InstanceDetailsProps>('InstanceDetails',
                             {renderCardRowsForPropertyBag(result.resolution, props)}
                         </tbody>
                     </table>
-                    {isHighlightSupported && (
+                    {isHighlightSupported && cardSelectionMessageCreator !== undefined && (
                         <button
                             ref={hiddenButton}
                             onClick={toggleSelectHandler}

src/common/components/cards/result-section-content.tsx

@@ -32,7 +32,7 @@ export type ResultSectionContentProps = {
     allCardsCollapsed: boolean;
     outcomeCounter: OutcomeCounter;
     headingLevel: number;
-    cardSelectionMessageCreator: CardSelectionMessageCreator;
+    cardSelectionMessageCreator?: CardSelectionMessageCreator;
 };
 
 export const ResultSectionContent = NamedFC<ResultSectionContentProps>(
@@ -47,13 +47,19 @@ export const ResultSectionContent = NamedFC<ResultSectionContentProps>(
             targetAppInfo,
             outcomeCounter,
             headingLevel,
+            cardSelectionMessageCreator,
         } = props;
         if (results.length === 0) {
             return null;
         }
         return (
             <>
-                <deps.cardsVisualizationModifierButtons {...props} />
+                {cardSelectionMessageCreator !== undefined && (
+                    <deps.cardsVisualizationModifierButtons
+                        {...props}
+                        cardSelectionMessageCreator={cardSelectionMessageCreator!}
+                    />
+                )}
                 <RulesWithInstances
                     deps={deps}
                     rules={results}
@@ -63,7 +69,7 @@ export const ResultSectionContent = NamedFC<ResultSectionContentProps>(
                     targetAppInfo={targetAppInfo}
                     outcomeCounter={outcomeCounter}
                     headingLevel={headingLevel}
-                    cardSelectionMessageCreator={props.cardSelectionMessageCreator}
+                    cardSelectionMessageCreator={cardSelectionMessageCreator}
                 />
             </>
         );

src/common/components/cards/rule-content.tsx

@@ -17,7 +17,7 @@ export type RuleContentProps = {
     rule: CardRuleResult;
     userConfigurationStoreData: UserConfigurationStoreData;
     targetAppInfo: TargetAppData;
-    cardSelectionMessageCreator: CardSelectionMessageCreator;
+    cardSelectionMessageCreator?: CardSelectionMessageCreator;
 };
 
 export const RuleContent = NamedFC<RuleContentProps>('RuleContent', props => {

src/common/components/cards/rules-with-instances.tsx

@@ -32,7 +32,7 @@ export type RulesWithInstancesProps = {
     targetAppInfo: TargetAppData;
     outcomeCounter: OutcomeCounter;
     headingLevel: number;
-    cardSelectionMessageCreator: CardSelectionMessageCreator;
+    cardSelectionMessageCreator?: CardSelectionMessageCreator;
 };
 
 export const ruleDetailsGroupAutomationId = 'rule-details-group';
@@ -81,7 +81,7 @@ export const RulesWithInstances = NamedFC<RulesWithInstancesProps>(
                 headingLevel,
                 deps: deps,
                 onExpandToggle: (event: React.MouseEvent<HTMLDivElement>) => {
-                    cardSelectionMessageCreator.toggleRuleExpandCollapse(rule.id, event);
+                    cardSelectionMessageCreator?.toggleRuleExpandCollapse(rule.id, event);
                 },
                 isExpanded: rule.isExpanded,
             };

src/reports/components/report-sections/collapsible-result-section.tsx

@@ -21,7 +21,7 @@ export type CollapsibleResultSectionProps = RulesOnlyProps &
         deps: CollapsibleResultSectionDeps;
         containerId: string;
         containerClassName: string;
-        cardSelectionMessageCreator: CardSelectionMessageCreator;
+        cardSelectionMessageCreator?: CardSelectionMessageCreator;
         testKey?: string;
         headingLevel: HeadingLevel;
     };
@@ -39,7 +39,7 @@ export const CollapsibleResultSection = NamedFC<CollapsibleResultSectionProps>(
             deps: null,
             testKey,
             onExpandToggle: (event: React.MouseEvent<HTMLDivElement>) => {
-                cardSelectionMessageCreator.toggleRuleExpandCollapse(containerId, event);
+                cardSelectionMessageCreator?.toggleRuleExpandCollapse(containerId, event);
             },
         });
 

src/reports/components/report-sections/combined-report-failed-section.tsx

@@ -4,7 +4,6 @@
 import { CombinedReportResultSectionTitle } from 'common/components/cards/combined-report-result-section-title';
 import { ResultSectionDeps } from 'common/components/cards/result-section';
 import { ResultSectionContent } from 'common/components/cards/result-section-content';
-import { CardSelectionMessageCreator } from 'common/message-creators/card-selection-message-creator';
 import { NamedFC } from 'common/react/named-fc';
 import { CardsViewModel } from 'common/types/store-data/card-view-model';
 import { ScanMetadata } from 'common/types/store-data/unified-data-interface';
@@ -48,7 +47,6 @@ export const CombinedReportFailedSection = NamedFC<CombinedReportFailedSectionPr
                     userConfigurationStoreData={null}
                     outcomeCounter={OutcomeCounter.countByIdentifierUrls}
                     headingLevel={4}
-                    cardSelectionMessageCreator={nullCardSelectionMessageCreator}
                 />
             ),
             onExpandToggle: null,
@@ -59,11 +57,3 @@ export const CombinedReportFailedSection = NamedFC<CombinedReportFailedSectionPr
         return <div className="result-section">{CollapsibleContent}</div>;
     },
 );
-
-const nullCardSelectionMessageCreator: CardSelectionMessageCreator = {
-    toggleCardSelection: () => null,
-    toggleRuleExpandCollapse: () => null,
-    collapseAllRules: () => null,
-    expandAllRules: () => null,
-    toggleVisualHelper: () => null,
-};

src/reports/components/report-sections/combined-report-rules-only-sections.tsx

@@ -45,7 +45,7 @@ const makeCombinedReportRulesOnlySection = (options: {
                     />
                 ),
                 onExpandToggle: (event: React.MouseEvent<HTMLDivElement>) => {
-                    cardSelectionMessageCreator.toggleRuleExpandCollapse(sectionId, event);
+                    cardSelectionMessageCreator?.toggleRuleExpandCollapse(sectionId, event);
                 },
                 headingLevel: 3,
                 deps: null,

src/tests/unit/tests/common/components/cards/__snapshots__/result-section-content.test.tsx.snap

@@ -2,9 +2,65 @@
 
 exports[`ResultSectionContent does not render, no rules 1`] = `null`;
 
+exports[`ResultSectionContent renders without modifier buttons without cardSelectionMessageCreator, with some rules 1`] = `
+<React.Fragment>
+  <RulesWithInstances
+    deps={
+      Object {
+        "cardsVisualizationModifierButtons": [Function],
+      }
+    }
+    outcomeType="pass"
+    rules={
+      Array [
+        Object {
+          "description": "sample-description",
+          "guidance": Array [
+            Object {
+              "href": "sample-guidance-href",
+              "text": "sample-guidance-text",
+            },
+          ],
+          "id": "some-rule",
+          "nodes": Array [
+            Object {
+              "descriptors": Object {
+                "snippet": "this is a sample snippet",
+              },
+              "identifiers": Object {
+                "conciseName": "body img",
+                "css-selector": "body img",
+                "identifier": "body img",
+              },
+              "resolution": Object {
+                "how-to-fix-web": Object {
+                  "all": Array [],
+                  "any": Array [
+                    "Element does not have an alt attribute",
+                    "aria-label attribute does not exist or is empty",
+                    "aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty",
+                  ],
+                  "none": Array [],
+                },
+                "howToFixSummary": "sample how to fix summary",
+              },
+              "ruleId": "image-alt",
+              "status": "fail",
+              "uid": "some-guid-here",
+            },
+          ],
+          "url": "sample-url",
+        },
+      ]
+    }
+  />
+</React.Fragment>
+`;
+
 exports[`ResultSectionContent renders, with some rules 1`] = `
 <React.Fragment>
   <test
+    cardSelectionMessageCreator={Object {}}
     deps={
       Object {
         "cardsVisualizationModifierButtons": [Function],
@@ -55,6 +111,7 @@ exports[`ResultSectionContent renders, with some rules 1`] = `
     }
   />
   <RulesWithInstances
+    cardSelectionMessageCreator={Object {}}
     deps={
       Object {
         "cardsVisualizationModifierButtons": [Function],

src/tests/unit/tests/common/components/cards/result-section-content.test.tsx

@@ -32,6 +32,24 @@ describe('ResultSectionContent', () => {
         const cardsVisualizationModifierButtonsStub: Readonly<CardsVisualizationModifierButtons> =
             NamedFC<CardsVisualizationModifierButtonsProps>('test', _ => null);
 
+        const props = {
+            deps: {
+                cardsVisualizationModifierButtons: cardsVisualizationModifierButtonsStub,
+            },
+            results: someRules,
+            outcomeType: 'pass',
+            cardSelectionMessageCreator: {} as CardSelectionMessageCreator,
+        } as ResultSectionContentProps;
+
+        const wrapper = shallow(<ResultSectionContent {...props} />);
+
+        expect(wrapper.getElement()).toMatchSnapshot();
+    });
+
+    it('renders without modifier buttons without cardSelectionMessageCreator, with some rules', () => {
+        const cardsVisualizationModifierButtonsStub: Readonly<CardsVisualizationModifierButtons> =
+            NamedFC<CardsVisualizationModifierButtonsProps>('test', _ => null);
+
         const props = {
             deps: {
                 cardsVisualizationModifierButtons: cardsVisualizationModifierButtonsStub,

src/tests/unit/tests/reports/components/report-sections/__snapshots__/combined-report-failed-section.test.tsx.snap

@@ -6,7 +6,7 @@ exports[`CombinedReportFailedSection renders 1`] = `
     <CombinedResultSectionTitle outcomeCount={1} outcomeType=\\"fail\\" title=\\"Failed rules\\" />
   </div>
   <div id=\\"collapsible-content\\">
-    <ResultSectionContent deps={{...}} outcomeType=\\"fail\\" targetAppInfo={[undefined]} results={{...}} visualHelperEnabled={true} allCardsCollapsed={true} userConfigurationStoreData={{...}} outcomeCounter={[Function: countByIdentifierUrls]} headingLevel={4} cardSelectionMessageCreator={{...}} />
+    <ResultSectionContent deps={{...}} outcomeType=\\"fail\\" targetAppInfo={[undefined]} results={{...}} visualHelperEnabled={true} allCardsCollapsed={true} userConfigurationStoreData={{...}} outcomeCounter={[Function: countByIdentifierUrls]} headingLevel={4} />
   </div>
 </div>"
 `;

tsconfig.strictNullChecks.json

@@ -199,52 +199,10 @@
         "./src/common/axe-info.ts",
         "./src/common/base-store.ts",
         "./src/common/blob-provider.ts",
-        "./src/common/components/blocking-dialog.tsx",
-        "./src/common/components/body-class-modifier.tsx",
-        "./src/common/components/cards/card-interaction-support.ts",
-        "./src/common/components/cards/cards-visualization-modifier-buttons.tsx",
-        "./src/common/components/cards/collapsible-component-cards.tsx",
-        "./src/common/components/cards/expand-collapse-all-button.tsx",
-        "./src/common/components/cards/rich-resolution-content.tsx",
-        "./src/common/components/cards/rule-resources.tsx",
-        "./src/common/components/cards/simple-card-row.tsx",
-        "./src/common/components/cards/visual-helper-toggle.tsx",
-        "./src/common/components/collapsible-component.tsx",
-        "./src/common/components/contrast-checker-app-links.tsx",
-        "./src/common/components/controls/insights-command-button.tsx",
-        "./src/common/components/copy-issue-details-button.tsx",
-        "./src/common/components/enable-telemetry-setting-description.tsx",
-        "./src/common/components/expand-collapse-left-nav-hamburger-button.tsx",
-        "./src/common/components/external-link.tsx",
-        "./src/common/components/fix-instruction-panel.tsx",
-        "./src/common/components/fix-instruction-processor.tsx",
-        "./src/common/components/flagged-component.tsx",
-        "./src/common/components/focus-component.tsx",
-        "./src/common/components/guidance-links.tsx",
-        "./src/common/components/guidance-tags.tsx",
-        "./src/common/components/header-icon.tsx",
-        "./src/common/components/header.tsx",
-        "./src/common/components/heading-element-for-level.tsx",
-        "./src/common/components/heading-with-content-link.tsx",
-        "./src/common/components/issue-filing-needs-settings-help-text.tsx",
-        "./src/common/components/left-nav-hamburger-button.tsx",
-        "./src/common/components/new-tab-link-with-tooltip.tsx",
-        "./src/common/components/new-tab-link.tsx",
-        "./src/common/components/null-component.tsx",
-        "./src/common/components/privacy-statement-text.tsx",
-        "./src/common/components/recommend-color.tsx",
-        "./src/common/components/scanning-spinner/scanning-spinner.tsx",
-        "./src/common/components/selector-input-list.tsx",
-        "./src/common/components/telemetry-notice.tsx",
-        "./src/common/components/telemetry-permission-dialog.tsx",
-        "./src/common/components/theme-family-customizer.tsx",
-        "./src/common/components/theme.tsx",
-        "./src/common/components/toast.tsx",
-        "./src/common/components/visualization-toggle.tsx",
-        "./src/common/components/with-store-subscription.tsx",
         "./src/common/configs/a11y-insights-rule-resources.ts",
         "./src/common/configs/inspect-configuration-factory.ts",
         "./src/common/configs/test-mode.ts",
+        "./src/common/configs/unified-result-property-configurations.tsx",
         "./src/common/date-provider.ts",
         "./src/common/document-manipulator.ts",
         "./src/common/dropdown-click-handler.ts",
@@ -325,6 +283,7 @@
         "./src/electron/platform/android/setup/live-android-setup-deps.ts",
         "./src/electron/platform/android/test-configs/automated-checks/results-filter.ts",
         "./src/electron/platform/android/test-configs/needs-review/results-filter.ts",
+        "./src/electron/platform/android/testing-content.ts",
         "./src/electron/platform/android/unified-result-builder.ts",
         "./src/electron/types/content-page-key.ts",
         "./src/electron/types/left-nav-item-key.ts",
@@ -396,12 +355,14 @@
         "./src/injected/client-store-listener.ts",
         "./src/injected/client-utils.ts",
         "./src/injected/constants.ts",
+        "./src/injected/element-based-view-model-creator.ts",
         "./src/injected/element-finder-by-path.ts",
         "./src/injected/element-finder-by-position.ts",
         "./src/injected/extension-disabled-monitor.ts",
         "./src/injected/focus-change-handler.ts",
         "./src/injected/frame-url-controller.ts",
         "./src/injected/frame-url-finder.ts",
+        "./src/injected/get-decorated-axe-node.ts",
         "./src/injected/iframe-detector.ts",
         "./src/injected/inspect-controller.ts",
         "./src/injected/path-snippet-controller.ts",
@@ -465,7 +426,9 @@
         "./src/reports/components/report-sections/base-summary-report-section-props.ts",
         "./src/reports/components/report-sections/body-section.tsx",
         "./src/reports/components/report-sections/collapsible-script-provider.tsx",
+        "./src/reports/components/report-sections/collapsible-url-result-section.tsx",
         "./src/reports/components/report-sections/content-container.tsx",
+        "./src/reports/components/report-sections/failed-urls-section.tsx",
         "./src/reports/components/report-sections/fast-pass-results-title-section.tsx",
         "./src/reports/components/report-sections/fast-pass-title-section.tsx",
         "./src/reports/components/report-sections/footer-section.tsx",
@@ -474,6 +437,8 @@
         "./src/reports/components/report-sections/footer-text.tsx",
         "./src/reports/components/report-sections/header-section.tsx",
         "./src/reports/components/report-sections/no-failed-instances-congrats.tsx",
+        "./src/reports/components/report-sections/not-scanned-urls-section.tsx",
+        "./src/reports/components/report-sections/passed-urls-section.tsx",
         "./src/reports/components/report-sections/report-collapsible-container.tsx",
         "./src/reports/components/report-sections/report-footer.tsx",
         "./src/reports/components/report-sections/reporter-header-section.tsx",
@@ -582,6 +547,7 @@
         "src/background/injector/**/*",
         "src/common/action/**/*",
         "src/common/browser-adapters/**/*",
+        "src/common/components/**/*",
         "src/common/configuration/**/*",
         "src/common/constants/**/*",
         "src/common/flux/**/*",