From 9c5bc00657de75e4fd098de42581d7b38c21e440 Mon Sep 17 00:00:00 2001
From: Alexander Bocken <alexander@bocken.org>
Date: Tue, 10 Oct 2023 10:17:39 +0200
Subject: [PATCH] remove html tags from meta tags

---
 src/lib/js/stripHtmlTags.ts                      | 7 +++++++
 src/routes/(rezepte)/rezepte/[name]/+page.svelte | 7 ++++---
 2 files changed, 11 insertions(+), 3 deletions(-)
 create mode 100644 src/lib/js/stripHtmlTags.ts

diff --git a/src/lib/js/stripHtmlTags.ts b/src/lib/js/stripHtmlTags.ts
new file mode 100644
index 0000000..b6642b2
--- /dev/null
+++ b/src/lib/js/stripHtmlTags.ts
@@ -0,0 +1,7 @@
+// Function to strip HTML tags from a string
+function stripHtmlTags(input) {
+  const parser = new DOMParser();
+  const doc = parser.parseFromString(input, 'text/html');
+  const textContent = doc.body.textContent || "";
+  return textContent;
+}
diff --git a/src/routes/(rezepte)/rezepte/[name]/+page.svelte b/src/routes/(rezepte)/rezepte/[name]/+page.svelte
index 1cd5431..3306381 100644
--- a/src/routes/(rezepte)/rezepte/[name]/+page.svelte
+++ b/src/routes/(rezepte)/rezepte/[name]/+page.svelte
@@ -11,6 +11,7 @@
 	import { afterNavigate } from '$app/navigation';
     	import {season} from '$lib/js/season_store';
 	import RecipeNote from '$lib/components/RecipeNote.svelte';
+	import {stripHtmlTags} from '$lib/js/stripHtmlTags';
 
     	export let data: PageData;
 
@@ -206,12 +207,12 @@ h4{
 }
 </style>
 <svelte:head>
-	<title>Bocken - {@html data.name}</title>
-	<meta name="description" content="{data.description}" />
+	<title>Bocken - {stripHtmlTags(data.name)}</title>
+	<meta name="description" content="{stripHtmlTags(data.description)}" />
 	<meta property="og:image" content="https://bocken.org/static/rezepte/thumb/{data.short_name}.webp" />
 	<meta property="og:image:secure_url" content="https://bocken.org/static/rezepte/thumb/{data.short_name}.webp" />
 	<meta property="og:image:type" content="image/webp" />
-	<meta property="og:image:alt" content="{@html data.name}" />
+	<meta property="og:image:alt" content="{stripHtmlTags(data.name)}" />
 </svelte:head>
 
 <TitleImgParallax src={hero_img_src} {placeholder_src}>