Skip to content

Instantly share code, notes, and snippets.

@swapnilraj
Last active December 31, 2018 13:48
Show Gist options
  • Save swapnilraj/f0b0ad2cb7ac6c2f6bde07bacd01d0c0 to your computer and use it in GitHub Desktop.
Save swapnilraj/f0b0ad2cb7ac6c2f6bde07bacd01d0c0 to your computer and use it in GitHub Desktop.
Document describing an approach to add unit tests to the project.

Description

As stated in our discussion while version 3.0.0 was being released we need to add tests to the project for several reasons, one of them being to easily verify new changes and make sure they don't break the project. The tests will also help keep track of the edge cases for future reference. This document is concerned only with unit tests but we will work in the future to add e2e testing.

Approach

I propose jest as the unit testing framework for the project since I have some experience using it. jest also comes with a default environment which mocks the Document Object Model that requires no setup; which is very handy for our purposes.

The environment mock the DOM using js-dom a library that I have worked with in the past.

Code Changes

I suggest making a new folder for the tests, and it keeping it separate from the code of the extension itself, since the codebase is fairly small. The test folder will contain both the e2e and unit tests.

.
├── js
│   ├── constants.js
│   ├── content.js
│   ├── utils
│   │   ├── DOMUtils.js
│   │   ├── awaitElement.js
│   │   ├── mutation_handlers
│   │   │   └── cached_handler.js
│   │   ├── parsers
│   │   │   ├── tag.js
│   │   │   └── title.js
│   │   └── providers
│   │       └── AZLyrics.js
│   └── views
│       └── lyricsView.js
└── test
    └── unit
        └── utils
            └── parsers
                └── title.test.js

We should mock the directory structure of the extension itself as much as possible to keep things simple to track. The figure above shows how test folder will be layed out compared to the code of the extension in the first commit.

Conclusion

There have been many issues that could have been avoided if there were tests in place. This is a step towards making the project easier to maintain. There will a different branch to add e2e testing. Another step towards making the project easier to maintain would be adding ESLint.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment