diff --git a/frontend/scenarios/include_video.feature b/frontend/scenarios/include_video.feature
index 9a833883..30012a9b 100644
--- a/frontend/scenarios/include_video.feature
+++ b/frontend/scenarios/include_video.feature
@@ -1,13 +1,14 @@
 #language: fr
 
-Fonctionnalité: Insérer dans un document une vidéo
+Fonctionnalité: Insérer dans un document une vidéo sur YouTube
 
-Scénario: provenant de YouTube
+Scénario: Reconnaissance automatique d'un lien YouTube pur
 
   Soit un document dont je suis l'auteur affiché comme glose
   Et une session active avec mon compte
   Quand j'essaie de remplacer le contenu de la glose par :
     """
-    ![link](https://www.youtube.com/watch?v=JRXkAhMYKEc&ab_channel=ViniciusHenrique)
+    https://www.youtube.com/watch?v=JRXkAhMYKEc&ab_channel=ViniciusHenrique
     """
   Alors le document comporte la vidéo "https://www.youtube.com/embed/JRXkAhMYKEc"
+
diff --git a/frontend/src/components/FormattedText.jsx b/frontend/src/components/FormattedText.jsx
index 3b89be66..bd87dd0a 100644
--- a/frontend/src/components/FormattedText.jsx
+++ b/frontend/src/components/FormattedText.jsx
@@ -6,8 +6,7 @@ import CroppedImage from './CroppedImage';
 import VideoComment from './VideoComment';
 import FragmentComment from './FragmentComment';
 
-function FormattedText({children, setHighlightedText, selectable, setSelectedText}) {
-
+function FormattedText({ children, setHighlightedText, selectable, setSelectedText }) {
   const handleMouseUp = () => {
     if (selectable) {
       let text = window.getSelection().toString();
@@ -16,38 +15,49 @@ function FormattedText({children, setHighlightedText, selectable, setSelectedTex
     }
   };
 
-  return (<>
-    <ReactMarkdown
-      remarkPlugins={[remarkGfm, remarkDefinitionList, remarkUnwrapImages]}
-      components={{
-        img: (x) => embedVideo(x) || CroppedImage(x),
-        p: (x) => VideoComment(x)
-          || FragmentComment({...x, setHighlightedText})
-          || <p onMouseUp={handleMouseUp}>{x.children}</p>,
-        a: ({children, href}) => <a href={href}>{children}</a>
-      }}
-      remarkRehypeOptions={{
-        handlers: defListHastHandlers
-      }}
-    >
-      {children}
-    </ReactMarkdown>
-  </>);
+  const renderLinkOrVideo = ({ children, href }) => {
+    const videoId = getId(href);
+    if (videoId) {
+      const embedLink = `https://www.youtube.com/embed/${videoId}`;
+      return <iframe width="80%" height="300" src={embedLink} style={{ border: 0 }} allowFullScreen title="YouTube video" />;
+    }
+    return <a href={href}>{children}</a>;
+  };
+
+  return (
+    <>
+      <ReactMarkdown
+        remarkPlugins={[remarkGfm, remarkDefinitionList, remarkUnwrapImages]}
+        components={{
+          img: (x) => embedVideo(x) || CroppedImage(x),
+          p: (x) =>
+            VideoComment(x) ||
+            FragmentComment({ ...x, setHighlightedText }) ||
+            <p onMouseUp={handleMouseUp}>{x.children}</p>,
+          a: renderLinkOrVideo
+        }}
+        remarkRehypeOptions={{
+          handlers: defListHastHandlers
+        }}
+      >
+        {children}
+      </ReactMarkdown>
+    </>
+  );
 }
 
 function getId(text) {
+  if (!text) return null;
   const regExp = /^.*(?:youtube\.com\/watch\?v=|youtu\.be\/)([^\s&]{11})/;
   const match = text.match(regExp);
   return match ? match[1] : null;
 }
 
-function embedVideo({src}) {
+function embedVideo({ src }) {
   const videoId = getId(src);
   if (videoId) {
     const embedLink = `https://www.youtube.com/embed/${videoId}`;
-    return (
-      <iframe width="80%" height="300" src={embedLink} frameBorder="0" allowFullScreen></iframe>
-    );
+    return <iframe width="80%" height="300" src={embedLink} style={{ border: 0 }} allowFullScreen title="YouTube video" />;
   }
   return null;
 }