Use latest tag for image source URL in the readme

lib/package-detail-view.js

@@ -372,21 +372,25 @@ export default class PackageDetailView {
       readme = fs.readFileSync(this.readmePath, {encoding: 'utf8'})
     }
 
-    let readmeSrc
-
     if (this.pack.path) {
       // If package is installed, use installed path
-      readmeSrc = this.pack.path
+      let readmeSrc = this.pack.path
+      this.initView(readme, readmeSrc)
     } else {
       // If package isn't installed, use url path
-      let repoUrl = this.packageManager.getRepositoryUrl(this.pack)
+      let repoURL = this.packageManager.getRepositoryUrl(this.pack)
 
       // Check if URL is undefined (i.e. package is unpublished)
-      if (repoUrl) {
-        readmeSrc = repoUrl + `/blob/master/`
+      if (repoURL) {
+        // This only serves for img src
+        this.packageManager.getReadmeSrc(repoURL).then(readmeSrc =>
+          this.initView(readme, readmeSrc)
+        )
       }
     }
+  }
 
+  initView (readme, readmeSrc) {
     const readmeView = new PackageReadmeView(readme, readmeSrc)
     if (this.readmeView) {
       this.readmeView.element.parentElement.replaceChild(readmeView.element, this.readmeView.element)

lib/package-manager.coffee

@@ -435,6 +435,14 @@ class PackageManager
       repoUrl = "https://github.com/#{repoName}"
     repoUrl.replace(/\.git$/, '').replace(/\/+$/, '').replace(/^git\+/, '')
 
+  getReadmeSrc: (url) ->
+    repoData = url.split('/')
+    releaseURL = "https://api.github.com/repos/#{repoData[3]}/#{repoData[4]}/tags"
+    # Builds the url to img src from the readme based on latest tag
+    fetch(releaseURL)
+    .then((res) => res.json())
+    .then((json) => return "#{url}/raw/#{json[0].name}/")
+
   checkNativeBuildTools: ->
     new Promise (resolve, reject) =>
       apmProcess = @runCommand ['install', '--check'], (code, stdout, stderr) ->