Skip to content
This repository was archived by the owner on Jan 3, 2023. It is now read-only.

WM3-ANNA-js2-week3 #116

Open
Aclayonwright wants to merge 2 commits into
base: main
Choose a base branch
from
Open

WM3-ANNA-js2-week3 #116

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
d5d8648
2
Aclayonwright Oct 22, 2021
653e636
Update alarmclock.test.js
Aclayonwright Oct 22, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
133 changes: 67 additions & 66 deletions mandatory/1-alarmclock/alarmclock.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,98 +7,99 @@ const { JSDOM } = require("jsdom");

let page = null;

beforeEach(async () => {
page = await JSDOM.fromFile(path.join(__dirname, "index.html"), {
resources: "usable",
runScripts: "dangerously",
});

jest.useFakeTimers();

// do this so students can use element.innerText which jsdom does not implement
Object.defineProperty(page.window.HTMLElement.prototype, "innerText", {
get() {
return this.textContent;
},
set(value) {
this.textContent = value;
},
});

return new Promise((res) => {
page.window.document.addEventListener("load", res);
});
beforeEach(async() => {
page = await JSDOM.fromFile(path.join(__dirname, "index.html"), {
resources: "usable",
runScripts: "dangerously",
});

jest.useFakeTimers();

// do this so students can use element.innerText which jsdom does not implement
Object.defineProperty(page.window.HTMLElement.prototype, "innerText", {
get() {
return this.textContent;
},
set(value) {
this.textContent = value;
},
M
});
NN
return new Promise((res) => {
page.window.document.addEventListener("load", res);
});
});

afterEach(() => {
jest.useRealTimers();
page = null;
jest.useRealTimers();
page = null;
});

test("should set heading when button is clicked", () => {
const heading = page.window.document.querySelector("#timeRemaining");
const input = page.window.document.querySelector("#alarmSet");
const button = page.window.document.querySelector("#set");
const heading = page.window.document.querySelector("#timeRemaining");
const input = page.window.document.querySelector("#alarmSet");
const button = page.window.document.querySelector("#set");

input.value = "19";
button.click();
input.value = "19";
button.click();

expect(heading).toHaveTextContent("Time Remaining: 00:19");
expect(heading).toHaveTextContent("Time Remaining: 00:19");
});

test("should split values over 60 seconds into minutes and seconds", () => {
const heading = page.window.document.querySelector("#timeRemaining");
const input = page.window.document.querySelector("#alarmSet");
const button = page.window.document.querySelector("#set");
const heading = page.window.document.querySelector("#timeRemaining");
const input = page.window.document.querySelector("#alarmSet");
const button = page.window.document.querySelector("#set");

input.value = "119";
button.click();
input.value = "119";
button.click();

expect(heading).toHaveTextContent("Time Remaining: 01:59");
expect(heading).toHaveTextContent("Time Remaining: 01:59");
});

test("should update the heading while counting down", () => {
const heading = page.window.document.querySelector("#timeRemaining");
const input = page.window.document.querySelector("#alarmSet");
const button = page.window.document.querySelector("#set");

input.value = "19";
button.click();

for (let i = 18; i > 0; i--) {
jest.runOnlyPendingTimers();
const seconds = `${i}`.padStart(2, "0");
expect(heading).toHaveTextContent(`Time Remaining: 00:${seconds}`);
}
const heading = page.window.document.querySelector("#timeRemaining");
const input = page.window.document.querySelector("#alarmSet");
const button = page.window.document.querySelector("#set");

input.value = "19";
button.click();

for (let i = 18; i > 0; i--) {
jest.runOnlyPendingTimers();
const seconds = `${i}`.padStart(2, "0");
expect(heading).toHaveTextContent(`Time Remaining: 00:${seconds}`);
}
});

test("should count down every 1000 ms", () => {
const input = page.window.document.querySelector("#alarmSet");
const button = page.window.document.querySelector("#set");
const input = page.window.document.querySelector("#alarmSet");
const button = page.window.document.querySelector("#set");

const mockTimer = jest.fn();
page.window.setTimeout = mockTimer;
page.window.setInterval = mockTimer;
const mockTimer = jest.fn();
page.window.setTimeout = mockTimer;
page.window.setInterval = mockTimer;

input.value = "19";
button.click();
input.value = "19";
button.click();

expect(mockTimer).toHaveBeenCalledTimes(1);
expect(mockTimer).toHaveBeenLastCalledWith(expect.any(Function), 1000);
expect(mockTimer).toHaveBeenCalledTimes(1);
expect(mockTimer).toHaveBeenLastCalledWith(expect.any(Function), 1000);
});

test("should play audio when the timer reaches zero", () => {
const input = page.window.document.querySelector("#alarmSet");
const button = page.window.document.querySelector("#set");
const mockPlayAlarm = jest.fn();
const input = page.window.document.querySelector("#alarmSet");
const button = page.window.document.querySelector("#set");
const mockPlayAlarm = jest.fn();

page.window.playAlarm = mockPlayAlarm;
input.value = "10";
button.click();
page.window.playAlarm = mockPlayAlarm;
input.value = "10";
button.click();

expect(mockPlayAlarm).toHaveBeenCalledTimes(0);
expect(mockPlayAlarm).toHaveBeenCalledTimes(0);

jest.runAllTimers();
jest.runAllTimers();

expect(mockPlayAlarm).toHaveBeenCalledTimes(1);
});
expect(mockPlayAlarm).toHaveBeenCalledTimes(1);
});