I love using Jest to unit test my Aurelia applications. Sadly, one of the most popular options for mocking event listeners and simulating events called Enzyme is targeted at React applications and to my knowledge, does not work with Aurelia or any other framework like Angular.
If you are wanting to test events registered using addEventListener there is an easy way to mock them.
describe('My Test', () => {
let sut;
let events = {};
beforeEach(() => {
sut = new Dependency();
// Empty our events before each test case
events = {};
// Define the addEventListener method with a Jest mock function
document.addEventListener = jest.fn((event, callback) => {
events[event] = callback;
});
});
test('Test Keypress fires callback', () => {
// Watch the keypress callback
jest.spyOn(sut, 'keypressCallback');
// Fire the keypress event
events.keypress({ key: 'Enter' });
});
});This approach works for a lot of other things you want to test and mock.
Worked a treat – thank you!
Silly question – what is `map` supposed to be?
@Joe
Not silly at all, and my apologies. The map was supposed to be `events` I have since fixed this up.
I don’t know why google search hardly mentions using the simplest callback method, I think the callback is the most direct and practical way to test the event
“`
q.on(‘done’, function (payload, job) {
try {
expect(q._pendingCount).toBeLessThanOrEqual(5)
const elapsed = performance.now() – start
expect(elapsed).toBeGreaterThanOrEqual(200 * Math.ceil((count + 1) / 5))
if (count++ >= 10) {
q.stop()
done()
}
} catch (err) {
q.stop()
done(err)
}
})
“`
I don’t understand this line:
sut = new Dependency();
What is it doing? Is “new Dependency()” something I would actually write in my code, or is it a placeholder?