1 files changed, 26 insertions, 6 deletions
diff --git a/app/assets/javascripts/jobs/components/log/line.vue b/app/assets/javascripts/jobs/components/log/line.vue
index e68d5b8eda4..791664c05d9 100644
--- a/app/assets/javascripts/jobs/components/log/line.vue
+++ b/app/assets/javascripts/jobs/components/log/line.vue
@@ -1,6 +1,24 @@
 <script>
+import linkifyHtml from 'linkifyjs/html';
+import { sanitize } from '~/lib/dompurify';
+import { isAbsolute } from '~/lib/utils/url_utility';
 import LineNumber from './line_number.vue';
 
+const linkifyOptions = {
+  attributes: {
+    // eslint-disable-next-line @gitlab/require-i18n-strings
+    rel: 'nofollow noopener',
+  },
+  className: 'gl-reset-color!',
+  defaultProtocol: 'https',
+  validate: {
+    email: false,
+    url(value) {
+      return isAbsolute(value);
+    },
+  },
+};
+
 export default {
   functional: true,
   props: {
@@ -17,13 +35,15 @@ export default {
     const { line, path } = props;
 
     const chars = line.content.map(content => {
-      return h(
-        'span',
-        {
-          class: ['gl-white-space-pre-wrap', content.style],
+      const linkfied = linkifyHtml(content.text, linkifyOptions);
+      return h('span', {
+        class: ['gl-white-space-pre-wrap', content.style],
+        domProps: {
+          innerHTML: sanitize(linkfied, {
+            ALLOWED_TAGS: ['a'],
+          }),
         },
-        content.text,
-      );
+      });
     });
 
     return h('div', { class: 'js-line log-line' }, [