From 3fb996a1519fdb88cad39ee1a976e313201b607c Mon Sep 17 00:00:00 2001
From: Adam Gruber <adamg@aweber.com>
Date: Fri, 5 Jul 2019 15:27:58 -0400
Subject: [PATCH] Add support for video links with media fragments Fixes
 https://github.com/adamgruber/mochawesome/issues/287

---
 CHANGELOG.md                              |  2 ++
 src/client/components/test/context.js     | 11 ++++++++++-
 test/spec/components/test/context.test.js | 20 ++++++++++++++++++++
 3 files changed, 32 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 76e9139d..e9d04b71 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,6 +1,8 @@
 # mochawesome-report-generator changelog
 
 ## [Unreleased]
+### Changed
+- Video links in context now support mediafragment uris [mochawesome #287](https://github.com/adamgruber/mochawesome/issues/287)
 
 ## [4.0.0] / 2019-06-04
 ### Changed
diff --git a/src/client/components/test/context.js b/src/client/components/test/context.js
index 2b0410ad..e64567d5 100644
--- a/src/client/components/test/context.js
+++ b/src/client/components/test/context.js
@@ -13,6 +13,15 @@ const protocolRegEx = /^(?:(?:https?|ftp):\/\/)/i;
 const urlRegEx = /^(?:(?:https?|ftp):\/\/)?(?:\S+(?::\S*)?@)?(?:(?!(?:10|127)(?:\.\d{1,3}){3})(?!(?:169\.254|192\.168)(?:\.\d{1,3}){2})(?!172\.(?:1[6-9]|2\d|3[0-1])(?:\.\d{1,3}){2})(?:[1-9]\d?|1\d\d|2[01]\d|22[0-3])(?:\.(?:1?\d{1,2}|2[0-4]\d|25[0-5])){2}(?:\.(?:[1-9]\d?|1\d\d|2[0-4]\d|25[0-4]))|(?:(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)(?:\.(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)*(?:\.(?:[a-z\u00a1-\uffff]{2,}))\.?)(?::\d{2,5})?(?:[/?#]\S*)?$/; // eslint-disable-line
 const base64ImgRegEx = /^data:image\/([a-zA-Z0-9-_.])+;base64,([^"]*)$/i;
 
+const isVideo = str => {
+  if (!isString(str)) {
+    return false;
+  }
+
+  const hashIndex = str.indexOf('#');
+  return videoRegEx.test(hashIndex > 0 ? str.slice(0, hashIndex) : str);
+}
+
 class TestContext extends Component {
   static displayName = 'TestContext';
 
@@ -80,7 +89,7 @@ class TestContext extends Component {
 
   renderContextContent = (content, title, highlight = false) => {
     // Videos
-    if (videoRegEx.test(content)) {
+    if (isVideo(content)) {
       return this.renderVideo(content, title);
     }
 
diff --git a/test/spec/components/test/context.test.js b/test/spec/components/test/context.test.js
index 4278c9d0..97f1e494 100644
--- a/test/spec/components/test/context.test.js
+++ b/test/spec/components/test/context.test.js
@@ -175,6 +175,26 @@ describe('<TestContext />', () => {
       );
     });
 
+    it('renders video url with protocol and mediafragment', () => {
+      const context = 'http://test.url.com/testvideo.mp4#t=123';
+      const { wrapper, snippet, videoLink } = getInstance({
+        context: JSON.stringify(context),
+        className: 'test',
+      });
+      expect(wrapper).to.have.className('test');
+      expect(snippet).to.have.lengthOf(0);
+      expect(wrapper)
+        .to.have.exactly(1)
+        .descendants('video');
+      expect(wrapper)
+        .to.have.exactly(1)
+        .descendants('a.test-video-link');
+      expect(videoLink).to.have.attr(
+        'href',
+        'http://test.url.com/testvideo.mp4#t=123'
+      );
+    });
+
     it('renders image url without protocol', () => {
       const context = 'test.url.com/testvideo.mp4';
       const { wrapper, snippet, videoLink } = getInstance({