more.

webapp/src/components/Article.svelte

@@ -7,9 +7,11 @@
 
   let host = new URL(story.url || story.link).hostname.replace(/^www\./, "");
   let html;
+  let title;
 
   onMount(() => {
     html = DOMPurify.sanitize(story.text);
+    title = DOMPurify.sanitize(story.title);
   });
 </script>
 
@@ -67,7 +69,9 @@
 
 <article class="article">
   <header class="article-header">
-    <h1 class="article-title">{story.title}</h1>
+    <h1 class="article-title">
+      {@html title}
+    </h1>
     {#if story.url}
       <div>source: <a class="article-source" href={story.url}>{host}</a></div>
     {/if}

webapp/src/components/StoryList.svelte

@@ -1,9 +1,16 @@
 <script>
+  import DOMPurify from "dompurify";
+  import { onMount } from "svelte";
   import { getLogoUrl } from "../utils/logos.js";
   import StoryInfo from "../components/StoryInfo.svelte";
   export let stories;
 
   const host = (url) => new URL(url).hostname.replace(/^www\./, "");
+  let purify = () => "";
+
+  onMount(() => {
+    purify = (html) => DOMPurify.sanitize(html);
+  });
 </script>
 
 <style>
@@ -41,7 +48,10 @@
         alt="logo"
         class="story-icon"
         style="height: 1rem; width: 1rem;" />
-      <a class="story-title" rel="prefetch" href="/{story.id}">{story.title}</a>
+      <a
+        class="story-title"
+        rel="prefetch"
+        href="/{story.id}">{@html purify(story.title)}</a>
       <a
         class="story-source"
         href={story.url || story.link}>{host(story.url || story.link)}</a>