Add test for rendering the "no audiences" banner.

google · Sep 18, 2024 · 3737fe3 · 3737fe3
1 parent 64de8a3
commit 3737fe3
Show file tree

Hide file tree

Showing 2 changed files with 87 additions and 0 deletions.
diff --git a/...ents/audience-segmentation/dashboard/AudienceTilesWidget/__snapshots__/index.test.js.snap b/...ents/audience-segmentation/dashboard/AudienceTilesWidget/__snapshots__/index.test.js.snap
@@ -365,6 +365,67 @@ exports[`AudienceTilesWidget should not render audiences that are not available
 </div>
 `;
 
+exports[`AudienceTilesWidget should not the "no audiences" banner when there is no matching audience 1`] = `
+<div>
+  <div
+    class="googlesitekit-widget googlesitekit-widget--analyticsAudienceTiles googlesitekit-widget--no-padding"
+  >
+    <div
+      class="googlesitekit-widget__body"
+    >
+      <div
+        class="googlesitekit-lean-cta-banner googlesitekit-no-audience-banner"
+      >
+        <div
+          class="googlesitekit-lean-cta-banner__body"
+        >
+          <div
+            class="googlesitekit-lean-cta-banner__body-icon"
+          >
+            <svg />
+          </div>
+          <div
+            class="googlesitekit-lean-cta-banner__body-content"
+          >
+            <p>
+              You don’t have any visitor groups selected. 
+              <button
+                class="googlesitekit-cta-link googlesitekit-cta-link--secondary"
+              >
+                <span
+                  class="googlesitekit-cta-link__contents"
+                >
+                  Select groups
+                </span>
+              </button>
+              .
+            </p>
+            <p>
+              You can deactivate this widget in 
+              <button
+                class="googlesitekit-cta-link googlesitekit-cta-link--secondary"
+              >
+                <span
+                  class="googlesitekit-cta-link__contents"
+                >
+                  Settings
+                </span>
+              </button>
+              .
+            </p>
+          </div>
+        </div>
+        <div
+          class="googlesitekit-lean-cta-banner__graphic"
+        >
+          <svg />
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
 exports[`AudienceTilesWidget should render correctly when there is partial data for Site Kit audiences 1`] = `
 <div>
   <div

diff --git a/.../analytics-4/components/audience-segmentation/dashboard/AudienceTilesWidget/index.test.js b/.../analytics-4/components/audience-segmentation/dashboard/AudienceTilesWidget/index.test.js
@@ -263,6 +263,32 @@ describe( 'AudienceTilesWidget', () => {
 		} );
 	} );
 
+	it( 'should not the "no audiences" banner when there is no matching audience', async () => {
+		registry
+			.dispatch( MODULES_ANALYTICS_4 )
+			.setAvailableAudiences( availableAudiences );
+
+		registry.dispatch( CORE_USER ).receiveGetAudienceSettings( {
+			configuredAudiences: [ 'properties/12345/audiences/9' ],
+			isAudienceSegmentationWidgetHidden: false,
+		} );
+
+		const { container, getByText, waitForRegistry } = render(
+			<WidgetWithComponentProps />,
+			{
+				registry,
+			}
+		);
+
+		await waitForRegistry();
+
+		expect(
+			getByText( /You don’t have any visitor groups selected./ )
+		).toBeInTheDocument();
+
+		expect( container ).toMatchSnapshot();
+	} );
+
 	it( 'should render when configured audience is matching available audiences', async () => {
 		const configuredAudiences = [ 'properties/12345/audiences/1' ];