I have a project that calculates the distance between 2 semitones and I’m building a UI for it.
One of the things I have to do is have unit tests that make sure the game runs as it should.
I have run into an issue where one test keeps failing and I don’t understand why it’s failing.
For context, here is how the class works:
The JamBuddy class manages musical notes, allowing users to set current notes, validate them, and calculate distances between two notes in both clockwise and anticlockwise
let buddy = new JamBuddy();
buddy.setCurrentNotes(["D#", "C"]);
console.log(buddy.calculateDistance()); // Output: [10, 2] (clockwise and anticlockwise distances between D# and C)
Here is what I have so far:
I have this function that updates the UI with the relevant error or success message depending on if the user got the answer correct. It works as it should.
function checkCorrectAnswer() {
const answer = parseInt(answerInputElement.value, 10);
resultElement.textContent = "";
if (answer.toString().includes(".")) {
resultElement.textContent = errorMsgObj.answerFloat;
clearDisplay();
} else if (answer < 0) {
resultElement.textContent = errorMsgObj.answerPositive;
clearDisplay();
} else if (answer > 12) {
resultElement.textContent = errorMsgObj.invalidNumberRange;
clearDisplay();
} else {
const isCorrectAnswer = jamBuddy.checkAnswer(answer);
if (isCorrectAnswer) {
resultElement.textContent = successMsgObj.correctAnswerMsg(answer);
answerInputElement.disabled = true;
checkAnswerBtn.disabled = true;
streakCounterHandler();
streakDisplay.innerHTML = `Current Streak: ${streakCounter}`;
} else {
resultElement.textContent = errorMsgObj.incorrectAnswer;
answerInputElement.disabled = false;
checkAnswerBtn.disabled = false;
clearDisplay();
}
}
}
Here is my unit test:
it("should display a success message when the answer is correct when you click the check answer button", () => {
jamBuddy.setCurrentNotes(["F", "A#"]);
const [ans, ans1] = jamBuddy.calculateDistance();
// Test the first possible answer
answerInput.value = ans;
checkAnswerBtn.click();
clock.tick(1000);
expect(resultElement.textContent).toBe(successMsgObj.correctAnswerMsg(ans)); //"Correct answer!"
The test fails expecting the resultElement.textContent
to have “Incorrect Answer”
Where did I go wrong?
I tried re-writting the function using a switch statement but to no avail.
How can I get the test to pass?