We can then check if it switches play to pause when clicking on the button.
var buttonSelector = ".playButtona";
var button;
beforeEach(function() {
button = document.querySelector(buttonSelector);
});
it("switches play/pause images when the button is clicked", function() {
expect(button.querySelector(".playa").classList.contains("hidea")).toBe(false);
expect(button.querySelector(".pausea").classList.contains("hidea")).toBe(true);
button.click();
expect(button.querySelector(".playa").classList.contains("hidea")).toBe(true);
expect(button.querySelector(".pausea").classList.contains("hidea")).toBe(false);
button.click();
});
And then we can test if the audio is paused or playing when we click the button.
it("plays audio when the button is clicked", function () {
var audio = document.querySelector("audio");
expect(audio.paused).toBe(true);
button.click();
expect(audio.paused).toBe(false);
button.click();
expect(audio.paused).toBe(true);
});
The nice thing about these tests is that if anything changes with the code that prevents any of those tests from working, the test runner (shown below the buttons) shows exactly whatâs broken and why, which helps you to keep the code in a running state when making other improvements to the code.
describe("A suite is just a function", function() {
var a;
it("and so is a spec", function() {
a = true;
expect(a).toBe(true);
});
});
For the trivial example, any time âaâ is not true, when the test is run it will display something like
A suite is just a function - and so is a spec - FAIL
This lets you know the code has a problem with it somewhere. Conversely, if it doesnât fail you will know that changes did not break your code.
Once you set up the tests for the code you can run the tests any time you make changes to code to make sure they are still working as you expect them to. Many programmers actually write the tests before they write any code. Unfortunately it is also true that many programmers do not write any tests at all, which makes debugging their code all that much more difficult.
[quote=âasasass, post:1243, topic:282569, full:trueâ]
Weâll start with this one, and youâll tell me what I should remove first, and weâll go from there.[/quote]