@playpilot/tpi 8.17.1 → 8.19.0

package/src/tests/routes/components/Editorial/PlaylinkTypeSelect.test.js

@@ -11,6 +11,8 @@ describe('PlaylinkTypeSelect.svelte', () => {
     sentence: 'Some sentence',
     playpilot_url: 'https://playpilot.com/movie/example-3/',
     key: 'some-key',
+    /** @type {import('$lib/types/injection').LinkInjectionDataType} */
+    type: 'title',
   }
 
   beforeEach(() => {

package/src/tests/routes/components/InjectionPopover.test.js

@@ -0,0 +1,117 @@
+import { render  } from '@testing-library/svelte'
+import { describe, expect, it, vi, beforeEach, afterEach } from 'vitest'
+
+import InjectionPopover from '../../../routes/components/InjectionPopover.svelte'
+import { participants, title } from '$lib/fakeData'
+import { track } from '$lib/tracking'
+import { TrackingEvent } from '$lib/enums/TrackingEvent'
+import { hasConsentedTo } from '$lib/consent'
+
+vi.mock('$lib/consent', () => ({
+  hasConsentedTo: vi.fn(() => true),
+}))
+
+vi.mock('$lib/tracking', () => ({
+  track: vi.fn(),
+}))
+
+vi.mock('$lib/pixel', () => ({
+  isPixelAllowed: vi.fn(),
+}))
+
+vi.mock('$lib/api/participants', () => ({
+  fetchParticipantsForTitle: vi.fn(),
+}))
+
+vi.mock('$lib/api/titles', () => ({
+  fetchSimilarTitles: vi.fn(),
+}))
+
+describe('InjectionPopover.svelte', () => {
+  beforeEach(() => {
+    vi.resetAllMocks()
+    vi.mocked(hasConsentedTo).mockImplementation(() => true)
+  })
+
+  afterEach(() => {
+    vi.useRealTimers()
+  })
+
+  it('Should render top scroll ad when given', () => {
+    // @ts-ignore
+    window.PlayPilotLinkInjections = { ads: [{ campaign_format: 'top_scroll', content: {}, cta: {} }] }
+
+    const event = new MouseEvent('mouseenter')
+    const { container } = render(InjectionPopover, { event, type: 'title', data: title })
+
+    expect(container.querySelector('.top-scroll')).toBeTruthy()
+  })
+
+  it('Should not render top scroll ad when not given', () => {
+    // @ts-ignore
+    window.PlayPilotLinkInjections = { ads: null }
+
+    const event = new MouseEvent('mouseenter')
+    const { container } = render(InjectionPopover, { event, type: 'title', data: title })
+
+    expect(container.querySelector('.top-scroll')).not.toBeTruthy()
+  })
+
+  describe('Title type', () => {
+    it('Should render the given title', () => {
+      const event = new MouseEvent('mouseenter')
+      const { getByText } = render(InjectionPopover, { event, type: 'title', data: title })
+
+      expect(getByText(title.title)).toBeTruthy()
+    })
+
+    it('Should call track function when rendered', () => {
+      const event = new MouseEvent('mouseenter')
+      render(InjectionPopover, { event, type: 'title', data: title })
+
+      expect(track).toHaveBeenCalledWith(TrackingEvent.InjectionPopoverView, title, { type: 'title' })
+    })
+
+    it('Should call track function with time_spent when destroyed', async () => {
+      vi.useFakeTimers()
+
+      const event = new MouseEvent('mouseenter')
+      const { unmount } = render(InjectionPopover, { event, type: 'title', data: title })
+
+      vi.advanceTimersByTime(200)
+      unmount()
+
+      expect(track).toHaveBeenCalledWith(TrackingEvent.InjectionPopoverClose, title, expect.objectContaining({ time_spent: 200, type: 'title' }))
+    })
+  })
+
+  describe('Participant type', () => {
+    const participant = participants[0]
+
+    it('Should render the given participant', () => {
+      const event = new MouseEvent('mouseenter')
+      const { getByText } = render(InjectionPopover, { event, type: 'participant', data: participant })
+
+      expect(getByText(participant.name)).toBeTruthy()
+    })
+
+    it('Should call track function when rendered', () => {
+      const event = new MouseEvent('mouseenter')
+      render(InjectionPopover, { event, type: 'participant', data: participant })
+
+      expect(track).toHaveBeenCalledWith(TrackingEvent.InjectionPopoverView, null, { type: 'participant', participant: participant.name })
+    })
+
+    it('Should call track function with time_spent when destroyed', async () => {
+      vi.useFakeTimers()
+
+      const event = new MouseEvent('mouseenter')
+      const { unmount } = render(InjectionPopover, { event, type: 'participant', data: participant })
+
+      vi.advanceTimersByTime(200)
+      unmount()
+
+      expect(track).toHaveBeenCalledWith(TrackingEvent.InjectionPopoverClose, null, expect.objectContaining({ type: 'participant', time_spent: 200, participant: participant.name }))
+    })
+  })
+})

package/src/tests/routes/components/ListTitle.test.js

@@ -50,6 +50,13 @@ describe('ListTitle.svelte', () => {
     expect(onclick).toHaveBeenCalled()
   })
 
+  it('Should render as small variant when given', () => {
+    const { container } = render(ListTitle, { title, compact: true })
+
+    expect(container.querySelector('.compact')).toBeTruthy()
+    expect(container.querySelector('.description')).not.toBeTruthy()
+  })
+
   describe('Playlinks', () => {
     const playlinks = [
       { name: 'Some playlink', logo_url: 'logo', extra_info: { category: 'SVOD' } },

package/src/tests/routes/components/Participant.test.js

@@ -73,4 +73,11 @@ describe('Participant.svelte', () => {
 
     expect(fetchTitlesForParticipant).toHaveBeenCalledWith(participants[0], { page: 2 })
   })
+
+  it('Should render as small variant when given', () => {
+    const { container, queryByText } = render(Participant, { participant: participants[0], small: true })
+
+    expect(queryByText('Credits')).not.toBeTruthy()
+    expect(container.querySelector('.small')).toBeTruthy()
+  })
 })

package/src/tests/routes/components/Playlinks/AfterArticlePlaylinks.test.js

@@ -23,6 +23,8 @@ const linkInjections = [{
   poster: 'some-poster',
   key: 'some-key-1',
   title_details: title,
+  /** @type {import('$lib/types/injection').LinkInjectionDataType} */
+  type: 'title',
 }, {
   sid: '2',
   title: 'a sentence',
@@ -31,6 +33,8 @@ const linkInjections = [{
   poster: 'some-poster',
   key: 'some-key-1',
   title_details: title,
+  /** @type {import('$lib/types/injection').LinkInjectionDataType} */
+  type: 'title',
 }]
 
 describe('AfterArticlePlaylinks.svelte', () => {

package/src/tests/routes/components/Playlinks/Playlinks.test.js

@@ -85,7 +85,7 @@ describe('Playlinks.svelte', () => {
 
     await fireEvent.click(getByText(playlinks[0].name))
 
-    expect(track).toHaveBeenCalledWith(TrackingEvent.TitlePopoverPlaylinkClick, title, { playlink: playlinks[0].name })
+    expect(track).toHaveBeenCalledWith(TrackingEvent.InjectionPopoverPlaylinkClick, title, { playlink: playlinks[0].name })
   })
 
   it('Should call track function for modal when clicked inside of modal scope', async () => {
@@ -176,4 +176,54 @@ describe('Playlinks.svelte', () => {
     expect(getByText('Streaming services'))
     expect(getByTestId('category-SVOD').querySelectorAll('[data-playlink]')).toHaveLength(1)
   })
+
+  it('Should limit number of shown playlinks and shown all playlinks after click of show more button', async () => {
+    const playlinks = [
+      { name: 'Some playlink', logo_url: 'logo', extra_info: { category: 'SVOD' } },
+      { name: 'Some playlink', logo_url: 'logo', extra_info: { category: 'SVOD' } },
+      { name: 'Some playlink', logo_url: 'logo', extra_info: { category: 'SVOD' } },
+      { name: 'Some playlink', logo_url: 'logo', extra_info: { category: 'SVOD' } },
+    ]
+
+    // @ts-ignore
+    const { getAllByText, getByText, getByTestId } = render(Playlinks, { playlinks, title, limit: 3 })
+
+    expect(getAllByText('Some playlink')).toHaveLength(3)
+    expect(getByTestId('show-more')).toBeTruthy()
+
+    await fireEvent.click(getByText('Show 1 more'))
+
+    expect(getAllByText('Some playlink')).toHaveLength(4)
+  })
+
+  it('Should not render show more button if fewer playlinks than limit are given', () => {
+    const playlinks = [
+      { name: 'Some playlink', logo_url: 'logo', extra_info: { category: 'SVOD' } },
+      { name: 'Some playlink', logo_url: 'logo', extra_info: { category: 'SVOD' } },
+    ]
+
+    // @ts-ignore
+    const { queryByTestId } = render(Playlinks, { playlinks, title, limit: 3 })
+
+    expect(queryByTestId('show-more')).not.toBeTruthy()
+  })
+
+  it('Should not render show more button if playlinks are categorized', () => {
+    // @ts-ignore
+    window.PlayPilotLinkInjections = {
+      config: { categorize_playlinks: true },
+    }
+
+    const playlinks = [
+      { name: 'Some playlink', logo_url: 'logo', extra_info: { category: 'SVOD' } },
+      { name: 'Some playlink', logo_url: 'logo', extra_info: { category: 'SVOD' } },
+      { name: 'Some playlink', logo_url: 'logo', extra_info: { category: 'SVOD' } },
+      { name: 'Some playlink', logo_url: 'logo', extra_info: { category: 'SVOD' } },
+    ]
+
+    // @ts-ignore
+    const { queryByTestId } = render(Playlinks, { playlinks, title, limit: 3 })
+
+    expect(queryByTestId('show-more')).not.toBeTruthy()
+  })
 })

package/src/tests/routes/components/{TrackAnyClick.test.js → Tracking/TrackAnyClick.test.js}

@@ -2,7 +2,7 @@ import { render, fireEvent } from '@testing-library/svelte'
 import { describe, expect, it, vi, beforeEach } from 'vitest'
 import { track } from '$lib/tracking'
 import { TrackingEvent } from '$lib/enums/TrackingEvent'
-import ClickTracking from '../../../routes/components/TrackAnyClick.svelte'
+import ClickTracking from '../../../../routes/components/Tracking/TrackAnyClick.svelte'
 
 vi.mock('$lib/tracking', () => ({
   track: vi.fn(),

package/src/tests/routes/components/{TrackingPixels.test.js → Tracking/TrackingPixels.test.js}

@@ -1,7 +1,7 @@
 import { render, waitFor  } from '@testing-library/svelte'
 import { describe, expect, it, vi } from 'vitest'
 
-import TrackingPixels from '../../../routes/components/TrackingPixels.svelte'
+import TrackingPixels from '../../../../routes/components/Tracking/TrackingPixels.svelte'
 import { hasConsentedTo } from '$lib/consent'
 
 vi.mock('$lib/consent', () => ({

package/src/tests/routes/components/TitlePopover.test.js

@@ -1,78 +0,0 @@
-import { render  } from '@testing-library/svelte'
-import { describe, expect, it, vi, beforeEach, afterEach } from 'vitest'
-
-import TitlePopover from '../../../routes/components/TitlePopover.svelte'
-import { title } from '$lib/fakeData'
-import { track } from '$lib/tracking'
-import { TrackingEvent } from '$lib/enums/TrackingEvent'
-import { hasConsentedTo } from '$lib/consent'
-
-vi.mock('$lib/consent', () => ({
-  hasConsentedTo: vi.fn(() => true),
-}))
-
-vi.mock('$lib/tracking', () => ({
-  track: vi.fn(),
-}))
-
-vi.mock('$lib/pixel', () => ({
-  isPixelAllowed: vi.fn(),
-}))
-
-vi.mock('$lib/api/participants', () => ({
-  fetchParticipantsForTitle: vi.fn(),
-}))
-
-vi.mock('$lib/api/titles', () => ({
-  fetchSimilarTitles: vi.fn(),
-}))
-
-describe('TitlePopover.svelte', () => {
-  beforeEach(() => {
-    vi.resetAllMocks()
-    vi.mocked(hasConsentedTo).mockImplementation(() => true)
-  })
-
-  afterEach(() => {
-    vi.useRealTimers()
-  })
-
-  it('Should call track function when rendered', () => {
-    const event = new MouseEvent('mouseenter')
-    render(TitlePopover, { event, title })
-
-    expect(track).toHaveBeenCalledWith(TrackingEvent.TitlePopoverView, title)
-  })
-
-  it('Should call track function with time_spent when destroyed', async () => {
-    vi.useFakeTimers()
-
-    const event = new MouseEvent('mouseenter')
-    const { unmount } = render(TitlePopover, { event, title })
-
-    vi.advanceTimersByTime(200)
-    unmount()
-
-    expect(track).toHaveBeenCalledWith(TrackingEvent.TitlePopoverClose, title, expect.objectContaining({ time_spent: 200 }))
-  })
-
-  it('Should render top scroll ad when given', () => {
-    // @ts-ignore
-    window.PlayPilotLinkInjections = { ads: [{ campaign_format: 'top_scroll', content: {}, cta: {} }] }
-
-    const event = new MouseEvent('mouseenter')
-    const { container } = render(TitlePopover, { event, title })
-
-    expect(container.querySelector('.top-scroll')).toBeTruthy()
-  })
-
-  it('Should not render top scroll ad when not given', () => {
-    // @ts-ignore
-    window.PlayPilotLinkInjections = { ads: null }
-
-    const event = new MouseEvent('mouseenter')
-    const { container } = render(TitlePopover, { event, title })
-
-    expect(container.querySelector('.top-scroll')).not.toBeTruthy()
-  })
-})