@playpilot/tpi 8.42.0-beta.1 → 8.42.1

package/src/routes/components/Playlinks/Playlinks.svelte

@@ -7,14 +7,11 @@
   import type { TitleData } from '$lib/types/title'
   import { heading } from '$lib/actions/heading'
   import { campaignToPlaylink, getFirstAdOfType } from '$lib/api/ads'
-  import { getContext, type Snippet } from 'svelte'
+  import { getContext } from 'svelte'
   import Playlink from './Playlink.svelte'
   import Button from '../Button.svelte'
   import PlaylinksDisclaimer from './PlaylinksDisclaimer.svelte'
   import { getConfigValue } from '$lib/api/config'
-  import { getSplitTestVariantName } from '$lib/splitTest'
-  import { SplitTest } from '$lib/enums/SplitTest'
-  import Display from '../Ads/Display.svelte'
 
   type Category = PlaylinkCategory | '' | 'Other'
   type CategorizedPlaylinks = Partial<Record<Category, PlaylinkData[]>>
@@ -24,10 +21,9 @@
     playlinks: PlaylinkData[]
     title: TitleData
     limit?: number
-    children?: Snippet
   }
 
-  const { playlinks, title, limit = 3, children }: Props = $props()
+  const { playlinks, title, limit = 3 }: Props = $props()
 
   const isModal = getContext('scope') === 'modal'
   const type = getContext('type')
@@ -98,11 +94,7 @@
 
       <!-- A fake highlighted playlink as part of the display ad, to be shown after the first playlink -->
       {#if displayAd && (index === 0)}
-        {#if children}
-          {@render children()}
-        {:else}
-          <Playlink playlink={campaignToPlaylink(displayAd)} onclick={() => track(TrackingEvent.DisplayedAdPlaylickClick, title, { campaign_name: displayAd.campaign_name })} hideCategory disclaimer={displayAd.disclaimer || ''} />
-        {/if}
+        <Playlink playlink={campaignToPlaylink(displayAd)} onclick={() => track(TrackingEvent.DisplayedAdPlaylickClick, title, { campaign_name: displayAd.campaign_name })} hideCategory disclaimer={displayAd.disclaimer || ''} />
       {/if}
     {/each}
   </div>

package/src/routes/components/Title.svelte

@@ -14,18 +14,14 @@
   import { TrackingEvent } from '$lib/enums/TrackingEvent'
   import TitleBackground from './TitleBackground.svelte'
   import TitleInfo from './TitleInfo.svelte'
-  import Display from './Ads/Display.svelte'
-  import type { Campaign } from '$lib/types/campaign'
-  import { getFirstAdOfType } from '$lib/api/ads'
 
   interface Props {
     title: TitleData
     small?: boolean
     useVideoBackground?: boolean
-    useDisplayAdSplitTest?: boolean // NOTE: Temporary split test, remove me after the DisplayAdFormat split test is gone
   }
 
-  const { title, small = false, useVideoBackground = true, useDisplayAdSplitTest = false }: Props = $props()
+  const { title, small = false, useVideoBackground = true }: Props = $props()
 
   const noAffiliate = !!window.PlayPilotLinkInjections?.no_affiliate
 
@@ -62,11 +58,7 @@
     {/if}
 
     {#if !noAffiliate}
-      <Playlinks playlinks={title.providers} {title}>
-        {#if useDisplayAdSplitTest && getFirstAdOfType('card')}
-          <Display campaign={getFirstAdOfType('card')!} />
-        {/if}
-      </Playlinks>
+      <Playlinks playlinks={title.providers} {title} />
     {/if}
 
     <ParticipantsRail {title} />

package/src/routes/elements/+page.svelte

@@ -39,21 +39,10 @@
 
   // Used to re-render some elements with a key
   let renderKey = Math.random()
-
-  function insertMockAd(): void {
-    // @ts-ignore
-    window.PlayPilotLinkInjections.consents = {
-      ads: true
-    }
-
-    window.PlayPilotLinkInjections.ads = [campaign]
-  }
 </script>
 
 <h1>Elements</h1>
 
-<button onclick={insertMockAd}>Insert mock ad</button>
-
 <p>This page lays out various elements used in TPI. It does not currently include editor elements.</p>
 
 <h2>Youtube Embed</h2>
@@ -184,15 +173,7 @@
 <div class="group">
   <div>
     <h3>Ads/Display.svelte</h3>
-    <div class="item">
-      <Display {campaign} />
-
-      Compact (Used in popover)
-      <Display {campaign} compact />
-
-      Slim (Used in rail modals)
-      <Display {campaign} slim />
-    </div>
+    <div class="item"><Display {campaign} /></div>
   </div>
 
   <div>

package/src/tests/lib/injection.test.js

@@ -1054,6 +1054,34 @@ describe('injection.ts', () => {
         expect(/** @type {HTMLElement} */ (document.querySelectorAll('[data-playpilot-injection-key]')[0]).dataset.playpilotInjectionType).toBe('participant')
         expect(/** @type {HTMLElement} */ (document.querySelectorAll('[data-playpilot-injection-key]')[1]).dataset.playpilotInjectionType).toBe('title')
       })
+
+      it('Should ignore participants with exclude_participants_url_pattern is true', () => {
+        window.PlayPilotLinkInjections.config = {
+          exclude_participants_urls_pattern: '/',
+        }
+
+        document.body.innerHTML = '<p>This is a sentence with an injection.</p>'
+
+        const elements = Array.from(document.body.querySelectorAll('p'))
+
+        /** @type {import('$lib/types/injection').LinkInjection[]} */
+        const aiInjections = [
+          generateInjection('This is a sentence with an injection.', 'is a'),
+          { ...generateInjection('This is a sentence with an injection.', 'an injection'), type: 'participant', participant_details: participants[0] },
+        ]
+
+        /** @type {import('$lib/types/injection').LinkInjection[]} */
+        const manualInjections = [
+          { ...generateInjection('This is a sentence with an injection.', 'sentence with'), type: 'participant', manual: true, participant_details: participants[0] },
+        ]
+
+        // @ts-ignore
+        injectLinksInDocument(elements, { aiInjections, manualInjections })
+
+        expect(document.querySelectorAll('[data-playpilot-injection-key]')).toHaveLength(2)
+        expect(document.querySelectorAll('[data-playpilot-injection-key]')[0].getAttribute('data-playpilot-injection-key')).toBe(aiInjections[0].key)
+        expect(document.querySelectorAll('[data-playpilot-injection-key]')[1].getAttribute('data-playpilot-injection-key')).toBe(manualInjections[0].key)
+      })
     })
 
     describe('config.open_tpi_links_in_explore', () => {
@@ -1195,6 +1223,76 @@ describe('injection.ts', () => {
         expect(document.querySelectorAll('[data-playpilot-injection-key]')).toHaveLength(3)
       })
     })
+
+    describe('config.exclude_injections_by_anchors', () => {
+      /** @type {import('$lib/types/injection').LinkInjection[]} */
+      const injections = [
+        { ...generateInjection('This is a sentence with an injection.', 'This is'), sid: 'a' },
+        { ...generateInjection('This is a sentence with an injection.', 'a sentence'), sid: 'b', anchor: 'full' },
+        { ...generateInjection('This is a sentence with an injection.', 'an injection'), sid: 'c', anchor: 'attached' },
+      ]
+
+      it('Should exclude injections with anchors matching exclude_injections_by_anchors', () => {
+        window.PlayPilotLinkInjections.config = {
+          exclude_injections_by_anchors: ['attached'],
+        }
+
+        document.body.innerHTML = '<p>This is a sentence with an injection.</p>'
+
+        const elements = Array.from(document.body.querySelectorAll('p'))
+
+        injectLinksInDocument(elements, { aiInjections: injections, manualInjections: [] })
+
+        expect(document.querySelectorAll('[data-playpilot-injection-key]')).toHaveLength(2)
+        expect(document.querySelectorAll('[data-playpilot-injection-key]')[0].getAttribute('data-playpilot-injection-key')).toBe(injections[0].key)
+        expect(document.querySelectorAll('[data-playpilot-injection-key]')[1].getAttribute('data-playpilot-injection-key')).toBe(injections[1].key)
+      })
+
+      it('Should not exclude injections if config is not given', () => {
+        document.body.innerHTML = '<p>This is a sentence with an injection.</p>'
+
+        const elements = Array.from(document.body.querySelectorAll('p'))
+
+        injectLinksInDocument(elements, { aiInjections: injections, manualInjections: [] })
+
+        expect(document.querySelectorAll('[data-playpilot-injection-key]')).toHaveLength(3)
+      })
+    })
+
+    describe('config.exclude_injections_by_evidence', () => {
+      /** @type {import('$lib/types/injection').LinkInjection[]} */
+      const injections = [
+        { ...generateInjection('This is a sentence with an injection.', 'This is'), sid: 'a' },
+        { ...generateInjection('This is a sentence with an injection.', 'a sentence'), sid: 'b', evidence: 'screen_work' },
+        { ...generateInjection('This is a sentence with an injection.', 'an injection'), sid: 'c', evidence: 'credited' },
+      ]
+
+      it('Should exclude injections with anchors matching exclude_injections_by_evidence', () => {
+        window.PlayPilotLinkInjections.config = {
+          exclude_injections_by_evidence: ['screen_work'],
+        }
+
+        document.body.innerHTML = '<p>This is a sentence with an injection.</p>'
+
+        const elements = Array.from(document.body.querySelectorAll('p'))
+
+        injectLinksInDocument(elements, { aiInjections: injections, manualInjections: [] })
+
+        expect(document.querySelectorAll('[data-playpilot-injection-key]')).toHaveLength(2)
+        expect(document.querySelectorAll('[data-playpilot-injection-key]')[0].getAttribute('data-playpilot-injection-key')).toBe(injections[0].key)
+        expect(document.querySelectorAll('[data-playpilot-injection-key]')[1].getAttribute('data-playpilot-injection-key')).toBe(injections[2].key)
+      })
+
+      it('Should not exclude injections if config is not given', () => {
+        document.body.innerHTML = '<p>This is a sentence with an injection.</p>'
+
+        const elements = Array.from(document.body.querySelectorAll('p'))
+
+        injectLinksInDocument(elements, { aiInjections: injections, manualInjections: [] })
+
+        expect(document.querySelectorAll('[data-playpilot-injection-key]')).toHaveLength(3)
+      })
+    })
   })
 
   describe('clearLinkInjections', () => {

package/src/tests/lib/url.test.js

@@ -1,5 +1,5 @@
 import { describe, it, expect, beforeEach, afterEach } from 'vitest'
-import { getFullUrlPath, getUrlParams, isUrlExcludedViaConfig, paramsToString } from '$lib/url'
+import { getFullUrlPath, getUrlParams, isUrlExcludedViaConfig, isParticipantsUrlExcludedViaConfig, paramsToString } from '$lib/url'
 
 describe('url.ts', () => {
   describe('getFullUrlPath', () => {
@@ -113,4 +113,27 @@ describe('url.ts', () => {
       expect(isUrlExcludedViaConfig({ exclude_urls_pattern: '/some-page(/.*)?$' })).toBe(true)
     })
   })
+
+  describe('isParticipantsUrlExcludedViaConfig', () => {
+    it('Should return false if no key is given in config object', () => {
+      expect(isParticipantsUrlExcludedViaConfig({})).toBe(false)
+    })
+
+    it('Should return false if no key is given but is empty', () => {
+      expect(isParticipantsUrlExcludedViaConfig({ exclude_participants_urls_pattern: '' })).toBe(false)
+    })
+
+    it('Should return false if pattern is given but does not match url', () => {
+      window.location.pathname = '/path'
+      expect(isParticipantsUrlExcludedViaConfig({ exclude_participants_urls_pattern: '/not-path' })).toBe(false)
+    })
+
+    it('Should return true if pattern is given and does matches url', () => {
+      window.location.pathname = '/path'
+      expect(isParticipantsUrlExcludedViaConfig({ exclude_participants_urls_pattern: '/path' })).toBe(true)
+
+      window.location.pathname = '/some-page/subpath'
+      expect(isParticipantsUrlExcludedViaConfig({ exclude_participants_urls_pattern: '/some-page(/.*)?$' })).toBe(true)
+    })
+  })
 })

package/src/tests/routes/components/Ads/Display.test.js

@@ -86,7 +86,7 @@ describe('Display.svelte', () => {
 
   it('Should render content subheader when given', () => {
     /** @ts-ignore */
-    const { getByText } = render(Display, { campaign: { cta: { subheader: 'Some cta subheader' }, content: {} } })
+    const { getByText } = render(Display, { campaign: { cta: { subheader: 'Some cta subheader' }, content: { } } })
 
     expect(getByText('Some cta subheader')).toBeTruthy()
   })
@@ -153,14 +153,4 @@ describe('Display.svelte', () => {
 
     expect(container.querySelector('video')).toBeTruthy()
   })
-
-  it('Should render with expected content when slim variant is given', () => {
-    /** @ts-ignore */
-    const { container, queryByText } = render(Display, { slim: true, campaign: { campaign_type: 'video', cta: { header: 'Some header', subheader: 'Some cta subheader' }, content: { header_logo: 'dfg', video: 'abc' } } })
-
-    expect(container.querySelector('.slim')).toBeTruthy()
-    expect(container.querySelector('.logo')).toBeTruthy()
-    expect(queryByText('Some header')).toBeTruthy()
-    expect(queryByText('Some cta header')).not.toBeTruthy()
-  })
 })