fix selector of usernames (#36)

* fix selector of usernames
* update githubInjection dep

src/content.js

@@ -8,10 +8,14 @@ const getCurrentUser = () => $(".js-menu-target img").attr("alt").slice(1) || ""
 const isPrivate = () => $(".label-private").length > 0;
 let statsScope = "repo";
 
-function getContributor() {
-  let $contributor = $(".timeline-comment-wrapper .timeline-comment-header-text strong a");
-  if ($contributor.length) {
-    return $contributor.first().text().trim();
+// Get the username of the first contributor *in the DOM* of the page
+function getFirstContributor() {
+  // refined-github has a comprehensive selector. https://github.com/sindresorhus/refined-github/blob/3aadf2f9141107d7ca92e8753f2a66cbc10ebd9d/source/features/show-names.tsx#L13-L16
+  // But we only need usernames within PR & Issue threads..
+  const usernameElements = $('.timeline-comment a.author');
+
+  if (usernameElements.length) {
+    return usernameElements.first().text().trim();
   }
 }
 
@@ -22,7 +26,7 @@ function getContributorInfo() {
   let repo = pathNameArr[2]; // babel-eslint
   let currentNum = pathNameArr[4]; // 3390
   let repoPath = org + "/" + repo; // babel/babel-eslint
-  let contributor = getContributor();
+  let contributor = getFirstContributor();
 
   let ret = {
     contributor,
@@ -365,13 +369,13 @@ function update({ contributor, repoPath, currentNum, user }) {
 }
 
 document.addEventListener("DOMContentLoaded", () => {
-  gitHubInjection(window, () => {
+  gitHubInjection(() => {
     if (isPR(location.pathname) || isIssue(location.pathname)) {
       getSyncStorage({ "_showPrivateRepos": null })
       .then(({ _showPrivateRepos }) => {
         if (!_showPrivateRepos && isPrivate()) return;
 
-          if (getContributor()) {
+          if (getFirstContributor()) {
             update(getContributorInfo());
           }
       });

src/vendor/github-injection.js

@@ -1,55 +1,22 @@
-// https://github.com/octo-linker/injection 0.2.0
+// https://github.com/octo-linker/injection 1.0.1
 'use strict';
 
-var gitHubInjection = function (global, cb) {
-  if (!global) {
-    throw new Error('Missing argument global');
-  }
-
-  if (!global.document || !global.document.getElementById) {
-    throw new Error('The given argument global is not a valid window object');
-  }
-
+const gitHubInjection = cb => {
   if (!cb) {
     throw new Error('Missing argument callback');
   }
 
   if (typeof cb !== 'function') {
-    throw new Error('Callback is not a function');
+    throw new TypeError('Callback is not a function');
   }
 
-  var domElement = global.document.getElementById('js-repo-pjax-container');
-  if (!domElement || !global.MutationObserver) {
-    return cb(null);
-  }
-
-  var viewSpy = new global.MutationObserver(function (mutations) {
-    mutations.forEach(function (mutation) {
-      if (mutation.type === 'childList' && mutation.addedNodes.length) {
-        cb(null);
-      }
-    });
-  });
-
-  viewSpy.observe(domElement, {
-    attributes: true,
-    childList: true,
-    characterData: true
-  });
-
-  cb(null);
+  document.addEventListener('pjax:end', cb);
+  cb();
 };
 
-// Export the gitHubInjection function for **Node.js**, with
-// backwards-compatibility for the old `require()` API. If we're in
-// the browser, add `gitHubInjection` as a global object.
+// Export the gitHubInjection function for **Node.js**
+// Otherwise leave it as a global
 if (typeof exports !== 'undefined') {
-  if (typeof module !== 'undefined' && module.exports) {
-    exports = module.exports = gitHubInjection;
-  }
-  exports.gitHubInjection = gitHubInjection;
-} else {
-  /*jshint -W040 */
-  this.gitHubInjection = gitHubInjection;
-  /*jshint +W040 */
+  module.exports = gitHubInjection;
+  exports = module.exports;
 }