#428

frontend/server.ssr.test.mjs

@@ -66,6 +66,9 @@ const responseFor = url => {
   if (path === '/gekanator/posts') return { posts: [post (locale)] }
   if (path === '/gekanator/questions') return { questions: [] }
   if (path === '/posts/1') return post (locale)
+  if (path === '/posts/2')
+    return { ...post (locale), id: 2,
+      url: 'https://www.youtube.com/watch?v=dQw4w9WgXcQ' }
   if (path === '/tags') return { tags: [tag (locale)], count: 1 }
   if (path === '/tags/1' || path.startsWith ('/tags/name/')) return tag (locale)
   if (path === '/tags/1/deerjikists') return { tag: tag (locale), deerjikists: [] }
@@ -333,6 +336,22 @@ test ('every canonical screen route returns page HTML without JavaScript', async
   }
 })
 
+test ('YouTube posts return HTTP 200 with the embed rendered by SSR', async t => {
+  for (const locale of ['ja', 'ain-Kana']) {
+    await t.test (locale, async () => {
+      const response = await fetch (`${httpOrigin}/${locale}/posts/2`)
+      assert.equal (response.status, 200)
+      const html = await response.text ()
+      assert.match (html, new RegExp (`<html lang="${locale}"`))
+      assert.match (html, new RegExp (`SSR post ${locale}`))
+      assert.match (html, /https:\/\/www\.youtube\.com\/watch\?v=dQw4w9WgXcQ/)
+      // react-youtube renders its player container before mounting the iframe.
+      assert.match (html, /<div class=""><div id="" class=""><\/div><\/div>/)
+      assert.doesNotMatch (html, /Switched to client rendering|template id="B:/)
+    })
+  }
+})
+
 test ('parallel localized requests keep list data isolated', async () => {
   const start = requests.length
   const pages = await Promise.all (['ja', 'ain-Kana', 'ja', 'ain-Kana'].map (locale =>