Merge pull request #203 from hyperaudio/197-refactor

- initial refactor
- added tests

Author: maboa

__TEST__/hyperaudio-lite.test.js

@@ -11,6 +11,18 @@ const { HyperaudioLite } = require("../js/hyperaudio-lite");
 let wordArr = [];
 let ht = null;
 
+
+
+test("initialization with parameters", () => {
+  const customHt = new HyperaudioLite("hypertranscript", "hyperplayer", true, true, true, true, true);
+
+  expect(customHt.minimizedMode).toBe(true);
+  expect(customHt.autoscroll).toBe(true);
+  expect(customHt.doubleClick).toBe(true);
+  expect(customHt.webMonetization).toBe(true);
+  expect(customHt.playOnClick).toBe(true);
+});
+
 function createWordArrayResult(words) {
   for (let i = 0; i < words.length; ++i) {
     const m = parseInt(words[i].getAttribute("data-m"));
@@ -59,7 +71,8 @@ document.body.innerHTML =
 
 window.HTMLMediaElement.prototype.play = () => {
   /* does nothing */
-};
+}
+
 
 test("instantiation - options false", () => {
   let minimizedMode = false;
@@ -77,6 +90,8 @@ test("instantiation - options false", () => {
   );
 });
 
+
+
 test("createWordArray", () => {
   const words = document.querySelectorAll("[data-m]");
   const expectedResult = createWordArrayResult(words);
@@ -131,11 +146,6 @@ test("instantiation - doubleClick true", () => {
   );
 });
 
-test("transcript - doubleClick on word", () => {
-  simulateClick(document.getElementsByTagName("span")[4], "dblclick");
-  expect(ht.player.currentTime).toStrictEqual(4.75);
-});
-
 test("instantiation - webMonetization true", () => {
   let minimizedMode = false;
   let autoScroll = false;
@@ -152,6 +162,11 @@ test("instantiation - webMonetization true", () => {
   );
 });
 
+test("transcript - doubleClick on word", () => {
+  simulateClick(document.getElementsByTagName("span")[4], "dblclick");
+  expect(ht.player.currentTime).toStrictEqual(4.75);
+});
+
 // This test always passes - fix it
 /*test("transcript - payment pointer inserted", () => {
   simulateClick(document.getElementsByTagName("span")[4], "click");
@@ -177,3 +192,120 @@ test("transcript - check that active is set on paragraph", () => {
   simulateClick(document.getElementsByTagName("span")[4], "dblclick");
   expect(document.querySelector('p.active')).toBe(document.getElementsByTagName('p')[0]);
 });
+
+test("setupTranscriptHash with no hash", () => {
+  window.location.hash = "";
+  ht.setupTranscriptHash();
+  expect(ht.hashArray).toEqual([]);
+});
+
+test("setupTranscriptHash with valid hash", () => {
+  window.location.hash = "#hypertranscript=10,20";
+  ht.setupTranscriptHash();
+  expect(ht.hashArray).toEqual(["10", "20"]);
+});
+
+test("getSelectionRange with no selection", () => {
+  window.getSelection().removeAllRanges();
+  expect(ht.getSelectionRange()).toBeNull();
+});
+
+test("getSelectionRange with valid selection", () => {
+  const firstSpan = document.querySelector('span[data-m="880"]');
+  const lastSpan = document.querySelector('span[data-m="4750"]');
+  const range = document.createRange();
+  range.setStartBefore(firstSpan);
+  range.setEndAfter(lastSpan);
+  window.getSelection().removeAllRanges();
+  window.getSelection().addRange(range);
+
+  expect(ht.getSelectionRange()).toBe("0.88,5.21");
+});
+
+test("clearActiveClasses removes all active classes", () => {
+  const spans = document.querySelectorAll('span');
+  spans.forEach(span => span.classList.add('active'));
+  
+  ht.clearActiveClasses();
+  
+  spans.forEach(span => {
+    expect(span.classList.contains('active')).toBe(false);
+  });
+});
+
+test("scrollToParagraph updates parentElementIndex", () => {
+  ht.parentElementIndex = 0;
+  ht.scrollToParagraph(1, 6);
+  expect(ht.parentElementIndex).toBe(1);
+});
+
+test("checkPaymentPointer returns correct payment pointer", () => {
+  const p1 = document.getElementById('p1');
+  expect(ht.checkPaymentPointer(p1)).toBe("payment-pointer");
+});
+
+test("checkPaymentPointer returns null for element without payment pointer", () => {
+  const p2 = document.querySelectorAll('p')[1];
+  expect(ht.checkPaymentPointer(p2)).toBeNull();
+});
+
+test("updateTranscriptVisualState marks words as read", () => {
+  ht.updateTranscriptVisualState(5);
+  const spans = document.querySelectorAll('span');
+  expect(spans[0].classList.contains('read')).toBe(true);
+  expect(spans[4].classList.contains('read')).toBe(true);
+  expect(spans[5].classList.contains('unread')).toBe(true);
+});
+
+test("setPlayHead updates currentTime and plays if playOnClick is true", () => {
+  ht.playOnClick = true;
+  ht.myPlayer = { setTime: jest.fn(), play: jest.fn(), paused: true };
+  
+  const event = { target: document.querySelector('span[data-m="3950"]') };
+  ht.setPlayHead(event);
+
+  expect(ht.myPlayer.setTime).toHaveBeenCalledWith(3.95);
+  expect(ht.myPlayer.play).toHaveBeenCalled();
+});
+
+test("preparePlayHead sets paused to false and calls checkPlayHead", () => {
+  ht.checkPlayHead = jest.fn();
+  ht.preparePlayHead();
+  
+  expect(ht.myPlayer.paused).toBe(false);
+  expect(ht.checkPlayHead).toHaveBeenCalled();
+});
+
+test("pausePlayHead clears timer and sets paused to true", () => {
+  jest.useFakeTimers();
+  ht.timer = setTimeout(() => {}, 1000);
+  ht.pausePlayHead();
+  
+  expect(ht.myPlayer.paused).toBe(true);
+  expect(ht.timer).toBeFalsy();
+  jest.useRealTimers();
+});
+
+// This test requires jest.useFakeTimers() to work properly
+test("checkStatus schedules next check", () => {
+  jest.useFakeTimers();
+  ht.myPlayer = { 
+    paused: false, 
+    getTime: jest.fn().mockResolvedValue(5)
+  };
+  ht.updateTranscriptVisualState = jest.fn().mockReturnValue({ currentWordIndex: 4, currentParentElementIndex: 0 });
+  ht.scrollToParagraph = jest.fn();
+  ht.checkPlayHead = jest.fn();
+
+  ht.checkStatus();
+  
+  jest.runAllTimers();
+  
+  expect(ht.checkPlayHead).toHaveBeenCalled();
+  
+  jest.useRealTimers();
+});
+
+
+
+