Filter out all .css, .png and .svg files from showing up in Sources t…

…ree (#4145)

src/utils/sources-tree/index.js

@@ -17,5 +17,6 @@ export {
   isDirectory,
   createNode,
   createParentMap,
-  getRelativePath
+  getRelativePath,
+  isNotJavaScript
 } from "./utils";

src/utils/sources-tree/tests/utils.spec.js

@@ -10,7 +10,8 @@ import {
   addToTree,
   sortEntireTree,
   getURL,
-  getDirectories
+  getDirectories,
+  isNotJavaScript
 } from "../index";
 
 describe("sources tree", () => {
@@ -177,4 +178,39 @@ describe("sources tree", () => {
       expect(urlObject.filename).toBe("(index)");
     });
   });
+
+  describe("isNotJavaScript", () => {
+    it("js file", () => {
+      expect(
+        isNotJavaScript({
+          url: "http://example.com/foo.js"
+        })
+      ).toBe(false);
+    });
+
+    it("css file", () => {
+      expect(
+        isNotJavaScript({
+          url: "http://example.com/foo.css"
+        })
+      ).toBe(true);
+    });
+
+    it("svg file", () => {
+      expect(
+        isNotJavaScript({
+          url: "http://example.com/foo.svg"
+        })
+      ).toBe(true);
+    });
+
+    it("png file", () => {
+      expect(
+        isNotJavaScript({
+          url: "http://example.com/foo.png"
+        })
+      ).toBe(true);
+    });
+  });
+
 });

src/utils/sources-tree/utils.js

@@ -30,13 +30,24 @@ export function isDirectory(url: Object) {
   );
 }
 
+export function isNotJavaScript(source: Object): boolean {
+  const parsedUrl = parse(source.url).pathname
+  if (!parsedUrl) {
+    return false;
+  }
+  const parsedExtension = parsedUrl.split('.').pop();
+
+  return ["css", "svg", "png"].includes(parsedExtension)
+}
+
 export function isInvalidUrl(url: Object, source: Object) {
   return (
     IGNORED_URLS.indexOf(url) != -1 ||
     !source.get("url") ||
     source.get("loadedState") === "loading" ||
     !url.group ||
-    isPretty(source.toJS())
+    isPretty(source.toJS()) ||
+    isNotJavaScript(source.toJS())
   );
 }