3 files changed, 57 insertions, 45 deletions

diff --git a/spec/frontend/batch_comments/components/review_bar_spec.js b/spec/frontend/batch_comments/components/review_bar_spec.js
index f98e0a4c64a..f50db6ab210 100644
--- a/spec/frontend/batch_comments/components/review_bar_spec.js
+++ b/spec/frontend/batch_comments/components/review_bar_spec.js
@@ -6,8 +6,6 @@ import createStore from '../create_batch_comments_store';
 describe('Batch comments review bar component', () => {
   let store;
   let wrapper;
-  let addEventListenerSpy;
-  let removeEventListenerSpy;
 
   const createComponent = (propsData = {}) => {
     store = createStore();
@@ -20,58 +18,25 @@ describe('Batch comments review bar component', () => {
 
   beforeEach(() => {
     document.body.className = '';
-
-    addEventListenerSpy = jest.spyOn(window, 'addEventListener');
-    removeEventListenerSpy = jest.spyOn(window, 'removeEventListener');
   });
 
   afterEach(() => {
-    addEventListenerSpy.mockRestore();
-    removeEventListenerSpy.mockRestore();
     wrapper.destroy();
   });
 
-  describe('when mounted', () => {
-    it('it adds review-bar-visible class to body', async () => {
-      expect(document.body.classList.contains(REVIEW_BAR_VISIBLE_CLASS_NAME)).toBe(false);
-
-      createComponent();
-
-      expect(document.body.classList.contains(REVIEW_BAR_VISIBLE_CLASS_NAME)).toBe(true);
-    });
+  it('it adds review-bar-visible class to body when review bar is mounted', async () => {
+    expect(document.body.classList.contains(REVIEW_BAR_VISIBLE_CLASS_NAME)).toBe(false);
 
-    it('it adds a blocking handler to the `beforeunload` window event', () => {
-      expect(addEventListenerSpy).not.toBeCalled();
+    createComponent();
 
-      createComponent();
-
-      expect(addEventListenerSpy).toHaveBeenCalledTimes(1);
-      expect(addEventListenerSpy).toBeCalledWith('beforeunload', expect.any(Function), {
-        capture: true,
-      });
-    });
+    expect(document.body.classList.contains(REVIEW_BAR_VISIBLE_CLASS_NAME)).toBe(true);
   });
 
-  describe('before destroyed', () => {
-    it('it removes review-bar-visible class to body', async () => {
-      createComponent();
-
-      wrapper.destroy();
+  it('it removes review-bar-visible class to body when review bar is destroyed', async () => {
+    createComponent();
 
-      expect(document.body.classList.contains(REVIEW_BAR_VISIBLE_CLASS_NAME)).toBe(false);
-    });
-
-    it('it removes the blocking handler from the `beforeunload` window event', () => {
-      createComponent();
-
-      expect(removeEventListenerSpy).not.toBeCalled();
-
-      wrapper.destroy();
+    wrapper.destroy();
 
-      expect(removeEventListenerSpy).toHaveBeenCalledTimes(1);
-      expect(removeEventListenerSpy).toBeCalledWith('beforeunload', expect.any(Function), {
-        capture: true,
-      });
-    });
+    expect(document.body.classList.contains(REVIEW_BAR_VISIBLE_CLASS_NAME)).toBe(false);
   });
 });
diff --git a/spec/frontend/blob/blob_blame_link_spec.js b/spec/frontend/blob/blob_blame_link_spec.js
new file mode 100644
index 00000000000..0d19177a11f
--- /dev/null
+++ b/spec/frontend/blob/blob_blame_link_spec.js
@@ -0,0 +1,47 @@
+import { setHTMLFixture, resetHTMLFixture } from 'helpers/fixtures';
+import addBlameLink from '~/blob/blob_blame_link';
+
+describe('Blob links', () => {
+  const mouseoverEvent = new MouseEvent('mouseover', {
+    view: window,
+    bubbles: true,
+    cancelable: true,
+  });
+
+  beforeEach(() => {
+    setHTMLFixture(`
+    <div id="blob-content-holder">
+      <div class="line-numbers" data-blame-path="/blamePath">
+        <a id="L5" href="#L5" data-line-number="5" class="file-line-num js-line-links">5</a>
+      </div>
+      <pre id="LC5">Line 5 content</pre>
+    </div>
+    `);
+
+    addBlameLink('#blob-content-holder', 'js-line-links');
+    document.querySelector('.file-line-num').dispatchEvent(mouseoverEvent);
+  });
+
+  afterEach(() => {
+    resetHTMLFixture();
+  });
+
+  it('adds wrapper elements with correct classes', () => {
+    const wrapper = document.querySelector('.line-links');
+
+    expect(wrapper).toBeTruthy();
+    expect(wrapper.classList).toContain('diff-line-num');
+  });
+
+  it('adds blame link with correct classes and path', () => {
+    const blameLink = document.querySelector('.file-line-blame');
+    expect(blameLink).toBeTruthy();
+    expect(blameLink.getAttribute('href')).toBe('/blamePath#L5');
+  });
+
+  it('adds line link within wraper with correct classes and path', () => {
+    const lineLink = document.querySelector('.file-line-num');
+    expect(lineLink).toBeTruthy();
+    expect(lineLink.getAttribute('href')).toBe('#L5');
+  });
+});
diff --git a/spec/frontend/blob/blob_links_tracking_spec.js b/spec/frontend/blob/blob_links_tracking_spec.js
index 22e087bc180..8ef1e9f0ac9 100644
--- a/spec/frontend/blob/blob_links_tracking_spec.js
+++ b/spec/frontend/blob/blob_links_tracking_spec.js
@@ -15,7 +15,7 @@ describe('Blob links Tracking', () => {
 
   beforeEach(() => {
     setHTMLFixture(`
-    <div id="blob-content-holder">
+    <div class="file-holder">
       <div class="line-links diff-line-num">
         <a href="#L5" class="file-line-blame"></a>
         <a id="L5" href="#L5" data-line-number="5" class="file-line-num">5</a>
@@ -23,7 +23,7 @@ describe('Blob links Tracking', () => {
       <pre id="LC5">Line 5 content</pre>
     </div>
     `);
-    addBlobLinksTracking('#blob-content-holder', eventsToTrack);
+    addBlobLinksTracking();
     jest.spyOn(Tracking, 'event');
   });