@playpilot/tpi 3.6.1 → 3.7.1

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@playpilot/tpi",
-	"version": "3.6.1",
+	"version": "3.7.1",
 	"type": "module",
 	"scripts": {
 		"dev": "vite dev",

package/src/lib/api.ts

@@ -11,13 +11,13 @@ let pollTimeout: ReturnType<typeof setTimeout> | null = null
 
 /**
  * Fetch link injections for a URL.
- * @param html HTML to be crawled
+ * @param pageText Text content of the article
  * @param options
  * @param [options.url] URL of the given article
  * @param [options.hash] unique key to identify the HTML
  * @param [options.params] Any rest params to include in the request body
  */
-export async function fetchLinkInjections(html: string, { url = getFullUrlPath(), hash = stringToHash(html), params = {} }: { url?: string, hash?: string; params?: object } = {}): Promise<LinkInjectionResponse> {
+export async function fetchLinkInjections(pageText: string, { url = getFullUrlPath(), hash = stringToHash(pageText), params = {} }: { url?: string, hash?: string; params?: object } = {}): Promise<LinkInjectionResponse> {
   const headers = new Headers({ 'Content-Type': 'application/json' })
   const apiToken = getApiToken()
   const isEditorialMode = isEditorialModeEnabled() ? await authorize() : false
@@ -33,7 +33,7 @@ export async function fetchLinkInjections(html: string, { url = getFullUrlPath()
       hash,
       url,
       metadata,
-      page_text: html,
+      page_text: pageText,
       ...params,
     })),
   })
@@ -48,10 +48,9 @@ export async function fetchLinkInjections(html: string, { url = getFullUrlPath()
 /**
  * Link injections take a while to be ready. During this time we poll the endpoint until it returns the result we want.
  * The results return `injections_ready=false` while the injections are not yet ready.
- * @param html HTML to be crawled
  */
 export async function pollLinkInjections(
-  html: string,
+  pageText: string,
   { requireCompletedResult = false, pollInterval = 3000, maxTries = 600, onpoll = () => null }:
   { requireCompletedResult?: boolean, pollInterval?: number, maxTries?: number, onpoll?: (_response: LinkInjectionResponse) => void } = {}
 ): Promise<LinkInjectionResponse> {
@@ -69,7 +68,7 @@ export async function pollLinkInjections(
   const poll = async (resolve: Function, reject: Function): Promise<void> => {
     let response
     try {
-      response = await fetchLinkInjections(html)
+      response = await fetchLinkInjections(pageText)
 
       if (requireCompletedResult && (response.automation_enabled && response.ai_running)) throw new Error
 
@@ -96,7 +95,7 @@ export async function pollLinkInjections(
   return new Promise(poll)
 }
 
-export async function saveLinkInjections(linkInjections: LinkInjection[], html: string): Promise<LinkInjection[]> {
+export async function saveLinkInjections(linkInjections: LinkInjection[], pageText: string): Promise<LinkInjection[]> {
   const selector = window.PlayPilotLinkInjections?.selector
 
   // Only save manual injections, AI injections should be left intact.
@@ -114,7 +113,7 @@ export async function saveLinkInjections(linkInjections: LinkInjection[], html:
     removed: !!linkInjection.removed
   }))
 
-  const response = await fetchLinkInjections(html, {
+  const response = await fetchLinkInjections(pageText, {
     params: {
       private_token: getAuthToken(),
       link_injections: newLinkInjections,

package/src/lib/linkInjection.ts

@@ -31,7 +31,7 @@ export function getLinkInjectionElements(parentElement: HTMLElement): HTMLElemen
     if (validElements.includes(element)) continue
 
     // Ignore links, buttons, and headers
-    if (/^(A|BUTTON|SCRIPT|NOSCRIPT|STYLE|IFRAME|FIGCAPTION|TIME|H[1-6])$/.test(element.tagName)) continue
+    if (/^(A|BUTTON|SCRIPT|NOSCRIPT|STYLE|IFRAME|FIGCAPTION|TIME|H1)$/.test(element.tagName)) continue
 
     // Check if this element has a direct text node
     const hasTextNode = Array.from(element.childNodes).some(

package/src/routes/+layout.svelte

@@ -28,6 +28,8 @@
       <time datetime="14:00">1 hour ago</time>
       <p use:noClass>Following the success of John M. Chu's 2018 romantic-comedy Crazy Rich Asians, Quan was inspired to return to acting. He first scored a supporting role in the Netflix movie Finding 'Ohana, before securing a starring role in the absurdist comedy-drama Everything Everywhere all At Once. A critical and commercial success, the film earned $143 million against a budget of $14-25 million, and saw Quan win the Academy Award for Best Supporting Actor. Following his win, Quan struggled to choose projects he was satisfied with, passing on an action-comedy three times, before finally taking his first leading role in it, following advice from Spielberg.</p>
       <p use:noClass>In an interview with Epire &amp; Magazine, Quan reveals he quested starring in Love Hurts, which sees him Love Hurts in the leading role of a former assassin turned successful realtor, whose past returns when his brother attempts to hunt him down. The movie is in a similar vein to successful films such as The Long Kiss Goodnight and Nobody, and Quan discussed how he was reluctant to take the part due to his conditioned beliefs about how an action hero should look. But he reveals that he changed his mind following a meeting with Spielberg, who convinced him to do it.</p>
+
+      <h2 use:noClass>A smaller heading with an injection in it</h2>
       <p use:noClass><strong use:noClass>Jason Momoa</strong> (”Aquaman”), <strong use:noClass>Jack Black</strong> (”Nacho Libre”) och <strong use:noClass>Jennifer Coolidge</strong> (”The White Lotus”) medverkar i den <strong use:noClass>Jared Hess</strong>-regisserade (”Napolen Dynamite”) filmen. Filmen följer fyra utbölingar som via en magisk portal sugs in i en värld där allt är kubformat. För att komma hem igen måste de övervinna den färgstarka världen.</p>
 
       <p use:noClass>

package/src/routes/+page.svelte

@@ -13,16 +13,19 @@
 
   let parentElement: HTMLElement | null = $state(null)
   let elements: HTMLElement[] = $state([])
+
   let response: LinkInjectionResponse | null = $state(null)
   let isEditorialMode = $state(isEditorialModeEnabled())
   let hasAuthToken = $state(!!getAuthToken())
   let authorized = $state(false)
   let loading = $state(true)
+  let isUrlExcluded = $state(true)
   let linkInjections: LinkInjection[] = $state([])
 
   // @ts-ignore It's ok if the response is empty
   const { ai_injections: aiInjections = [], link_injections: manualInjections = [] } = $derived(response || {})
-  const htmlString = $derived(elements.map(p => p.outerHTML).join(''))
+
+  const pageText = $derived(elements.map(element => element.innerText).join('\n'))
 
   // Rerender link injections when linkInjections change. This is only relevant for editiorial mode.
   $effect(() => {
@@ -49,8 +52,10 @@
       const config = await fetchConfig()
       const url = getFullUrlPath()
 
-      // URL was marked as being excluded, we stop injections here unless we're in editorial mode.
-      if (!isEditorialMode && config?.exclude_urls_pattern && url.match(config.exclude_urls_pattern)) return
+      // If the URL was marked as being excluded in the config, we stop injections here.
+      isUrlExcluded = !!(config?.exclude_urls_pattern && url.match(config.exclude_urls_pattern))
+      if (isUrlExcluded) return
+
       if (config?.custom_style) insertCustomStyle(config.custom_style || '')
 
       setElements(config?.html_selector || '')
@@ -64,7 +69,7 @@
 
     // Only trying once when not in editorial mode to prevent late injections (as well as a ton of requests)
     // by users who are not in the editorial view.
-    response = await pollLinkInjections(htmlString, { maxTries: 1 })
+    response = await pollLinkInjections(pageText, { maxTries: 1 })
 
     loading = false
 
@@ -84,7 +89,7 @@
     // so as not to suddenly insert new links while a user is reading the article.
     if (!isEditorialMode) return
 
-    response = await pollLinkInjections(htmlString, { requireCompletedResult: true, onpoll: (update) => response = update })
+    response = await pollLinkInjections(pageText, { requireCompletedResult: true, onpoll: (update) => response = update })
     inject({ aiInjections, manualInjections })
   }
 
@@ -147,16 +152,16 @@
 </script>
 
 <div class="playpilot-link-injections">
-  {#if hasAuthToken && !isEditorialMode}
+  {#if !isUrlExcluded && hasAuthToken && !isEditorialMode}
     <EditorTrigger
       onclick={openEditorialMode}
       onclose={() => { hasAuthToken = false; removeAuthCookie() }} />
   {/if}
 
-  {#if isEditorialMode && authorized}
+  {#if !isUrlExcluded && isEditorialMode && authorized}
     <Editor
       bind:linkInjections
-      {htmlString}
+      {pageText}
       {loading}
       onreinitialize={reinitializeEditor}
       injectionsEnabled={response?.injections_enabled}

package/src/routes/components/Editorial/Editor.svelte

@@ -19,7 +19,7 @@
 
   interface Props {
     linkInjections: LinkInjection[],
-    htmlString?: string,
+    pageText?: string,
     loading?: boolean,
     injectionsEnabled?: boolean,
     aiStatus?: {
@@ -33,7 +33,7 @@
 
   let {
     linkInjections = $bindable(),
-    htmlString = '',
+    pageText = '',
     loading = false,
     injectionsEnabled = false,
     aiStatus = {},
@@ -84,7 +84,7 @@
       saving = true
       hasError = false
 
-      linkInjections = await saveLinkInjections(linkInjections, htmlString)
+      linkInjections = await saveLinkInjections(linkInjections, pageText)
       initialStateString = linkInjectionsString
     } catch {
       hasError = true
@@ -176,7 +176,7 @@
 
   {#if !loading}
     <Session
-      {htmlString}
+      {pageText}
       onallow={() => allowEditing = true}
       ondisallow={() => allowEditing = false}
       ontakeover={onreinitialize}
@@ -230,7 +230,7 @@
       style:top="{scrollDistance}px"
       transition:fly={{ x: Math.min(window.innerWidth, 320), duration: 200, opacity: 1 }}>
       <ManualInjection
-        {htmlString}
+        {pageText}
         onclose={() => manualInjectionActive = false}
         onsave={(linkInjection) => linkInjections.push(linkInjection)} />
     </div>

package/src/routes/components/Editorial/ManualInjection.svelte

@@ -14,13 +14,13 @@
   import { heading } from '$lib/actions/heading'
 
   interface Props {
-    htmlString: string
+    pageText: string
     // eslint-disable-next-line no-unused-vars
     onsave: (linkInjection: LinkInjection) => void
     onclose?: () => void
   }
 
-  let { htmlString = '', onsave, onclose = () => null }: Props = $props()
+  let { pageText = '', onsave, onclose = () => null }: Props = $props()
 
   let currentSelection = $state('')
   let selectionSentence = $state('')
@@ -58,7 +58,7 @@
     selectionSentence = findSentenceForSelection(selection, selectionText)
 
     const nodeContent = selection.getRangeAt(0).commonAncestorContainer.textContent
-    const documentTextContent = decodeHtmlEntities(htmlString)
+    const documentTextContent = decodeHtmlEntities(pageText)
     if (!nodeContent || !documentTextContent.includes(nodeContent)) { // Selected content is not within the ALI selector
       error = 'Selection was not inside of given content'
     }

package/src/routes/components/Editorial/Session.svelte

@@ -4,7 +4,7 @@
   import Alert from './Alert.svelte'
 
   interface Props {
-    htmlString?: string,
+    pageText?: string,
     // eslint-disable-next-line no-unused-vars
     onpoll?: ({ injectionsEnabled, automationEnabled }: { injectionsEnabled: boolean, automationEnabled: boolean }) => void,
     onallow?: () => void,
@@ -13,7 +13,7 @@
   }
 
   const {
-    htmlString = '',
+    pageText = '',
     onpoll = () => null,
     onallow = () => null,
     ondisallow = () => null,
@@ -37,7 +37,7 @@
   }
 
   async function setSession(): Promise<void> {
-    const result = await fetchAsSession(htmlString)
+    const result = await fetchAsSession(pageText)
 
     if (!result) return
 
@@ -50,7 +50,7 @@
   }
 
   function takeOverEditing(): void {
-    saveCurrentSession(htmlString)
+    saveCurrentSession(pageText)
     ontakeover()
   }
 </script>

package/src/routes/components/Genres.svelte

@@ -35,7 +35,7 @@
     border-radius: var(--playpilot-genre-border-radius, margin(1));
     padding: margin(0.25) margin(0.5);
     font-family: var(--playpilot-genre-font-family, inherit);
-    font-weight: var(--playpilot-playlink-font-weight, inherit);
+    font-weight: var(--playpilot-genre-font-weight, inherit);
     text-transform: var(--playpilot-genre-text-transform, none);
     color: var(--playpilot-genre-text-color, var(--playpilot-text-color-alt));
     line-height: 1;

package/src/routes/components/Playlinks.svelte

@@ -124,7 +124,7 @@
     font-style: var(--playpilot-playlink-font-style, normal);
     text-decoration: none !important;
     white-space: nowrap;
-    font-size: margin(0.75);
+    font-size: var(--playpilot-playlinks-font-size, margin(0.75));
     line-height: 1;
 
     &:hover,
@@ -150,8 +150,8 @@
   }
 
   .category {
-    margin-top: margin(0.5);
-    font-size: margin(0.625);
+    margin-top: var(--playpilot-playlinks-category-margin, margin(0.5));
+    font-size: var(--playpilot-playlinks-category-font-size, margin(0.625));
     color: var(--playpilot-playlink-category-text-color, var(--playpilot-text-color));
     font-weight: var(--playpilot-playlink-category-font-weight, inherit);
     font-family: var(--playpilot-playlink-category-font-family, inherit);

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

@@ -31,7 +31,7 @@ describe('$lib/api', () => {
     it('Should call fetch with given url and body', async () => {
       fakeFetch({ response: 'Some response' })
 
-      const response = await fetchLinkInjections('some-html', { url: 'https://some-url', hash: 'some-hash' })
+      const response = await fetchLinkInjections('Some text', { url: 'https://some-url', hash: 'some-hash' })
 
       expect(response).toBe('Some response')
       expect(global.fetch).toHaveBeenCalledWith(
@@ -45,7 +45,7 @@ describe('$lib/api', () => {
               modified_time: null,
               published_time: null,
             },
-            page_text: 'some-html',
+            page_text: 'Some text',
           }),
           method: 'POST',
           headers: expect.any(Object),
@@ -57,13 +57,13 @@ describe('$lib/api', () => {
       // @ts-ignore
       window.PlayPilotLinkInjections = null
 
-      await expect(async () => await fetchLinkInjections('some-html', { hash: 'some-hash' })).rejects.toThrowError('No token was provided')
+      await expect(async () => await fetchLinkInjections('Some text', { hash: 'some-hash' })).rejects.toThrowError('No token was provided')
     })
 
     it('Should throw when response was incorrect', async () => {
       fakeFetch({ ok: false })
 
-      await expect(async () => await fetchLinkInjections('some-html', { hash: 'some-hash' })).rejects.toThrowError()
+      await expect(async () => await fetchLinkInjections('Some text', { hash: 'some-hash' })).rejects.toThrowError()
     })
 
     it('Should use given api token', async () => {
@@ -72,7 +72,7 @@ describe('$lib/api', () => {
       // @ts-ignore
       window.PlayPilotLinkInjections = { token: 'token' }
 
-      await fetchLinkInjections('some-html', { hash: 'some-hash' })
+      await fetchLinkInjections('Some text', { hash: 'some-hash' })
 
       expect(global.fetch).toHaveBeenCalledWith(
         expect.stringContaining('api-token=token'),
@@ -86,7 +86,7 @@ describe('$lib/api', () => {
       // @ts-ignore
       window.PlayPilotLinkInjections = null
 
-      await expect(async () => await fetchLinkInjections('some-html', { hash: 'some-hash' })).rejects.toThrowError()
+      await expect(async () => await fetchLinkInjections('Some text', { hash: 'some-hash' })).rejects.toThrowError()
     })
 
     it('Should include editorial_mode_enabled=true in url if editorial mode is true', async () => {
@@ -95,7 +95,7 @@ describe('$lib/api', () => {
       vi.mocked(authorize).mockResolvedValueOnce(true)
       vi.mocked(isEditorialModeEnabled).mockResolvedValueOnce(true)
 
-      const response = await fetchLinkInjections('some-html', { hash: 'some-hash' })
+      const response = await fetchLinkInjections('Some text', { hash: 'some-hash' })
 
       expect(response).toBe('Some response')
       expect(global.fetch).toHaveBeenCalledWith(
@@ -107,7 +107,7 @@ describe('$lib/api', () => {
     it('Should call fetch with given language', async () => {
       fakeFetch({ response: 'Some response' })
 
-      await fetchLinkInjections('some-html', { hash: 'some-hash' })
+      await fetchLinkInjections('Some text', { hash: 'some-hash' })
 
       expect(global.fetch).toHaveBeenCalledWith(
         expect.stringContaining(`&language=${Language.English}`),
@@ -117,7 +117,7 @@ describe('$lib/api', () => {
       // @ts-ignore
       window.PlayPilotLinkInjections = { token: 'token', language: Language.Swedish }
 
-      await fetchLinkInjections('some-html', { hash: 'some-hash' })
+      await fetchLinkInjections('Some text', { hash: 'some-hash' })
 
       expect(global.fetch).toHaveBeenCalledWith(
         expect.stringContaining(`&language=${Language.Swedish}`),
@@ -130,7 +130,7 @@ describe('$lib/api', () => {
     it('Should poll endpoint while results are not yet ready when requireCompletedResults is true', async () => {
       fakeFetch({ response: { automation_enabled: true, ai_running: true } })
 
-      pollLinkInjections('some-html', { requireCompletedResult: true, pollInterval: 500 })
+      pollLinkInjections('Some text', { requireCompletedResult: true, pollInterval: 500 })
 
       expect(global.fetch).toHaveBeenCalled()
 
@@ -145,7 +145,7 @@ describe('$lib/api', () => {
       fakeFetch({ response: { automation_enabled: true, ai_running: true } })
 
       const onpoll = vi.fn()
-      pollLinkInjections('some-html', { requireCompletedResult: true, pollInterval: 500, onpoll })
+      pollLinkInjections('Some text', { requireCompletedResult: true, pollInterval: 500, onpoll })
 
       await waitFor(() => {
         expect(onpoll).toHaveBeenCalledTimes(1)
@@ -162,7 +162,7 @@ describe('$lib/api', () => {
       const response = { automation_enabled: true, ai_running: false, link_injections: [{ title: 'value' }] }
       fakeFetch({ response })
 
-      const result = await pollLinkInjections('some-html', { requireCompletedResult: true, pollInterval: 500 })
+      const result = await pollLinkInjections('Some text', { requireCompletedResult: true, pollInterval: 500 })
 
       expect(global.fetch).toHaveBeenCalled()
       expect(result).toEqual(response)
@@ -174,7 +174,7 @@ describe('$lib/api', () => {
     it('Should stop polling if max limit was exceeded', async () => {
       fakeFetch({ response: { automation_enabled: true, ai_running: true } })
 
-      await pollLinkInjections('some-html', { requireCompletedResult: true, pollInterval: 200, maxTries: 2 })
+      await pollLinkInjections('Some text', { requireCompletedResult: true, pollInterval: 200, maxTries: 2 })
 
       await new Promise(res => setTimeout(res, 1000)) // Wait for a potential poll
       expect(global.fetch).toHaveBeenCalledTimes(2)
@@ -183,7 +183,7 @@ describe('$lib/api', () => {
     it('Should continue polling if endpoint throws error', async () => {
       fakeFetch({ ok: false })
 
-      pollLinkInjections('some-html', { pollInterval: 500 })
+      pollLinkInjections('Some text', { pollInterval: 500 })
 
       expect(global.fetch).toHaveBeenCalled()
 
@@ -194,7 +194,7 @@ describe('$lib/api', () => {
     it('Should return empty array if link_injections are null', async () => {
       fakeFetch({ response: { link_injections: null, ai_injections: null } })
 
-      const result = await pollLinkInjections('some-html')
+      const result = await pollLinkInjections('Some text')
       expect(result).toEqual(expect.objectContaining({ link_injections: [], ai_injections: [] }))
     })
   })

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

@@ -677,10 +677,9 @@ describe('linkInjection.js', () => {
       expect(getLinkInjectionElements(parent)[1].tagName).toBe('OL')
     })
 
-    it('Should ignore links, buttons, script tags, style tags, iframes, headers, and more', () => {
+    it('Should ignore links, buttons, script tags, style tags, iframes, h1, and more', () => {
       document.body.innerHTML = `<section>
         <h1>Some header</h1>
-        <h4>Some smaller header</h4>
 
         <a>I am a link</a>
         <button>And I am a button</button>
@@ -694,12 +693,13 @@ describe('linkInjection.js', () => {
 
         <div>
           <a>I am another link</a>
+          <h4>Some smaller header</h4>
           <p>And finally, some text</p>
         </div>
       </section>`
       const parent = /** @type {HTMLElement} */ (document.querySelector('section'))
 
-      expect(getLinkInjectionElements(parent)).toHaveLength(1)
+      expect(getLinkInjectionElements(parent)).toHaveLength(2) // The h4 tag and the paragraph tag
     })
 
     it('Should ignore links, buttons, and headers even when deeply nested', () => {

package/src/tests/routes/+page.test.js

@@ -178,7 +178,7 @@ describe('$routes/+page.svelte', () => {
     render(page)
 
     await waitFor(() => {
-      expect(pollLinkInjections).toHaveBeenCalledWith('<p>Here</p>', { maxTries: 1 })
+      expect(pollLinkInjections).toHaveBeenCalledWith('Here', { maxTries: 1 })
     })
   })
 
@@ -230,19 +230,25 @@ describe('$routes/+page.svelte', () => {
     expect(container.querySelector('.editor')).not.toBeTruthy()
   })
 
-  it('Should not render editor trigger if getAuthToken does not return token', () => {
+  it('Should not render editor trigger if getAuthToken does not return token', async () => {
     vi.mocked(getAuthToken).mockReturnValueOnce('')
 
     const { queryByTitle } = render(page)
 
+    await waitFor(() => expect(fetchConfig).toHaveBeenCalled())
+    await new Promise((res) => setTimeout(res))
+
     expect(queryByTitle('Show PlayPilot TPI editor')).not.toBeTruthy()
   })
 
-  it('Should render editor trigger if getAuthToken returns token', () => {
+  it('Should render editor trigger if getAuthToken returns token', async () => {
     vi.mocked(getAuthToken).mockReturnValueOnce('token')
 
     const { getByTitle } = render(page)
 
+    await waitFor(() => expect(fetchConfig).toHaveBeenCalled())
+    await new Promise((res) => setTimeout(res))
+
     expect(getByTitle('Show PlayPilot TPI editor')).toBeTruthy()
   })
 
@@ -251,6 +257,9 @@ describe('$routes/+page.svelte', () => {
 
     const { getByTitle } = render(page)
 
+    await waitFor(() => expect(fetchConfig).toHaveBeenCalled())
+    await new Promise((res) => setTimeout(res))
+
     await fireEvent.click(getByTitle('Close PlayPilot TPI'))
 
     expect(removeAuthCookie).toHaveBeenCalled()
@@ -262,6 +271,9 @@ describe('$routes/+page.svelte', () => {
 
     const { getByTitle, container } = render(page)
 
+    await waitFor(() => expect(fetchConfig).toHaveBeenCalled())
+    await new Promise((res) => setTimeout(res))
+
     await fireEvent.click(getByTitle('Show PlayPilot TPI editor'))
 
     expect(container.querySelector('.editor')).toBeTruthy()
@@ -330,7 +342,6 @@ describe('$routes/+page.svelte', () => {
 
   describe('Config', () => {
     describe('exclude_urls_pattern', () => {
-
       it('Should not inject if config exclude_urls_pattern matches current url', async () => {
         vi.mocked(fetchConfig).mockResolvedValueOnce({ exclude_urls_pattern: '/t' })
 
@@ -367,6 +378,32 @@ describe('$routes/+page.svelte', () => {
         await waitFor(() => expect(fetchConfig).toHaveBeenCalled())
         expect(pollLinkInjections).toHaveBeenCalled()
       })
+
+      it('Should show editor button if url is not excluded', async () => {
+        vi.mocked(getAuthToken).mockReturnValueOnce('token')
+        vi.mocked(authorize).mockResolvedValueOnce(true)
+        vi.mocked(fetchConfig).mockResolvedValueOnce({ })
+
+        const { getByTitle } = render(page)
+
+        await waitFor(() => expect(fetchConfig).toHaveBeenCalled())
+        await new Promise((res) => setTimeout(res))
+
+        expect(getByTitle('Show PlayPilot TPI editor')).toBeTruthy()
+      })
+
+      it('Should not show editor button if url is excluded', async () => {
+        vi.mocked(getAuthToken).mockReturnValueOnce('token')
+        vi.mocked(authorize).mockResolvedValueOnce(true)
+        vi.mocked(fetchConfig).mockResolvedValueOnce({ exclude_urls_pattern: '/t' })
+
+        const { queryByTitle } = render(page)
+
+        await waitFor(() => expect(fetchConfig).toHaveBeenCalled())
+        await new Promise((res) => setTimeout(res))
+
+        expect(queryByTitle('Show PlayPilot TPI editor')).not.toBeTruthy()
+      })
     })
 
     describe('html_selector', () => {

package/src/tests/routes/components/Editorial/ManualInjection.test.js

@@ -37,7 +37,7 @@ describe('ManualInjection.svelte', () => {
   it('Should input selected text in selected text input and search input', async () => {
     createSelectionMock()
 
-    const { getByLabelText } = render(ManualInjection, { htmlString: document.body.innerHTML, onsave: () => null })
+    const { getByLabelText } = render(ManualInjection, { pageText: document.body.innerText, onsave: () => null })
 
     await fireEvent.mouseUp(window)
 
@@ -49,7 +49,7 @@ describe('ManualInjection.svelte', () => {
   it('Should disable save button by default', async () => {
     createSelectionMock()
 
-    const { getByText } = render(ManualInjection, { htmlString: '', onsave: () => null })
+    const { getByText } = render(ManualInjection, { pageText: '', onsave: () => null })
 
     expect(getByText('Add playlink').hasAttribute('disabled')).toBeTruthy()
   })
@@ -59,7 +59,7 @@ describe('ManualInjection.svelte', () => {
 
     vi.mocked(searchTitles).mockResolvedValueOnce([title])
 
-    const { getByText } = render(ManualInjection, { htmlString: document.body.innerHTML, onsave: () => null })
+    const { getByText } = render(ManualInjection, { pageText: document.body.innerText, onsave: () => null })
 
     await fireEvent.mouseUp(window)
     await waitFor(() => getByText(title.title))
@@ -74,7 +74,7 @@ describe('ManualInjection.svelte', () => {
     vi.mocked(searchTitles).mockResolvedValueOnce([title])
 
     const onsave = vi.fn()
-    const { getByText } = render(ManualInjection, { htmlString: document.body.innerHTML, onsave })
+    const { getByText } = render(ManualInjection, { pageText: document.body.innerText, onsave })
 
     await fireEvent.mouseUp(window)
     await fireEvent.click(getByText(title.title))
@@ -113,7 +113,7 @@ describe('ManualInjection.svelte', () => {
     }))
 
     const onsave = vi.fn()
-    const { getByText } = render(ManualInjection, { htmlString: document.body.innerHTML, onsave })
+    const { getByText } = render(ManualInjection, { pageText: document.body.innerText, onsave })
 
     await fireEvent.mouseUp(window)
     await fireEvent.click(getByText(title.title))
@@ -138,7 +138,7 @@ describe('ManualInjection.svelte', () => {
     let container = document.querySelector('div')
 
     const onsave = vi.fn()
-    const { unmount } = render(ManualInjection, { htmlString: document.body.innerHTML, onsave })
+    const { unmount } = render(ManualInjection, { pageText: document.body.innerText, onsave })
 
     // @ts-ignore
     window.getSelection = vi.fn(() => ({
@@ -176,7 +176,7 @@ describe('ManualInjection.svelte', () => {
       focusNode: container,
     }))
 
-    ;(render(ManualInjection, { htmlString: document.body.innerHTML, onsave }))
+    ;(render(ManualInjection, { pageText: document.body.innerText, onsave }))
 
     await fireEvent.mouseUp(window)
 
@@ -188,7 +188,7 @@ describe('ManualInjection.svelte', () => {
 
     const container = document.querySelector('div')
     const onsave = vi.fn()
-    const { getByText } = render(ManualInjection, { htmlString: document.body.innerHTML, onsave })
+    const { getByText } = render(ManualInjection, { pageText: document.body.innerText, onsave })
 
     // @ts-ignore
     window.getSelection = vi.fn(() => ({

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

@@ -5,7 +5,7 @@ import Popover from '../../../routes/components/Popover.svelte'
 import { createRawSnippet } from 'svelte'
 
 describe('Popover.svelte', () => {
-  const children = createRawSnippet(() => ({ render: () => 'Some snippet' }))
+  const children = createRawSnippet(() => ({ render: () => '<div>Some snippet</div>' }))
 
   it('Should render given snippet', () => {
     const { getByText } = render(Popover, { children })