fix: add banner for unresponsive iframes

src/DetailsView/components/iframe-skipped-warning.tsx

@@ -0,0 +1,13 @@
+// Copyright (c) Microsoft Corporation. All rights reserved.
+// Licensed under the MIT License.
+import { NamedFC } from 'common/react/named-fc';
+import * as React from 'react';
+
+export const IframeSkippedWarningContainerAutomationId = 'iframe-skipped-warning-container';
+
+export const IframeSkippedWarning = NamedFC('IframeSkippedWarning', () => (
+    <div data-automation-id={IframeSkippedWarningContainerAutomationId}>
+        There are iframes in the target page that are non-responsive. These frames have been skipped
+        and are not included in results.
+    </div>
+));

src/DetailsView/components/warning-configuration.tsx

@@ -2,6 +2,7 @@
 // Licensed under the MIT License.
 import { ReactFCWithDisplayName } from 'common/react/named-fc';
 import { ScanIncompleteWarningId } from 'common/types/store-data/scan-incomplete-warnings';
+import { IframeSkippedWarning } from 'DetailsView/components/iframe-skipped-warning';
 import {
     AssessmentIframeWarning,
     AssessmentIframeWarningDeps,
@@ -24,8 +25,10 @@ export type WarningConfiguration = {
 
 export const assessmentWarningConfiguration: WarningConfiguration = {
     'missing-required-cross-origin-permissions': AssessmentIframeWarning,
+    'frame-skipped': IframeSkippedWarning,
 };
 
 export const fastpassWarningConfiguration: WarningConfiguration = {
     'missing-required-cross-origin-permissions': FastPassIframeWarning,
+    'frame-skipped': IframeSkippedWarning,
 };

src/common/types/store-data/scan-incomplete-warnings.ts

@@ -2,4 +2,4 @@
 // Licensed under the MIT License.
 
 // This is a string-enum, but we only have one type right now
-export type ScanIncompleteWarningId = 'missing-required-cross-origin-permissions';
+export type ScanIncompleteWarningId = 'missing-required-cross-origin-permissions' | 'frame-skipped';

src/injected/analyzers/base-analyzer.ts

@@ -49,7 +49,7 @@ export class BaseAnalyzer implements Analyzer {
             scanResult: originalAxeResult,
             testType: config.testType,
             scanIncompleteWarnings:
-                this.scanIncompleteWarningDetector.detectScanIncompleteWarnings(),
+                this.scanIncompleteWarningDetector.detectScanIncompleteWarnings(originalAxeResult),
         };
 
         return {

src/injected/analyzers/notification-text-creator.ts

@@ -16,7 +16,7 @@ export class NotificationTextCreator {
     };
 
     public needsReviewText: TextGenerator = (results: UnifiedResult[]) => {
-        const warnings = this.scanIncompleteWarningDetector.detectScanIncompleteWarnings();
+        const warnings = this.scanIncompleteWarningDetector.detectScanIncompleteWarnings(null);
         if (isEmpty(results) && isEmpty(warnings)) {
             return 'Congratulations!\n\nNeeds review found no instances to review on this page.';
         }

src/injected/analyzers/unified-result-sender.ts

@@ -64,7 +64,7 @@ export class UnifiedResultSender {
         notificationMessage: TextGenerator,
     ): UnifiedScanCompletedPayload => {
         const scanIncompleteWarnings =
-            this.scanIncompleteWarningDetector.detectScanIncompleteWarnings();
+            this.scanIncompleteWarningDetector.detectScanIncompleteWarnings(results);
 
         let telemetry: ScanIncompleteWarningsTelemetryData = null;
 

src/injected/scan-incomplete-warning-detector.ts

@@ -3,6 +3,7 @@
 import { BaseStore } from 'common/base-store';
 import { PermissionsStateStoreData } from 'common/types/store-data/permissions-state-store-data';
 import { ScanIncompleteWarningId } from 'common/types/store-data/scan-incomplete-warnings';
+import { ScanResults } from 'scanner/iruleresults';
 import { IframeDetector } from './iframe-detector';
 
 export class ScanIncompleteWarningDetector {
@@ -11,14 +12,20 @@ export class ScanIncompleteWarningDetector {
         private permissionsStateStore: BaseStore<PermissionsStateStoreData, Promise<void>>,
     ) {}
 
-    public detectScanIncompleteWarnings = () => {
+    public detectScanIncompleteWarnings = (results: ScanResults | null) => {
         const warnings: ScanIncompleteWarningId[] = [];
+
         if (
             this.iframeDetector.hasIframes() &&
             !this.permissionsStateStore.getState().hasAllUrlAndFilePermissions
         ) {
             warnings.push('missing-required-cross-origin-permissions');
         }
+
+        if (results && results.framesSkipped) {
+            warnings.push('frame-skipped');
+        }
+
         return warnings;
     };
 }

src/scanner/iruleresults.d.ts

@@ -91,6 +91,7 @@ export interface ScanResults {
     timestamp: string;
     targetPageUrl: string;
     targetPageTitle: string;
+    framesSkipped?: boolean;
 }
 
 export interface RuleDecorations {

src/scanner/result-decorator.ts

@@ -29,6 +29,7 @@ export class ResultDecorator {
             timestamp: results.timestamp,
             targetPageUrl: results.url,
             targetPageTitle: this.documentUtils.title(),
+            framesSkipped: results.incomplete.some(result => result.id === 'frame-tested'),
         };
 
         return scanResults;

src/scanner/scan-parameter-generator.ts

@@ -20,11 +20,11 @@ export class ScanParameterGenerator {
         };
 
         if (options == null || options.testsToRun == null) {
-            result.runOnly!.values = Object.keys(this.rulesIncluded).filter(
-                id => this.rulesIncluded[id].status === 'included',
-            );
+            result.runOnly!.values = Object.keys(this.rulesIncluded)
+                .filter(id => this.rulesIncluded[id].status === 'included')
+                .concat('frame-tested');
         } else {
-            result.runOnly!.values = options.testsToRun;
+            result.runOnly!.values = options.testsToRun.concat('frame-tested');
         }
 
         return result;

src/tests/unit/tests/DetailsView/components/__snapshots__/iframe-skipped-warning.test.tsx.snap

@@ -0,0 +1,9 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`IframeSkippedWarning render 1`] = `
+<div
+  data-automation-id="iframe-skipped-warning-container"
+>
+  There are iframes in the target page that are non-responsive. These frames have been skipped and are not included in results.
+</div>
+`;

src/tests/unit/tests/DetailsView/components/iframe-skipped-warning.test.tsx

@@ -0,0 +1,12 @@
+// Copyright (c) Microsoft Corporation. All rights reserved.
+// Licensed under the MIT License.
+import { IframeSkippedWarning } from 'DetailsView/components/iframe-skipped-warning';
+import { shallow } from 'enzyme';
+import * as React from 'react';
+
+describe('IframeSkippedWarning', () => {
+    test('render', () => {
+        const wrapper = shallow(<IframeSkippedWarning />);
+        expect(wrapper.getElement()).toMatchSnapshot();
+    });
+});

src/tests/unit/tests/DetailsView/components/scan-incomplete-warning.test.tsx

@@ -26,6 +26,7 @@ describe('ScanIncompleteWarning', () => {
             NamedFC<ScanIncompleteWarningMessageBarProps>('test', _ => null);
         warningConfiguration = {
             'missing-required-cross-origin-permissions': scanIncompleteWarningStub,
+            'frame-skipped': scanIncompleteWarningStub,
         };
     });
 

src/tests/unit/tests/injected/analyzers/base-analyzer.test.ts

@@ -51,7 +51,7 @@ describe('BaseAnalyzer', () => {
         };
 
         scanIncompleteWarningDetectorMock
-            .setup(idm => idm.detectScanIncompleteWarnings())
+            .setup(idm => idm.detectScanIncompleteWarnings(undefined))
             .returns(() => scanIncompleteWarnings);
 
         sendMessageMock

src/tests/unit/tests/injected/analyzers/batched-rule-analyzer.test.ts

@@ -65,7 +65,7 @@ describe('BatchedRuleAnalyzer', () => {
             .returns(() => scopingState)
             .verifiable();
         scanIncompleteWarningDetectorMock
-            .setup(idm => idm.detectScanIncompleteWarnings())
+            .setup(idm => idm.detectScanIncompleteWarnings(It.isAny()))
             .returns(() => []);
     });
 

src/tests/unit/tests/injected/analyzers/notification-text-creator.test.ts

@@ -42,7 +42,7 @@ describe('NotificationTextCreator', () => {
         'generates text for needs review with results: $unifiedResults and warnings: $testScanWarnings',
         ({ unifiedResults, testScanWarnings, expectedText }) => {
             scanIncompleteWarningDetectorMock
-                .setup(m => m.detectScanIncompleteWarnings())
+                .setup(m => m.detectScanIncompleteWarnings(null))
                 .returns(() => testScanWarnings);
 
             expect(testSubject.needsReviewText(unifiedResults)).toEqual(expectedText);
@@ -64,7 +64,7 @@ describe('NotificationTextCreator', () => {
         'generates null for automated checks with $unifiedResults and $testScanWarnings', // automated checks uses notifications generated from visualizationMessages.Common.ScanCompleted
         ({ unifiedResults, testScanWarnings }) => {
             scanIncompleteWarningDetectorMock
-                .setup(m => m.detectScanIncompleteWarnings())
+                .setup(m => m.detectScanIncompleteWarnings(null))
                 .returns(testScanWarnings);
 
             expect(testSubject.automatedChecksText(unifiedResults)).toEqual(null);

src/tests/unit/tests/injected/analyzers/rule-analyzer.test.ts

@@ -74,7 +74,7 @@ describe('RuleAnalyzer', () => {
             .returns(() => scopingState)
             .verifiable();
         scanIncompleteWarningDetectorMock
-            .setup(idm => idm.detectScanIncompleteWarnings())
+            .setup(idm => idm.detectScanIncompleteWarnings(It.isAny()))
             .returns(() => []);
     });
 

src/tests/unit/tests/injected/analyzers/tab-stops-analyzer.test.ts

@@ -64,7 +64,7 @@ describe('TabStopsAnalyzer', () => {
         tabStopsRequirementResultProcessorMock = Mock.ofType<TabStopsRequirementResultProcessor>();
 
         scanIncompleteWarningDetectorMock
-            .setup(idm => idm.detectScanIncompleteWarnings())
+            .setup(idm => idm.detectScanIncompleteWarnings(It.isAny()))
             .returns(() => []);
 
         testSubject = new TabStopsAnalyzer(

src/tests/unit/tests/injected/analyzers/unified-result-sender.test.ts

@@ -111,7 +111,7 @@ describe('sendConvertedResults', () => {
                         .setup(m => m(inputResults))
                         .returns(val => unifiedRules);
                     scanIncompleteWarningDetectorMock
-                        .setup(m => m.detectScanIncompleteWarnings())
+                        .setup(m => m.detectScanIncompleteWarnings(inputResults))
                         .returns(() => warnings);
                     filterNeedsReviewResultsMock
                         .setup(m => m(axeInputResults))

src/tests/unit/tests/injected/scan-incomplete-warning-detector.test.ts

@@ -4,6 +4,7 @@ import { BaseStore } from 'common/base-store';
 import { PermissionsStateStoreData } from 'common/types/store-data/permissions-state-store-data';
 import { IframeDetector } from 'injected/iframe-detector';
 import { ScanIncompleteWarningDetector } from 'injected/scan-incomplete-warning-detector';
+import { ScanResults } from 'scanner/iruleresults';
 import { IMock, Mock } from 'typemoq';
 
 describe('ScanIncompleteWarningDetector', () => {
@@ -35,7 +36,22 @@ describe('ScanIncompleteWarningDetector', () => {
                 .setup(m => m.getState())
                 .returns(() => ({ hasAllUrlAndFilePermissions }));
 
-            expect(testSubject.detectScanIncompleteWarnings()).toStrictEqual(expectedResults);
+            expect(testSubject.detectScanIncompleteWarnings(null)).toStrictEqual(expectedResults);
+        },
+    );
+
+    it('should detect no frames skipped if results are null', () => {
+        expect(testSubject.detectScanIncompleteWarnings(null)).toStrictEqual([]);
+    });
+
+    it.each([true, false])(
+        'should detect frames skipped correctly if results frames skipped is %s',
+        (resultsFramesSkipped: boolean) => {
+            const results = { framesSkipped: resultsFramesSkipped } as ScanResults;
+
+            expect(testSubject.detectScanIncompleteWarnings(results)).toStrictEqual(
+                resultsFramesSkipped ? ['frame-skipped'] : [],
+            );
         },
     );
 });

src/tests/unit/tests/scanner/result-decorator.test.ts

@@ -88,6 +88,7 @@ describe('ResultDecorator', () => {
                 timestamp: 100,
                 targetPageTitle: 'test title',
                 targetPageUrl: 'https://test_url',
+                framesSkipped: false,
             };
 
             messageDecoratorMock
@@ -168,6 +169,7 @@ describe('ResultDecorator', () => {
                 timestamp: 100,
                 targetPageTitle: 'test title',
                 targetPageUrl: 'https://test_url',
+                framesSkipped: false,
             };
 
             tagToLinkMapperMock
@@ -240,6 +242,7 @@ describe('ResultDecorator', () => {
                 timestamp: 100,
                 targetPageTitle: 'test title',
                 targetPageUrl: 'https://test_url',
+                framesSkipped: false,
             };
 
             instanceStub.nodes = [];
@@ -271,4 +274,43 @@ describe('ResultDecorator', () => {
             messageDecoratorMock.verifyAll();
         });
     });
+
+    describe('decorateResults: with incomplete results', () => {
+        it('should set framesSkipped', () => {
+            const incompleteInstance = {
+                id: 'frame-tested',
+                nodes: [],
+                description: null,
+                tags: ['tag2'],
+            };
+            const guidanceLinkStub = {} as any;
+            const tagToLinkMapper = () => [guidanceLinkStub];
+            const emptyResultsStub = {
+                passes: [],
+                violations: [],
+                inapplicable: [],
+                incomplete: [],
+                timestamp: 100,
+                targetPageTitle: 'test title',
+                targetPageUrl: 'https://test_url',
+                framesSkipped: true,
+            };
+            messageDecoratorMock.setup(mdm => mdm.decorateResultWithMessages(It.isAny()));
+            ruleProcessorMock
+                .setup(m => m.suppressChecksByMessages(It.isAny(), It.isAny()))
+                .returns(result => {
+                    return null;
+                });
+            const testSubject = new ResultDecorator(
+                documentUtilsMock.object,
+                messageDecoratorMock.object,
+                getHelpUrlMock.object,
+                tagToLinkMapper,
+                ruleProcessorMock.object,
+            );
+            nonEmptyResultStub.incomplete = [incompleteInstance];
+            const decoratedResult = testSubject.decorateResults(nonEmptyResultStub);
+            expect(decoratedResult).toEqual(emptyResultsStub);
+        });
+    });
 });

src/tests/unit/tests/scanner/scan-parameter-generator.test.ts

@@ -33,7 +33,7 @@ describe('ScanParameterGenerator', () => {
                 restoreScroll: true,
                 runOnly: {
                     type: 'rule',
-                    values: ['rule-a', 'rule-b'],
+                    values: ['rule-a', 'rule-b', 'frame-tested'],
                 },
                 pingWaitTime: FRAME_COMMUNICATION_TIMEOUT_MS,
             };
@@ -48,7 +48,7 @@ describe('ScanParameterGenerator', () => {
                 restoreScroll: true,
                 runOnly: {
                     type: 'rule',
-                    values: ['rule-a', 'rule-b'],
+                    values: ['rule-a', 'rule-b', 'frame-tested'],
                 },
                 pingWaitTime: FRAME_COMMUNICATION_TIMEOUT_MS,
             };
@@ -64,7 +64,7 @@ describe('ScanParameterGenerator', () => {
                 restoreScroll: true,
                 runOnly: {
                     type: 'rule',
-                    values: ['ruleA', 'ruleB'],
+                    values: ['ruleA', 'ruleB', 'frame-tested'],
                 },
                 pingWaitTime: FRAME_COMMUNICATION_TIMEOUT_MS,
             };