From f652535fd458ef6dee1c54d43163518b3d9da341 Mon Sep 17 00:00:00 2001 From: Omar Alshaker Date: Fri, 10 Jan 2025 23:12:26 +0100 Subject: [PATCH 1/2] Stepper: ignore ref changes --- .../internals/hooks/use-sign-up-start-tracking/index.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/client/landing/stepper/declarative-flow/internals/hooks/use-sign-up-start-tracking/index.tsx b/client/landing/stepper/declarative-flow/internals/hooks/use-sign-up-start-tracking/index.tsx index f9cb2b411d875..873e40b626f99 100644 --- a/client/landing/stepper/declarative-flow/internals/hooks/use-sign-up-start-tracking/index.tsx +++ b/client/landing/stepper/declarative-flow/internals/hooks/use-sign-up-start-tracking/index.tsx @@ -1,5 +1,4 @@ import { useEffect } from 'react'; -import { useSearchParams } from 'react-router-dom'; import { STEPPER_TRACKS_EVENT_SIGNUP_START } from 'calypso/landing/stepper/constants'; import recordSignupStart from 'calypso/landing/stepper/declarative-flow/internals/analytics/record-signup-start'; import useSnakeCasedKeys from 'calypso/landing/stepper/utils/use-snake-cased-keys'; @@ -16,8 +15,6 @@ interface Props { } export const useSignUpStartTracking = ( { flow }: Props ) => { - const [ queryParams ] = useSearchParams(); - const ref = queryParams.get( 'ref' ) || ''; const flowName = flow.name; const flowVariant = flow.variantSlug; const isSignupFlow = flow.isSignupFlow; @@ -50,6 +47,9 @@ export const useSignUpStartTracking = ( { flow }: Props ) => { return; } + // Read the ref here to avoid re-rendering the hook when it changes. + const ref = new URLSearchParams( window.location.search ).get( 'ref' ) || ''; + recordSignupStart( { flow: flowName, ref, @@ -58,5 +58,5 @@ export const useSignUpStartTracking = ( { flow }: Props ) => { ...( flowVariant && { flow_variant: flowVariant } ), }, } ); - }, [ isSignupFlow, flowName, ref, signupStartEventProps, isLoading, flowVariant ] ); + }, [ isSignupFlow, flowName, signupStartEventProps, isLoading, flowVariant ] ); }; From 1621a29e72a76be1e9fc597eaf3e5cab6da51691 Mon Sep 17 00:00:00 2001 From: Omar Alshaker Date: Fri, 10 Jan 2025 23:28:59 +0100 Subject: [PATCH 2/2] Fix test --- .../hooks/use-sign-up-start-tracking/test/index.tsx | 13 ++++++++----- 1 file changed, 8 insertions(+), 5 deletions(-) diff --git a/client/landing/stepper/declarative-flow/internals/hooks/use-sign-up-start-tracking/test/index.tsx b/client/landing/stepper/declarative-flow/internals/hooks/use-sign-up-start-tracking/test/index.tsx index d3ed2a5de96b5..94b5dbd5a167a 100644 --- a/client/landing/stepper/declarative-flow/internals/hooks/use-sign-up-start-tracking/test/index.tsx +++ b/client/landing/stepper/declarative-flow/internals/hooks/use-sign-up-start-tracking/test/index.tsx @@ -43,11 +43,14 @@ const render = ( { flow, queryParams = {} } ) => { flow, } ), { - wrapper: ( { children } ) => ( - - { children } - - ), + wrapper: ( { children } ) => { + // The hook depends on window.location.search to determine the query params. + Reflect.deleteProperty( global.window, 'location' ); + window.location = new URL( + 'https://example.com/' + addQueryArgs( `/setup/${ flow.name }`, queryParams ) + ) as unknown as Location; + return { children }; + }, } ); };