@playpilot/tpi 5.34.1 → 6.0.0-beta.explore.15

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

@@ -16,57 +16,57 @@ vi.mock('$lib/tracking', () => ({
 
 describe('Share.svelte', () => {
   it('Should open context menu on click', async () => {
-    const { getByLabelText, queryByText } = render(Share, { title: 'Some title', url: 'some-url' })
+    const { getByText, queryByText } = render(Share, { title: 'Some title', url: 'some-url' })
 
     expect(queryByText('Copy URL')).not.toBeTruthy()
     expect(queryByText('Email')).not.toBeTruthy()
 
-    await fireEvent.click(getByLabelText('Share'))
+    await fireEvent.click(getByText('Share'))
 
     expect(queryByText('Copy URL')).toBeTruthy()
     expect(queryByText('Email')).toBeTruthy()
   })
 
   it('Should close context menu on click of items', async () => {
-    const { getByLabelText, getByText, queryByText } = render(Share, { title: 'Some title', url: 'some-url' })
+    const { getByText, queryByText } = render(Share, { title: 'Some title', url: 'some-url' })
 
-    await fireEvent.click(getByLabelText('Share'))
+    await fireEvent.click(getByText('Share'))
     await fireEvent.click(getByText('Copy URL'))
 
     expect(queryByText('Copy URL')).not.toBeTruthy()
   })
 
   it('Should close context menu on click of body', async () => {
-    const { getByLabelText, queryByText } = render(Share, { title: 'Some title', url: 'some-url' })
+    const { getByText, queryByText } = render(Share, { title: 'Some title', url: 'some-url' })
 
-    await fireEvent.click(getByLabelText('Share'))
+    await fireEvent.click(getByText('Share'))
     await fireEvent.click(document.body)
 
     expect(queryByText('Copy URL')).not.toBeTruthy()
   })
 
   it('Should fire copyToClipboard on click of button', async () => {
-    const { getByLabelText, getByText } = render(Share, { title: 'Some title', url: 'some-url' })
+    const { getByText } = render(Share, { title: 'Some title', url: 'some-url' })
 
-    await fireEvent.click(getByLabelText('Share'))
+    await fireEvent.click(getByText('Share'))
     await fireEvent.click(getByText('Copy URL'))
 
     expect(copyToClipboard).toHaveBeenCalledWith('some-url?utm_source=tpi')
   })
 
   it('Should fire track function on click of copy URL button', async () => {
-    const { getByLabelText, getByText } = render(Share, { title: 'Some title', url: 'some-url' })
+    const { getByText } = render(Share, { title: 'Some title', url: 'some-url' })
 
-    await fireEvent.click(getByLabelText('Share'))
+    await fireEvent.click(getByText('Share'))
     await fireEvent.click(getByText('Copy URL'))
 
     expect(track).toHaveBeenCalledWith(TrackingEvent.ShareTitle, null, { title: 'Some title', url: 'http://localhost:3000/', method: 'copy' })
   })
 
   it('Should fire track function on click of email button', async () => {
-    const { getByLabelText, getByText } = render(Share, { title: 'Some title', url: 'some-url' })
+    const { getByText } = render(Share, { title: 'Some title', url: 'some-url' })
 
-    await fireEvent.click(getByLabelText('Share'))
+    await fireEvent.click(getByText('Share'))
     await fireEvent.click(getByText('Email'))
 
     expect(track).toHaveBeenCalledWith(TrackingEvent.ShareTitle, null, { title: 'Some title', url: 'http://localhost:3000/', method: 'email' })

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

@@ -91,4 +91,17 @@ describe('Title.svelte', () => {
     expect(fetchParticipantsForTitle).toHaveBeenCalled()
     expect(fetchSimilarTitles).toHaveBeenCalled()
   })
+
+  it('Should show trailer button when embeddable_url is given', () => {
+    const { getByText } = render(Title, { title: { ...title, embeddable_url: 'some-url' } })
+
+    expect(getByText('Watch trailer')).toBeTruthy()
+  })
+
+  // Temporarily disabled while button is always visible
+  // it('Should not show trailer button when embeddable_url is not given', () => {
+  //   const { queryByText } = render(Title, { title })
+
+  //   expect(queryByText('Watch Trailer')).not.toBeTruthy()
+  // })
 })

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

@@ -0,0 +1,20 @@
+import { render, fireEvent } from '@testing-library/svelte'
+import { describe, expect, it, vi } from 'vitest'
+
+import Trailer from '../../../routes/components/Trailer.svelte'
+import { title } from '$lib/fakeData'
+import { openTrailerOverlay } from '$lib/trailer'
+
+vi.mock('$lib/trailer', () => ({
+  openTrailerOverlay: vi.fn(),
+}))
+
+describe('Trailer.svelte', () => {
+  it('Should fire given onclick function with given title on click', async () => {
+    const { getByRole } = render(Trailer, { title })
+
+    await fireEvent.click(getByRole('button'))
+
+    expect(openTrailerOverlay).toHaveBeenCalledWith(title)
+  })
+})

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

@@ -0,0 +1,31 @@
+import { fireEvent, render } from '@testing-library/svelte'
+import { describe, expect, it, vi } from 'vitest'
+
+import YouTubeEmbedOverlay from '../../../routes/components/YouTubeEmbedOverlay.svelte'
+
+describe('YouTubeEmbedOverlay.svelte', () => {
+  it('Should render embed iframe with given video url', () => {
+    const { container } = render(YouTubeEmbedOverlay, { embeddable_url: 'youtube.com/watch?v=abc', onclose: () => null })
+
+    // @ts-ignore
+    expect(container.querySelector('iframe').src).toBe('https://www.youtube.com/embed/abc?autoplay=true')
+  })
+
+  it('Should render error message if embeddable_url is invalid', () => {
+    const { container, getByText } = render(YouTubeEmbedOverlay, { embeddable_url: '-', onclose: () => null })
+
+    expect(container.querySelector('iframe')).not.toBeTruthy()
+    expect(getByText('Something went wrong')).toBeTruthy()
+  })
+
+  it('Should fire given onclose function on click of close button and backdrop', async () => {
+    const onclose = vi.fn()
+    const { getByLabelText, getByTestId } = render(YouTubeEmbedOverlay, { embeddable_url: '-', onclose })
+
+    await fireEvent.click(getByLabelText('Close'))
+    expect(onclose).toHaveBeenCalledTimes(1)
+
+    await fireEvent.click(getByTestId('backdrop'))
+    expect(onclose).toHaveBeenCalledTimes(2)
+  })
+})

package/src/tests/setup.js

@@ -13,6 +13,8 @@ const mockAnimations = () => {
     startTime: null,
     currentTime: null,
   })
+
+  Element.prototype.getAnimations ??= vi.fn().mockReturnValue([])
 }
 
 const mockLocalStorage = () => {