Fix RSS enclosure media types

src/routes/rss[.]xml.ts

@@ -12,6 +12,19 @@ function escapeXml(unsafe: string): string {
     .replace(/'/g, ''')
 }
 
+export function getRssImageMediaType(src: string) {
+  const path = src.split(/[?#]/, 1)[0]
+  const extension = path.match(/\.([^./]+)$/)?.[1]?.toLowerCase()
+
+  if (extension === 'jpg' || extension === 'jpeg') return 'image/jpeg'
+  if (extension === 'webp') return 'image/webp'
+  if (extension === 'svg') return 'image/svg+xml'
+  if (extension === 'gif') return 'image/gif'
+  if (extension === 'png') return 'image/png'
+
+  return 'application/octet-stream'
+}
+
 function generateRSSFeed() {
   const posts = getPublishedPosts().slice(0, 50) // Most recent 50 posts
   const siteUrl = 'https://tanstack.com'
@@ -42,7 +55,7 @@ function generateRSSFeed() {
       <pubDate>${pubDate}</pubDate>
       <author>${escapeXml(author)}</author>
       <description>${escapeXml(description)}</description>
-      ${post.headerImage ? `<enclosure url="${escapeXml(siteUrl + post.headerImage)}" type="image/png" />` : ''}
+      ${post.headerImage ? `<enclosure url="${escapeXml(siteUrl + post.headerImage)}" type="${getRssImageMediaType(post.headerImage)}" />` : ''}
     </item>`
     })
     .join('')

tests/rss.test.ts

@@ -0,0 +1,24 @@
+import assert from 'node:assert/strict'
+import test from 'node:test'
+import { getRssImageMediaType } from '../src/routes/rss[.]xml'
+
+test('uses the image media type matching an RSS enclosure URL', () => {
+  assert.equal(getRssImageMediaType('/header.png'), 'image/png')
+  assert.equal(getRssImageMediaType('/header.jpg'), 'image/jpeg')
+  assert.equal(getRssImageMediaType('/header.jpeg'), 'image/jpeg')
+  assert.equal(getRssImageMediaType('/header.webp'), 'image/webp')
+  assert.equal(getRssImageMediaType('/header.svg?v=1'), 'image/svg+xml')
+  assert.equal(getRssImageMediaType('/header.gif#image'), 'image/gif')
+  assert.equal(
+    getRssImageMediaType('/header?source=original.png'),
+    'application/octet-stream',
+  )
+  assert.equal(
+    getRssImageMediaType('/header#preview.jpg'),
+    'application/octet-stream',
+  )
+  assert.equal(
+    getRssImageMediaType('/header.unknown'),
+    'application/octet-stream',
+  )
+})