Merge pull request #1460 from searchspring/ac-cached-render-event

fix: prevent autocomplete render event for cached responses, increate…

Author: korgon

packages/snap-controller/src/Autocomplete/AutocompleteController.ts

@@ -853,7 +853,8 @@ export class AutocompleteController extends AbstractController {
 			this.events[responseId] = this.events[responseId] || { product: {}, banner: {} };
 
 			const previousResponseId = this.store.results[0]?.responseId;
-			if (previousResponseId && previousResponseId === responseId) {
+			const repeatedSearch = previousResponseId && previousResponseId === responseId;
+			if (repeatedSearch) {
 				const impressedResultIds = Object.keys(this.events[responseId].product || {}).filter(
 					(resultId) => this.events[responseId].product?.[resultId]?.impression
 				);
@@ -893,8 +894,10 @@ export class AutocompleteController extends AbstractController {
 			// update the store
 			this.store.update(response);
 
-			const data: RenderSchemaData = { responseId };
-			this.config.beacon?.enabled && this.tracker.events.autocomplete.render({ data, siteId: this.config.globals?.siteId });
+			if (!repeatedSearch) {
+				const data: RenderSchemaData = { responseId };
+				this.config.beacon?.enabled && this.tracker.events.autocomplete.render({ data, siteId: this.config.globals?.siteId });
+			}
 
 			const afterStoreProfile = this.profiler.create({ type: 'event', name: 'afterStore', context: params }).start();
 

packages/snap-controller/src/utils/isClickWithinProductLink.ts

@@ -1,6 +1,6 @@
 import type { Product } from '@searchspring/snap-store-mobx';
 
-export const CLICK_DUPLICATION_TIMEOUT = 300;
+export const CLICK_DUPLICATION_TIMEOUT = 1000;
 export const CLICK_THROUGH_CLOSEST_MAX_LEVELS = 12;
 
 export const isClickWithinProductLink = (e: MouseEvent, result: Product): boolean => {

packages/snap-preact-demo/tests/cypress/e2e/tracking/track.cy.js

@@ -196,6 +196,57 @@ describe('Tracking Beacon 2.0', () => {
 		});
 	});
 
+	it('does not send autocomplete render or impression events for repeated searches', () => {
+		let renderCounter = 0;
+		let impressionCounter = 0;
+		let initialResponseId;
+		cy.intercept('POST', /beacon.searchspring.io\/beacon\/v2\/.*\/autocomplete\/render/, (req) => {
+			renderCounter++;
+			req.reply({ success: true });
+		}).as('beacon2/autocomplete/render-initial');
+		cy.intercept('POST', /beacon.searchspring.io\/beacon\/v2\/.*\/autocomplete\/impression/, (req) => {
+			impressionCounter++;
+			req.reply({ success: true });
+		}).as('beacon2/autocomplete/impression-initial');
+
+		cy.visit('https://localhost:2222');
+		cy.get('input[name="q"]').type('glas');
+
+		cy.wait(`@beacon2/autocomplete/render-initial`).then(({ request }) => {
+			const { data } = JSON.parse(request.body);
+			initialResponseId = data.responseId;
+			expect(initialResponseId).to.be.a('string').and.to.not.be.empty;
+			expect(renderCounter).to.equal(1);
+
+			// re-register intercepts to keep counting
+			cy.intercept('POST', /beacon.searchspring.io\/beacon\/v2\/.*\/autocomplete\/render/, (req) => {
+				renderCounter++;
+				req.reply({ success: true });
+			});
+		});
+		cy.wait(`@beacon2/autocomplete/impression-initial`).then(({ request }) => {
+			const { data } = JSON.parse(request.body);
+			expect(data.responseId).to.equal(initialResponseId);
+			expect(impressionCounter).to.equal(1);
+
+			cy.intercept('POST', /beacon.searchspring.io\/beacon\/v2\/.*\/autocomplete\/impression/, (req) => {
+				impressionCounter++;
+				req.reply({ success: true });
+			});
+
+			// append 's' to make 'glass' - should return cached response (same responseId)
+			cy.get('input[name="q"]').type('s');
+			cy.wait(2000).then(() => {
+				// verify the store still has the same responseId (cached response)
+				cy.snapController('autocomplete').then(({ store }) => {
+					expect(store.results.find((result) => result.type === 'product').responseId).to.equal(initialResponseId);
+				});
+				expect(renderCounter).to.equal(1);
+				expect(impressionCounter).to.equal(1);
+			});
+		});
+	});
+
 	it('tracked autocomplete impression only once per unique search query', () => {
 		let counter = 0;
 		cy.intercept('POST', /beacon.searchspring.io\/beacon\/v2\/.*\/autocomplete\/impression/, (req) => {