Render preview for regwall, newsletter and survey prompts

src/runtime/audience-action-flow-test.js

@@ -237,7 +237,7 @@ describes.realWin('AudienceActionIframeFlow', (env) => {
             WINDOW_LOCATION_DOMAIN
           )}&configurationId=${
             configurationId === undefined ? '' : configurationId
-          }&isClosable=false&calledManually=false`,
+          }&isClosable=false&calledManually=false&previewEnabled=false`,
           {
             _client: 'SwG 0.0.0',
             productType: ProductType.SUBSCRIPTION,
@@ -271,7 +271,7 @@ describes.realWin('AudienceActionIframeFlow', (env) => {
         sandbox.match((arg) => arg.tagName == 'IFRAME'),
         `https://news.google.com/swg/ui/v1/regwalliframe?_=_&origin=${encodeURIComponent(
           WINDOW_LOCATION_DOMAIN
-        )}&configurationId=configId&isClosable=false&calledManually=false&hl=pt-BR`,
+        )}&configurationId=configId&isClosable=false&calledManually=false&previewEnabled=false&hl=pt-BR`,
         {
           _client: 'SwG 0.0.0',
           productType: ProductType.SUBSCRIPTION,
@@ -1527,7 +1527,7 @@ describes.realWin('AudienceActionIframeFlow', (env) => {
         sandbox.match((arg) => arg.tagName == 'IFRAME'),
         `https://news.google.com/swg/ui/v1/surveyiframe?_=_&origin=${encodeURIComponent(
           WINDOW_LOCATION_DOMAIN
-        )}&configurationId=&isClosable=true&calledManually=false`,
+        )}&configurationId=&isClosable=true&calledManually=false&previewEnabled=false`,
         {
           _client: 'SwG 0.0.0',
           productType: ProductType.SUBSCRIPTION,
@@ -1542,4 +1542,41 @@ describes.realWin('AudienceActionIframeFlow', (env) => {
     activitiesMock.verify();
     expect(onCancelSpy).to.not.be.called;
   });
+
+  it(`opens an AudienceActionIframeFlow and passes shouldRenderPreview in query param`, async () => {
+    sandbox.stub(runtime.storage(), 'get').resolves(null);
+    const audienceActionFlow = new AudienceActionIframeFlow(runtime, {
+      action: 'TYPE_REWARDED_SURVEY',
+      configurationId: undefined,
+      onCancel: onCancelSpy,
+      autoPromptType: AutoPromptType.SUBSCRIPTION,
+      isClosable: true,
+      calledManually: false,
+      shouldRenderPreview: true,
+    });
+    const activityIframeViewMock = sandbox.mock(
+      audienceActionFlow.activityIframeView_
+    );
+    activitiesMock
+      .expects('openIframe')
+      .withExactArgs(
+        sandbox.match((arg) => arg.tagName == 'IFRAME'),
+        `https://news.google.com/swg/ui/v1/surveyiframe?_=_&origin=${encodeURIComponent(
+          WINDOW_LOCATION_DOMAIN
+        )}&configurationId=&isClosable=true&calledManually=false&previewEnabled=true`,
+        {
+          _client: 'SwG 0.0.0',
+          productType: ProductType.SUBSCRIPTION,
+          supportsEventManager: true,
+          windowHeight: WINDOW_INNER_HEIGHT,
+        }
+      )
+      .resolves(port);
+
+    await audienceActionFlow.start();
+
+    activitiesMock.verify();
+    activityIframeViewMock.expects('getElement').once();
+    expect(onCancelSpy).to.not.be.called;
+  });
 });

src/runtime/audience-action-flow.ts

@@ -49,6 +49,7 @@ import {Toast} from '../ui/toast';
 import {feArgs, feUrl} from './services';
 import {msg} from '../utils/i18n';
 import {parseUrl} from '../utils/url';
+import {setImportantStyles} from '../utils/style';
 import {warn} from '../utils/log';
 
 export interface AudienceActionFlow {
@@ -64,6 +65,7 @@ export interface AudienceActionIframeParams {
   onResult?: (result: InterventionResult) => Promise<boolean> | boolean;
   isClosable?: boolean;
   calledManually: boolean;
+  shouldRenderPreview?: boolean;
 }
 
 // TODO: mhkawano - replace these consts in the project with these
@@ -124,6 +126,7 @@ export class AudienceActionIframeFlow implements AudienceActionFlow {
       'configurationId': this.params_.configurationId || '',
       'isClosable': (!!params_.isClosable).toString(),
       'calledManually': params_.calledManually.toString(),
+      'previewEnabled': (!!params_.shouldRenderPreview).toString(),
     };
     if (this.clientConfigManager_.shouldForceLangInIframes()) {
       iframeParams['hl'] = this.clientConfigManager_.getLanguage();
@@ -139,6 +142,12 @@ export class AudienceActionIframeFlow implements AudienceActionFlow {
       }),
       /* shouldFadeBody */ true
     );
+    // Disables interaction with prompt if rendering for preview.
+    if (!!params_.shouldRenderPreview) {
+      setImportantStyles(this.activityIframeView_.getElement(), {
+        'pointer-events': 'none',
+      });
+    }
   }
 
   /**

src/runtime/auto-prompt-manager-test.js

@@ -1606,6 +1606,7 @@ describes.realWin('AutoPromptManager', (env) => {
         autoPromptType: undefined,
         isClosable: true,
         calledManually: false,
+        shouldRenderPreview: true,
       });
     });
 
@@ -1728,6 +1729,7 @@ describes.realWin('AutoPromptManager', (env) => {
         autoPromptType: AutoPromptType.CONTRIBUTION_LARGE,
         isClosable: true,
         calledManually: false,
+        shouldRenderPreview: false,
       });
     });
 
@@ -1763,6 +1765,7 @@ describes.realWin('AutoPromptManager', (env) => {
         autoPromptType: AutoPromptType.CONTRIBUTION_LARGE,
         isClosable: true,
         calledManually: false,
+        shouldRenderPreview: false,
       });
     });
 
@@ -1806,6 +1809,7 @@ describes.realWin('AutoPromptManager', (env) => {
         autoPromptType: AutoPromptType.CONTRIBUTION_LARGE,
         isClosable: true,
         calledManually: false,
+        shouldRenderPreview: false,
       });
     });
 
@@ -1859,6 +1863,7 @@ describes.realWin('AutoPromptManager', (env) => {
         autoPromptType: AutoPromptType.CONTRIBUTION_LARGE,
         isClosable: true,
         calledManually: false,
+        shouldRenderPreview: false,
       });
     });
 
@@ -1922,6 +1927,7 @@ describes.realWin('AutoPromptManager', (env) => {
         autoPromptType: AutoPromptType.CONTRIBUTION_LARGE,
         isClosable: true,
         calledManually: false,
+        shouldRenderPreview: false,
       });
     });
 
@@ -1957,6 +1963,7 @@ describes.realWin('AutoPromptManager', (env) => {
         autoPromptType: AutoPromptType.CONTRIBUTION_LARGE,
         isClosable: true,
         calledManually: false,
+        shouldRenderPreview: false,
       });
     });
 
@@ -2011,6 +2018,7 @@ describes.realWin('AutoPromptManager', (env) => {
         autoPromptType: AutoPromptType.CONTRIBUTION_LARGE,
         isClosable: true,
         calledManually: false,
+        shouldRenderPreview: false,
       });
     });
 
@@ -2076,6 +2084,7 @@ describes.realWin('AutoPromptManager', (env) => {
         autoPromptType: AutoPromptType.CONTRIBUTION_LARGE,
         isClosable: true,
         calledManually: false,
+        shouldRenderPreview: false,
       });
     });
 
@@ -2151,6 +2160,7 @@ describes.realWin('AutoPromptManager', (env) => {
         autoPromptType: AutoPromptType.CONTRIBUTION_LARGE,
         isClosable: true,
         calledManually: false,
+        shouldRenderPreview: false,
       });
     });
 
@@ -2491,6 +2501,7 @@ describes.realWin('AutoPromptManager', (env) => {
         autoPromptType: AutoPromptType.SUBSCRIPTION_LARGE,
         isClosable: false,
         calledManually: false,
+        shouldRenderPreview: false,
       });
     });
 
@@ -2548,6 +2559,7 @@ describes.realWin('AutoPromptManager', (env) => {
         autoPromptType: AutoPromptType.SUBSCRIPTION_LARGE,
         isClosable: true,
         calledManually: false,
+        shouldRenderPreview: false,
       });
     });
 
@@ -2630,6 +2642,7 @@ describes.realWin('AutoPromptManager', (env) => {
         autoPromptType: AutoPromptType.CONTRIBUTION_LARGE,
         isClosable: true,
         calledManually: false,
+        shouldRenderPreview: false,
       });
     });
   });

src/runtime/auto-prompt-manager.ts

@@ -528,6 +528,7 @@ export class AutoPromptManager {
               autoPromptType: this.autoPromptType_,
               isClosable: this.isClosable_,
               calledManually: false,
+              shouldRenderPreview: !!this.shouldRenderOnsitePreview_,
             });
       this.setLastAudienceActionFlow(audienceActionFlow);
       audienceActionFlow.start();