wip: tests d'apparition du bouton sur la page venue

src/features/offer/components/OfferContent/OfferCTAProvider.tsx

@@ -21,10 +21,15 @@ export const OfferCTAProvider: React.FC<OfferCTAProviderProps> = ({ children })
     return
   })
 
-  const setButton = useCallback((newWording: string, newOnPress: () => void) => {
-    setWording(newWording)
-    setOnPress(() => newOnPress)
-  }, [])
+  const setButton = useCallback(
+    (newWording: string, newOnPress: () => void) => {
+      if (newWording !== wording) {
+        setWording(newWording)
+        setOnPress(() => newOnPress)
+      }
+    },
+    [wording]
+  )
 
   const value = useMemo(
     () => ({ wording, onPress, setButton, showButton: setIsVisible, isButtonVisible: isVisible }),

src/features/venue/components/VenueContent/VenueContent.native.test.tsx

@@ -41,6 +41,31 @@ jest.mock('libs/location')
 jest.mock('features/search/context/SearchWrapper')
 jest.mock('libs/firebase/analytics/analytics')
 
+/**
+ * This mock permit to simulate the visibility of CTA on a movie venue
+ * it is an alternative solution which allows you to replace the scroll simulation
+ * it's not optimal, if you have better idea don't hesitate to update
+ */
+const mockInView = jest.fn()
+const InViewMock = ({
+  onChange,
+  children,
+}: {
+  onChange: VoidFunction
+  children: React.ReactNode
+}) => {
+  mockInView.mockImplementation(onChange)
+  return <React.Fragment>{children}</React.Fragment>
+}
+
+jest.mock('react-native-intersection-observer', () => {
+  return {
+    ...jest.requireActual('react-native-intersection-observer'),
+    InView: InViewMock,
+    mockInView,
+  }
+})
+
 const defaultSearchParams = {
   beginningDatetime: undefined,
   date: null,
@@ -158,15 +183,34 @@ describe('<VenueContent />', () => {
 
   describe('movie screening access button', () => {
     const venueMoviesOffersMock = { hits: VenueMoviesOffersResponseSnap, nbHits: 4 }
-
     mockFFValue = true
-    renderVenueContent({
-      venue: { ...venueDataTest, venueTypeCode: VenueTypeCodeKey.MOVIE },
-      venueOffers: venueMoviesOffersMock,
+
+    it('should show button', async () => {
+      renderVenueContent({
+        venue: { ...venueDataTest, venueTypeCode: VenueTypeCodeKey.MOVIE },
+        venueOffers: venueMoviesOffersMock,
+      })
+      await act(async () => {
+        mockInView(false)
+      })
+
+      await screen.findByText('Les films à l’affiche')
+
+      expect(await screen.findByText('Accéder aux séances')).toBeOnTheScreen()
     })
 
-    it.only('should be tested', () => {
-      expect(true).toBeTruthy()
+    it('should not show button', async () => {
+      renderVenueContent({
+        venue: { ...venueDataTest, venueTypeCode: VenueTypeCodeKey.MOVIE },
+        venueOffers: venueMoviesOffersMock,
+      })
+      await act(async () => {
+        mockInView(true)
+      })
+
+      await screen.findByText('Les films à l’affiche')
+
+      expect(screen.queryByText('Accéder aux séances')).not.toBeOnTheScreen()
     })
   })
 })

src/features/venue/components/VenueOffers/VenueOffers.tsx

@@ -39,11 +39,10 @@ const MovieScreening: React.FC<{ venueOffers: VenueOffers }> = ({ venueOffers })
   const scrollToAnchor = useScrollToAnchor()
 
   useEffect(() => {
-    console.log('yo')
     setButton('Accéder aux séances', () => {
       scrollToAnchor('venue-cine-availabilities')
     })
-  }, [setButton])
+  }, [scrollToAnchor, setButton])
 
   return (
     <React.Fragment>
@@ -73,8 +72,6 @@ export function VenueOffers({ venue, venueOffers, playlists }: Readonly<VenueOff
   )
   const enableCine = useFeatureFlag(RemoteStoreFeatureFlags.WIP_ENABLE_NEW_XP_CINE_FROM_VENUE)
 
-  console.log({ isOfferAMovieScreening, enableCine })
-
   if (areVenueOffersLoading || arePlaylistsLoading) {
     return <LoadingState />
   }