@playpilot/tpi 5.32.3 → 5.33.0-beta.explore.10

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

@@ -0,0 +1,108 @@
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+
+import { generateInjection } from '../helpers'
+import { clearLinkInjections, getLinkInjectionElements } from '$lib/injection'
+import { insertAfterArticlePlaylinks } from '$lib/afterArticle'
+import { mount } from 'svelte'
+
+vi.mock('svelte', () => ({
+  mount: vi.fn(),
+  unmount: vi.fn(),
+}))
+
+describe('afterArticle.js', () => {
+  beforeEach(() => {
+    vi.resetAllMocks()
+    clearLinkInjections()
+
+    vi.mocked(mount).mockReturnValueOnce({})
+
+    // @ts-ignore
+    window.PlayPilotLinkInjections = {}
+  })
+
+  describe('insertAfterArticlePlaylinks', () => {
+    it('Should insert component after given elements', () => {
+      document.body.innerHTML = `<section>
+          <p>Some text</p>
+          <p>Some other text</p>
+        </section>
+      `
+
+      const injection = generateInjection('This is a sentence with an injection.', 'an injection')
+
+      const elements = getLinkInjectionElements(document.body)
+      insertAfterArticlePlaylinks(elements, [injection])
+
+      expect(mount).toHaveBeenCalled()
+      expect(document.querySelector('p:last-of-type + [data-playpilot-after-article-playlinks]')).toBeTruthy()
+    })
+
+    it('Should not insert component if no linkInjections were given', () => {
+      document.body.innerHTML = `<section>
+          <div>Some text</div>
+          <div>Some other text</div>
+        </section>
+      `
+
+      const elements = getLinkInjectionElements(document.body)
+      insertAfterArticlePlaylinks(elements, [])
+
+      expect(mount).not.toHaveBeenCalled()
+      expect(document.querySelector('[data-playpilot-after-article-playlinks]')).not.toBeTruthy()
+    })
+
+    it('Should insert after the given element if selector is given in config object', () => {
+      window.PlayPilotLinkInjections.after_article_selector = 'hr'
+
+      document.body.innerHTML = `<section>
+          <div>Some text</div>
+          <hr>
+          <div>Some other text</div>
+        </section>
+      `
+
+      const injection = generateInjection('This is a sentence with an injection.', 'an injection')
+      const elements = getLinkInjectionElements(document.body)
+      insertAfterArticlePlaylinks(elements, [injection])
+
+      expect(document.querySelector('hr + [data-playpilot-after-article-playlinks]')).toBeTruthy()
+    })
+
+    it('Should insert in given position if position is given in config object', () => {
+      window.PlayPilotLinkInjections.after_article_insert_position = 'beforebegin'
+
+      document.body.innerHTML = `<section>
+          <div>Some text</div>
+          <hr>
+          <div>Some other text</div>
+        </section>
+      `
+
+      const injection = generateInjection('This is a sentence with an injection.', 'an injection')
+      const elements = getLinkInjectionElements(document.body)
+      insertAfterArticlePlaylinks(elements, [injection])
+
+      expect(document.querySelector('hr + [data-playpilot-after-article-playlinks]')).toBeTruthy()
+    })
+
+    it('Should insert in given position for the given element if selector and position are given in config object', () => {
+      window.PlayPilotLinkInjections.after_article_selector = 'hr'
+      window.PlayPilotLinkInjections.after_article_insert_position = 'beforebegin'
+
+      document.body.innerHTML = `<section>
+          <div>Some text</div>
+          <hr>
+          <div>Some other text</div>
+        </section>
+      `
+
+      const injection = generateInjection('This is a sentence with an injection.', 'an injection')
+      const elements = getLinkInjectionElements(document.body)
+
+      insertAfterArticlePlaylinks(elements, [injection])
+
+      expect(document.querySelector('[data-playpilot-after-article-playlinks] + hr')).toBeTruthy()
+    })
+  })
+})

package/src/tests/lib/api/ads.test.js

@@ -10,7 +10,6 @@ vi.mock('$lib/api/api', () => ({
   api: vi.fn(),
 }))
 
-
 vi.mock('$lib/tracking', () => ({
   track: vi.fn(),
 }))

package/src/tests/lib/api/titles.test.js

@@ -0,0 +1,55 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+
+import { api } from '$lib/api/api'
+import { fetchSimilarTitles, fetchTitles } from '$lib/api/titles'
+import { title } from '$lib/fakeData'
+import { getApiToken } from '$lib/token'
+
+vi.mock('$lib/token', () => ({
+  getApiToken: vi.fn(),
+}))
+
+vi.mock('$lib/api/api', () => ({
+  api: vi.fn(),
+}))
+
+describe('$lib/api/ads', () => {
+  beforeEach(() => {
+    vi.resetAllMocks()
+    vi.mocked(getApiToken).mockReturnValue('some-token')
+  })
+
+  describe('fetchTitles', () => {
+    it('Should call api with given parameters and return response', async () => {
+      vi.mocked(api).mockResolvedValueOnce({ results: [title] })
+
+      const response = await fetchTitles({ some: 'thing' })
+
+      expect(api).toHaveBeenCalledWith('/titles/browse?api-token=some-token&some=thing')
+      expect(response).toEqual({ results: [title] })
+    })
+
+    it('Should throw when api returns error', async () => {
+      vi.mocked(api).mockRejectedValueOnce({ error: 'message' })
+
+      await expect(async () => await fetchTitles()).rejects.toThrow()
+    })
+  })
+
+  describe('fetchSimilarTitles', () => {
+    it('Should call api with with sid for given title and return array of titles', async () => {
+      vi.mocked(api).mockResolvedValueOnce({ results: [title] })
+
+      const response = await fetchSimilarTitles(title)
+
+      expect(api).toHaveBeenCalledWith(`/titles/browse?api-token=some-token&related_to_sid=${title.sid}`)
+      expect(response).toEqual([title])
+    })
+
+    it('Should throw when api returns error', async () => {
+      vi.mocked(api).mockRejectedValueOnce({ error: 'message' })
+
+      await expect(async () => await fetchSimilarTitles(title)).rejects.toThrow()
+    })
+  })
+})

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

@@ -0,0 +1,90 @@
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+
+import { clearLinkInjections, getLinkInjectionElements } from '$lib/injection'
+import { mount } from 'svelte'
+import { insertInTextDisclaimer } from '$lib/disclaimer'
+
+vi.mock('svelte', () => ({
+  mount: vi.fn(),
+  unmount: vi.fn(),
+}))
+
+describe('disclaimer.js', () => {
+  beforeEach(() => {
+    vi.resetAllMocks()
+    clearLinkInjections()
+
+    vi.mocked(mount).mockReturnValueOnce({})
+
+    // @ts-ignore
+    window.PlayPilotLinkInjections = {}
+  })
+
+  describe('insertInTextDisclaimer', () => {
+    it('Should not insert component before the first element in_text_disclaimer_enabled is not given', () => {
+      window.PlayPilotLinkInjections.config = {}
+
+      document.body.innerHTML = `<section>
+          <p>Some text</p>
+          <p>Some other text</p>
+        </section>
+      `
+
+      insertInTextDisclaimer(getLinkInjectionElements(document.body))
+
+      expect(mount).not.toHaveBeenCalled()
+    })
+
+    it('Should insert component before the first element if config is valid', () => {
+      window.PlayPilotLinkInjections.config = {
+        in_text_disclaimer_enabled: true,
+      }
+
+      document.body.innerHTML = `<section>
+          <p>Some text</p>
+          <p>Some other text</p>
+        </section>
+      `
+
+      insertInTextDisclaimer(getLinkInjectionElements(document.body))
+
+      expect(mount).toHaveBeenCalled()
+      expect(document.querySelector('[data-playpilot-in-text-disclaimer] + p')).toBeTruthy()
+    })
+
+    it('Should insert component before the given selector element if selector is present in config', () => {
+      window.PlayPilotLinkInjections.config = {
+        in_text_disclaimer_enabled: true,
+        in_text_disclaimer_selector: 'strong',
+      }
+
+      document.body.innerHTML = `<section>
+          <p>Some text</p>
+          <strong>Some other text</strong>
+        </section>
+      `
+
+      insertInTextDisclaimer(getLinkInjectionElements(document.body))
+
+      expect(document.querySelector('[data-playpilot-in-text-disclaimer] + strong')).toBeTruthy()
+    })
+
+    it('Should insert component in the given position for the given selector element if position is present in config', () => {
+      window.PlayPilotLinkInjections.config = {
+        in_text_disclaimer_enabled: true,
+        in_text_disclaimer_selector: 'strong',
+        in_text_disclaimer_insert_position: 'afterend',
+      }
+
+      document.body.innerHTML = `<section>
+          <p>Some text</p>
+          <strong>Some other text</strong>
+        </section>
+      `
+
+      insertInTextDisclaimer(getLinkInjectionElements(document.body))
+
+      expect(document.querySelector('strong + [data-playpilot-in-text-disclaimer]')).toBeTruthy()
+    })
+  })
+})

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

@@ -0,0 +1,139 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import { destroyExplore, insertExplore, insertExploreIntoNavigation } from '$lib/explore'
+import { mount, unmount } from 'svelte'
+vi.mock('svelte', () => ({
+  mount: vi.fn(() => true),
+  unmount: vi.fn(),
+}))
+
+describe('explore.js', () => {
+  beforeEach(() => {
+    destroyExplore()
+
+    vi.resetAllMocks()
+    vi.mocked(mount).mockReturnValue({})
+  })
+
+  describe('insertExplore', () => {
+    it('Should not call mount when no target element is found', () => {
+      insertExplore()
+
+      expect(mount).not.toHaveBeenCalled()
+    })
+
+    it('Should call mount when target is found', () => {
+      document.body.innerHTML = '<div data-playpilot-explore></div>'
+
+      insertExplore()
+
+      expect(mount).toHaveBeenCalled()
+    })
+
+    it('Should clear any html inside of the element before mount', () => {
+      document.body.innerHTML = '<div data-playpilot-explore><span></span></div>'
+
+      insertExplore()
+
+      expect(document.querySelector('span')).not.toBeTruthy()
+    })
+  })
+
+  describe('destroyExplore', () => {
+    it('Should not call unmount if component was not previously mounted', () => {
+      destroyExplore()
+
+      expect(unmount).not.toHaveBeenCalled()
+    })
+
+    it('Should call unmount if component was previously mounted', () => {
+      insertExplore()
+      destroyExplore()
+
+      expect(unmount).toHaveBeenCalled()
+    })
+  })
+
+  describe('insertExploreIntoNavigation', () => {
+    beforeEach(() => {
+      document.body.innerHTML = ''
+
+      // @ts-ignore
+      window.PlayPilotLinkInjections = {}
+    })
+
+    it('Should not insert if config object is not present', () => {
+      expect(insertExploreIntoNavigation()).toBe(false)
+
+      expect(document.body.innerHTML).toBe('')
+    })
+
+    it('Should not insert if config object is present but explore_navigation_selector is not given', () => {
+      window.PlayPilotLinkInjections.config = {
+        explore_navigation_selector: null,
+      }
+
+      expect(insertExploreIntoNavigation()).toBe(false)
+    })
+
+    it('Should not insert if explore_navigation_selector is given but selector captures nothing', () => {
+      document.body.innerHTML = '<nav></nav>'
+
+      window.PlayPilotLinkInjections.config = {
+        explore_navigation_selector: 'a',
+      }
+
+      expect(insertExploreIntoNavigation()).toBe(false)
+    })
+
+    it('Should insert if explore_navigation_selector is given and selector is valid', () => {
+      document.body.innerHTML = '<nav><a></a></nav>'
+
+      window.PlayPilotLinkInjections.config = {
+        explore_navigation_selector: 'a',
+      }
+
+      expect(insertExploreIntoNavigation()).toBe(true)
+    })
+
+    it('Should copy element matching given selector with the given path', () => {
+      document.body.innerHTML = '<nav><a></a></nav>'
+
+      window.PlayPilotLinkInjections.config = {
+        explore_navigation_selector: 'a',
+        explore_navigation_path: '/explore',
+      }
+
+      insertExploreIntoNavigation()
+
+      expect(document.body.innerHTML).toBe('<nav><a></a><a class="" href="/explore" data-playpilot-explore-navigation-element="true">Streaming Guide</a></nav>')
+    })
+
+    it('Should copy element matching given selector with text equal to explore_navigation_label', () => {
+      document.body.innerHTML = '<nav><a></a></nav>'
+
+      window.PlayPilotLinkInjections.config = {
+        explore_navigation_selector: 'a',
+        explore_navigation_label: 'Some label',
+      }
+
+      insertExploreIntoNavigation()
+
+      const link = document.querySelector('[data-playpilot-explore-navigation-element]')
+      // @ts-ignore
+      expect(link.innerText).toBe('Some label')
+    })
+
+    it('Should copy element and change link inside of element if the selector was not a link', () => {
+      document.body.innerHTML = '<ul><li><a>Link</a></li></ul>'
+
+      window.PlayPilotLinkInjections.config = {
+        explore_navigation_selector: 'li',
+        explore_navigation_path: '/explore',
+      }
+
+      insertExploreIntoNavigation()
+
+      expect(document.body.innerHTML).toBe('<ul><li><a>Link</a></li><li data-playpilot-explore-navigation-element="true"><a class="" href="/explore">Streaming Guide</a></li></ul>')
+    })
+  })
+})

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

@@ -1,11 +1,10 @@
 import { fireEvent } from '@testing-library/svelte'
 import { describe, expect, it, vi, beforeEach, afterEach } from 'vitest'
 
-import { injectLinksInDocument, clearLinkInjections, clearLinkInjection, getLinkInjectionElements, insertAfterArticlePlaylinks, getLinkInjectionsParentElement, isAvailableAsManualInjection, filterRemovedAndInactiveInjections, isEquivalentInjection, filterInvalidInTextInjections, filterInvalidAfterArticleInjections, isValidInjection, isValidPlaylinkType, removePlayPilotTitleLinks, trackLinkIntersection, insertInTextDisclaimer } from '$lib/injection'
+import { injectLinksInDocument, clearLinkInjections, clearLinkInjection, getLinkInjectionElements, getLinkInjectionsParentElement, isAvailableAsManualInjection, filterRemovedAndInactiveInjections, isEquivalentInjection, filterInvalidInTextInjections, filterInvalidAfterArticleInjections, isValidInjection, isValidPlaylinkType, removePlayPilotTitleLinks } from '$lib/injection'
 import { mount, unmount } from 'svelte'
 import { fakeFetch, generateInjection } from '../helpers'
-import { openModal } from '$lib/modal'
-import { track } from '$lib/tracking'
+import { openModalForInjectedLink } from '$lib/modal'
 
 vi.mock('svelte', () => ({
   mount: vi.fn(),
@@ -17,6 +16,7 @@ vi.mock('$lib/modal', () => ({
   destroyAllModals: vi.fn(),
   getPreviousModal: vi.fn(),
   goBackToPreviousModal: vi.fn(),
+  openModalForInjectedLink: vi.fn(),
 }))
 
 vi.mock('$lib/tracking', () => ({
@@ -33,7 +33,7 @@ function mockMatchMedia(matches = false) {
   })
 }
 
-describe('linkInjection.js', () => {
+describe('injections.js', () => {
   beforeEach(() => {
     vi.resetAllMocks()
     clearLinkInjections()
@@ -401,7 +401,7 @@ describe('linkInjection.js', () => {
       const link = /** @type {HTMLAnchorElement} */ (document.querySelector('a'))
       await fireEvent.click(link)
 
-      expect(openModal).toHaveBeenCalled()
+      expect(openModalForInjectedLink).toHaveBeenCalled()
     })
 
     it('Should not fire given onclick function when clicked with modifier keys or not left click', async () => {
@@ -1184,158 +1184,6 @@ describe('linkInjection.js', () => {
     })
   })
 
-  describe('insertAfterArticlePlaylinks', () => {
-    it('Should insert component after given elements', () => {
-      document.body.innerHTML = `<section>
-          <p>Some text</p>
-          <p>Some other text</p>
-        </section>
-      `
-
-      const injection = generateInjection('This is a sentence with an injection.', 'an injection')
-
-      const elements = getLinkInjectionElements(document.body)
-      insertAfterArticlePlaylinks(elements, [injection])
-
-      expect(mount).toHaveBeenCalled()
-      expect(document.querySelector('p:last-of-type + [data-playpilot-after-article-playlinks]')).toBeTruthy()
-    })
-
-    it('Should not insert component if no linkInjections were given', () => {
-      document.body.innerHTML = `<section>
-          <div>Some text</div>
-          <div>Some other text</div>
-        </section>
-      `
-
-      const elements = getLinkInjectionElements(document.body)
-      insertAfterArticlePlaylinks(elements, [])
-
-      expect(mount).not.toHaveBeenCalled()
-      expect(document.querySelector('[data-playpilot-after-article-playlinks]')).not.toBeTruthy()
-    })
-
-    it('Should insert after the given element if selector is given in config object', () => {
-      window.PlayPilotLinkInjections.after_article_selector = 'hr'
-
-      document.body.innerHTML = `<section>
-          <div>Some text</div>
-          <hr>
-          <div>Some other text</div>
-        </section>
-      `
-
-      const injection = generateInjection('This is a sentence with an injection.', 'an injection')
-      const elements = getLinkInjectionElements(document.body)
-      insertAfterArticlePlaylinks(elements, [injection])
-
-      expect(document.querySelector('hr + [data-playpilot-after-article-playlinks]')).toBeTruthy()
-    })
-
-    it('Should insert in given position if position is given in config object', () => {
-      window.PlayPilotLinkInjections.after_article_insert_position = 'beforebegin'
-
-      document.body.innerHTML = `<section>
-          <div>Some text</div>
-          <hr>
-          <div>Some other text</div>
-        </section>
-      `
-
-      const injection = generateInjection('This is a sentence with an injection.', 'an injection')
-      const elements = getLinkInjectionElements(document.body)
-      insertAfterArticlePlaylinks(elements, [injection])
-
-      expect(document.querySelector('hr + [data-playpilot-after-article-playlinks]')).toBeTruthy()
-    })
-
-    it('Should insert in given position for the given element if selector and position are given in config object', () => {
-      window.PlayPilotLinkInjections.after_article_selector = 'hr'
-      window.PlayPilotLinkInjections.after_article_insert_position = 'beforebegin'
-
-      document.body.innerHTML = `<section>
-          <div>Some text</div>
-          <hr>
-          <div>Some other text</div>
-        </section>
-      `
-
-      const injection = generateInjection('This is a sentence with an injection.', 'an injection')
-      const elements = getLinkInjectionElements(document.body)
-      insertAfterArticlePlaylinks(elements, [injection])
-
-      expect(document.querySelector('[data-playpilot-after-article-playlinks] + hr')).toBeTruthy()
-    })
-  })
-
-  describe('insertInTextDisclaimer', () => {
-    it('Should not insert component before the first element in_text_disclaimer_enabled is not given', () => {
-      window.PlayPilotLinkInjections.config = {}
-
-      document.body.innerHTML = `<section>
-          <p>Some text</p>
-          <p>Some other text</p>
-        </section>
-      `
-
-      insertInTextDisclaimer(getLinkInjectionElements(document.body))
-
-      expect(mount).not.toHaveBeenCalled()
-    })
-
-    it('Should insert component before the first element if config is valid', () => {
-      window.PlayPilotLinkInjections.config = {
-        in_text_disclaimer_enabled: true,
-      }
-
-      document.body.innerHTML = `<section>
-          <p>Some text</p>
-          <p>Some other text</p>
-        </section>
-      `
-
-      insertInTextDisclaimer(getLinkInjectionElements(document.body))
-
-      expect(mount).toHaveBeenCalled()
-      expect(document.querySelector('[data-playpilot-in-text-disclaimer] + p')).toBeTruthy()
-    })
-
-    it('Should insert component before the given selector element if selector is present in config', () => {
-      window.PlayPilotLinkInjections.config = {
-        in_text_disclaimer_enabled: true,
-        in_text_disclaimer_selector: 'strong',
-      }
-
-      document.body.innerHTML = `<section>
-          <p>Some text</p>
-          <strong>Some other text</strong>
-        </section>
-      `
-
-      insertInTextDisclaimer(getLinkInjectionElements(document.body))
-
-      expect(document.querySelector('[data-playpilot-in-text-disclaimer] + strong')).toBeTruthy()
-    })
-
-    it('Should insert component in the given position for the given selector element if position is present in config', () => {
-      window.PlayPilotLinkInjections.config = {
-        in_text_disclaimer_enabled: true,
-        in_text_disclaimer_selector: 'strong',
-        in_text_disclaimer_insert_position: 'afterend',
-      }
-
-      document.body.innerHTML = `<section>
-          <p>Some text</p>
-          <strong>Some other text</strong>
-        </section>
-      `
-
-      insertInTextDisclaimer(getLinkInjectionElements(document.body))
-
-      expect(document.querySelector('strong + [data-playpilot-in-text-disclaimer]')).toBeTruthy()
-    })
-  })
-
   describe('isAvailableAsManualInjection', () => {
     it('Should return true if the ai injection has a matching manual injection', () => {
       const aiInjection = generateInjection('Some sentence', 'Some title')