From 5884bd4dc1b83616b56cb1da8f3b25149d66a65c Mon Sep 17 00:00:00 2001
From: Harrison Healey <harrisonmhealey@gmail.com>
Date: Thu, 17 May 2018 13:10:17 -0400
Subject: [PATCH] MM-10617 Fixed checking if a link is an image (#1681)

* MM-10617 Fixed checking if a link is an image

* Added unit tests
---
 app/utils/url.js      | 19 +++++++++++++++---
 app/utils/url.test.js | 45 +++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 61 insertions(+), 3 deletions(-)
 create mode 100644 app/utils/url.test.js

diff --git a/app/utils/url.js b/app/utils/url.js
index 7199ef27e..ed2ef72b0 100644
--- a/app/utils/url.js
+++ b/app/utils/url.js
@@ -3,8 +3,9 @@
 
 import {latinise} from './latinise.js';
 
+import {Files} from 'mattermost-redux/constants';
+
 const ytRegex = /(?:http|https):\/\/(?:www\.|m\.)?(?:(?:youtube\.com\/(?:(?:v\/)|(?:(?:watch|embed\/watch)(?:\/|.*v=))|(?:embed\/)|(?:user\/[^/]+\/u\/[0-9]\/)))|(?:youtu\.be\/))([^#&?]*)/;
-const imgRegex = /.+\/(.+\.(?:jpg|gif|bmp|png|jpeg))(?:\?.*)?$/i;
 
 export function isValidUrl(url = '') {
     const regex = /^https?:\/\//i;
@@ -42,8 +43,20 @@ export function isYoutubeLink(link) {
 }
 
 export function isImageLink(link) {
-    const match = link.trim().match(imgRegex);
-    return Boolean(match && match[1]);
+    let linkWithoutQuery = link;
+    if (link.indexOf('?') !== -1) {
+        linkWithoutQuery = linkWithoutQuery.split('?')[0];
+    }
+
+    for (let i = 0; i < Files.IMAGE_TYPES.length; i++) {
+        const imageType = Files.IMAGE_TYPES[i];
+
+        if (linkWithoutQuery.endsWith('.' + imageType) || linkWithoutQuery.endsWith('=' + imageType)) {
+            return true;
+        }
+    }
+
+    return false;
 }
 
 // Converts the protocol of a link (eg. http, ftp) to be lower case since
diff --git a/app/utils/url.test.js b/app/utils/url.test.js
new file mode 100644
index 000000000..147f56f08
--- /dev/null
+++ b/app/utils/url.test.js
@@ -0,0 +1,45 @@
+// Copyright (c) 2017-present Mattermost, Inc. All Rights Reserved.
+// See License.txt for license information.
+
+import * as UrlUtils from 'app/utils/url';
+
+/* eslint-disable max-nested-callbacks */
+
+describe('UrlUtils', () => {
+    describe('isImageLink', () => {
+        it('not an image link', () => {
+            const link = 'https://mattermost.com/index.html';
+            expect(UrlUtils.isImageLink(link)).toEqual(false);
+        });
+
+        it('a png link', () => {
+            const link = 'https://mattermost.com/image.png';
+            expect(UrlUtils.isImageLink(link)).toEqual(true);
+        });
+
+        it('a jpg link', () => {
+            const link = 'https://mattermost.com/assets/image.jpeg';
+            expect(UrlUtils.isImageLink(link)).toEqual(true);
+        });
+
+        it('a jpeg link', () => {
+            const link = 'https://mattermost.com/logo.jpeg';
+            expect(UrlUtils.isImageLink(link)).toEqual(true);
+        });
+
+        it('a bmp link', () => {
+            const link = 'https://images.mattermost.com/foo/bar/asdf.bmp';
+            expect(UrlUtils.isImageLink(link)).toEqual(true);
+        });
+
+        it('a gif link', () => {
+            const link = 'https://mattermost.com/jif.gif';
+            expect(UrlUtils.isImageLink(link)).toEqual(true);
+        });
+
+        it('a link with a query parameter', () => {
+            const link = 'https://mattermost.com/image.png?hash=foobar';
+            expect(UrlUtils.isImageLink(link)).toEqual(true);
+        });
+    });
+});