Why is playVideo() not in the code?

JavaScript
122

I’m going to work on some tests, making them easy to achieve and easy to ignore.

Two library items are added to jsitor, one for mocha which is the testing framework, and one for chai which performs the assertions.

image
image817×446 22.4 KB

We can tell the test to show the report as a list in the console:

/* TESTS */
mocha.setup({
    checkLeaks: true,
    reporter: "list",
    ui: "bdd"
});
const expect = chai.expect;
describe("Simple test", function () {
    it("can pass a test", function () {
        expect(true).to.equal(true);
    });
    it("can fail a test", function () {
        expect(false).to.equal(true);
    });
});
mocha.run();

That way the browser area of jsitor is not affected, and in the console we get a list of what passes and fails.

image

Now that things are confirmed as working, I prefer to replace the list reporter with just the dot reporter, as that stays nice and quiet on passing tests and only gives detail on failing tests.

mocha.setup({
    checkLeaks: true,
    reporter: "dot",
    ui: "bdd"
});

From here on out it can just be a simple matter of adding tests for new or untested behaviour.

I’ll start nice and small, with the spinner code. We only need to check that it adds or removes a classname.

describe("Spinner", function () {
    const div = document.createElement("div");
    it("toggles on when the classname doesn't exist", function () {
        div.classList.remove("lds-dual-ring");
        spinner.toggleDualRing(div);
        expect(div.classList.contains("lds-dual-ring")).to.equal(true);
    });
    it("toggles off when the classname already exists", function () {
        div.classList.add("lds-dual-ring");
        spinner.toggleDualRing(div);
        expect(div.classList.contains("lds-dual-ring")).to.equal(false);
    });
});

The rest of it is about as simple. Pick small behaviours that are expected to remain consistent, and ensure that they are working as expected. That way later on when we break something that isn’t immediately visible, we get instant feedback about it.

1 Like