fixed up JS to use a js-* class

fixed up Ruby based on review

1 files changed, 7 insertions, 3 deletions

diff --git a/app/assets/javascripts/breadcrumb.js b/app/assets/javascripts/breadcrumb.js
index 7433fcbbad1..10fbcfe96cf 100644
--- a/app/assets/javascripts/breadcrumb.js
+++ b/app/assets/javascripts/breadcrumb.js
@@ -1,5 +1,7 @@
 export const addTooltipToEl = (el) => {
-  if (el.scrollWidth > el.offsetWidth) {
+  const textEl = el.querySelector('.js-breadcrumb-item-text');
+
+  if (textEl && textEl.scrollWidth > textEl.offsetWidth) {
     el.setAttribute('title', el.textContent);
     el.setAttribute('data-container', 'body');
     el.classList.add('has-tooltip');
@@ -7,10 +9,12 @@ export const addTooltipToEl = (el) => {
 };
 
 export default () => {
-  const breadcrumbs = document.querySelector('.breadcrumbs-list');
+  const breadcrumbs = document.querySelector('.js-breadcrumbs-list');
 
   if (breadcrumbs) {
-    const topLevelLinks = breadcrumbs.querySelectorAll('.breadcrumbs-list > li > a');
+    const topLevelLinks = [...breadcrumbs.children].filter(el => !el.classList.contains('dropdown'))
+      .map(el => el.querySelector('a'))
+      .filter(el => el);
     const $expander = $('.js-breadcrumbs-collapsed-expander');
 
     topLevelLinks.forEach(el => addTooltipToEl(el));