@playpilot/tpi 8.21.8-beta.1 → 8.21.9

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@playpilot/tpi",
-	"version": "8.21.8-beta.1",
+	"version": "8.21.9",
 	"type": "module",
 	"scripts": {
 		"dev": "vite dev",
@@ -17,7 +17,7 @@
 		"postinstall": "patch-package"
 	},
 	"devDependencies": {
-		"@playpilot/retargeting-tracking": "^1.4.1",
+		"@playpilot/retargeting-tracking": "^1.4.2",
 		"@sveltejs/adapter-auto": "^7.0.1",
 		"@sveltejs/kit": "^2.56.1",
 		"@sveltejs/vite-plugin-svelte": "^4.0.0",

package/src/lib/tracking.ts

@@ -4,7 +4,7 @@ import { isCrawler } from './crawler'
 import { genreSlugsToNames } from './genre'
 import type { TitleData } from './types/title'
 import { getFullUrlPath } from './url'
-import { getUserId, isUserTrackingAllowed } from './user'
+import { getSessionId, getUserId, isUserTrackingAllowed } from './user'
 
 const baseUrl = 'https://insights.playpilot.net'
 
@@ -41,6 +41,7 @@ export async function track(event: string, title: TitleData | null = null, paylo
 
   if (isUserTrackingAllowed()) {
     payload.user_id = getUserId()
+    payload.session_id = getSessionId()
     payload.region = window.PlayPilotLinkInjections.region
   }
 

package/src/lib/user.ts

@@ -2,6 +2,7 @@ import { hasConsentedTo } from './consent'
 import { generateRandomHash } from './hash'
 
 export const localStorageUserKey = 'playpilot_user_id'
+export const sessionStorageSessionKey = 'playpilot_session_id'
 
 export function getUserId(): string | null {
   if (!isUserTrackingAllowed()) return null
@@ -17,6 +18,20 @@ export function getUserId(): string | null {
   }
 }
 
+export function getSessionId(): string | null {
+  if (!isUserTrackingAllowed()) return null
+
+  try {
+    const sessionId = sessionStorage.getItem(sessionStorageSessionKey)
+    if (sessionId) return sessionId
+
+    sessionStorage.setItem(sessionStorageSessionKey, generateRandomHash(16))
+    return sessionStorage.getItem(sessionStorageSessionKey)
+  } catch {
+    return null
+  }
+}
+
 export function isUserTrackingAllowed(): boolean {
   return !!window.PlayPilotLinkInjections?.config?.allow_user_id_tracking && hasConsentedTo('tracking')
 }

package/src/routes/components/Rails/TitlesRail.svelte

@@ -5,7 +5,7 @@
   import Rail from './Rail.svelte'
   import type { TitleData } from '$lib/types/title'
   import { openModal } from '$lib/modal'
-  import { exploreTitleUrl, titleUrl } from '$lib/routes'
+  import { exploreTitleUrl } from '$lib/routes'
   import { generateRandomHash } from '$lib/hash'
   import { getFirstTitleWithAvailableTrailer } from '$lib/trailer'
   import { useExploreRouter } from '$lib/explore'
@@ -174,14 +174,15 @@
         onresize={() => slider?.reposition()}>
         {#each titles as title, index}
           {@const expanded = isExpanded(title)}
-          {@const href = navigateToExplore ? exploreTitleUrl(title) : titleUrl(title)}
           {@const onclick = (event: MouseEvent): void => openTitle(event, titles, index)}
 
           <div class="title" class:expanded data-testid="title">
             <div class="media">
               {#if expanded}
                 <div class="video" out:fade={{ delay: 200, duration: 200 }}>
-                  <a class="video-overlay" title="" {href} {onclick}></a>
+                  <!-- svelte-ignore a11y_click_events_have_key_events -->
+                  <!-- svelte-ignore a11y_no_static_element_interactions -->
+                  <div class="video-overlay" title="" {onclick}></div>
 
                   {#if !!title.embeddable_url}
                     <YouTubeEmbed bind:this={embed} embeddable_url={title.embeddable_url!} muted loop captions showMuteControls />
@@ -190,15 +191,19 @@
                   {/if}
                 </div>
               {:else}
-                <a class="poster" {href} {onclick}>
+                <!-- svelte-ignore a11y_click_events_have_key_events -->
+                <!-- svelte-ignore a11y_no_static_element_interactions -->
+                <div class="poster" {onclick}>
                   <TitlePoster {title} width={96} height={144} />
-                </a>
+                </div>
               {/if}
             </div>
 
-            <a class="heading" {href} {onclick} data-testid="heading">
+            <!-- svelte-ignore a11y_click_events_have_key_events -->
+            <!-- svelte-ignore a11y_no_static_element_interactions -->
+            <span class="heading" {onclick} data-testid="heading">
               {title.title}
-            </a>
+            </span>
 
             {#if aside}
               <!-- svelte-ignore a11y_click_events_have_key_events -->

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

@@ -1,5 +1,5 @@
 import { describe, it, expect, beforeEach, vi } from 'vitest'
-import { getUserId, isUserTrackingAllowed, localStorageUserKey } from '$lib/user'
+import { getSessionId, getUserId, isUserTrackingAllowed, localStorageUserKey, sessionStorageSessionKey } from '$lib/user'
 import { hasConsentedTo } from '$lib/consent'
 
 vi.mock('$lib/consent', () => ({
@@ -45,6 +45,44 @@ describe('user.ts', () => {
     })
   })
 
+  describe('getSessionId', () => {
+    beforeEach(() => {
+    // @ts-ignore
+      window.PlayPilotLinkInjections = {
+        config: {
+          allow_user_id_tracking: true,
+        },
+      }
+
+      vi.mocked(hasConsentedTo).mockImplementation(() => true)
+    })
+
+    it('Should return random hash by default', () => {
+      expect(getSessionId()).toBeTruthy()
+    })
+
+    it('Should return the previously set value', () => {
+      sessionStorage.setItem(sessionStorageSessionKey, 'some_value')
+
+      expect(getSessionId()).toBe('some_value')
+    })
+
+    it('Should return null if allow_user_id_tracking is not set', () => {
+      // @ts-ignore
+      window.PlayPilotLinkInjections = {}
+
+      expect(getSessionId()).toBe(null)
+
+      sessionStorage.setItem(sessionStorageSessionKey, 'some_value')
+
+      expect(getSessionId()).toBe(null)
+    })
+
+    it('Should return the same id when called multiple times', () => {
+      expect(getSessionId()).toBe(getSessionId())
+    })
+  })
+
   describe('isUserTrackingAllowed', () => {
     beforeEach(() => {
     // @ts-ignore

package/src/tests/routes/components/Rails/TitlesRail.test.js

@@ -36,16 +36,15 @@ describe('TitlesRail.svelte', () => {
   })
 
   it('Should render all titles', async () => {
-    const { getAllByTestId, getAllByRole } = render(TitlesRail, { titles: [title, title] })
+    const { getAllByTestId } = render(TitlesRail, { titles: [title, title] })
 
     expect(getAllByTestId('title')).toHaveLength(2)
-    expect(getAllByRole('link')[0].getAttribute('href')).toBe(`https://www.playpilot.com/series/${title.slug}/`)
   })
 
   it('Should fire openModal when title is clicked', async () => {
-    const { getAllByRole } = render(TitlesRail, { titles: [title] })
+    const { getByText } = render(TitlesRail, { titles: [title] })
 
-    await fireEvent.click(getAllByRole('link')[0])
+    await fireEvent.click(getByText(title.title))
 
     expect(openModal).toHaveBeenCalledWith({
       type: 'titles-rail',
@@ -57,9 +56,9 @@ describe('TitlesRail.svelte', () => {
 
   it('Should fire given onclick function when title is clicked', async () => {
     const onclick = vi.fn()
-    const { getAllByRole } = render(TitlesRail, { titles: [title], onclick })
+    const { getByText } = render(TitlesRail, { titles: [title], onclick })
 
-    await fireEvent.click(getAllByRole('link')[0])
+    await fireEvent.click(getByText(title.title))
 
     expect(onclick).toHaveBeenCalledWith(title)
   })
@@ -215,11 +214,10 @@ describe('TitlesRail.svelte', () => {
   })
 
   it('Should navigate to explore page rather than open modal when navigateToExplore is true', async () => {
-    const { getAllByRole } = render(TitlesRail, { titles: [title], navigateToExplore: true })
+    const { getByText } = render(TitlesRail, { titles: [title], navigateToExplore: true })
 
-    await fireEvent.click(getAllByRole('link')[0])
+    await fireEvent.click(getByText(title.title))
 
-    expect(getAllByRole('link')[0].getAttribute('href')).toContain(`?route=modal&sid=${title.sid}`)
     expect(window.location.href).toContain(`?route=modal&sid=${title.sid}`)
     expect(openModal).not.toHaveBeenCalledWith()
   })

package/src/tests/setup.js

@@ -96,7 +96,9 @@ beforeEach(() => {
   document.cookie.split(';').forEach((cookie) => document.cookie = cookie.replace(/^ +/, '').replace(/=.*/, '=;'))
 
   window.HTMLElement.prototype.scrollIntoView = vi.fn()
+
   localStorage.clear()
+  sessionStorage.clear()
 
   mockAnimations()
 })