@playpilot/tpi 8.21.8-beta.1 → 8.21.8

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@playpilot/tpi",
-	"version": "8.21.8-beta.1",
+	"version": "8.21.8",
 	"type": "module",
 	"scripts": {
 		"dev": "vite dev",

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/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()
   })