Testing frontend code

Writing

Writing: Jasmine

• Behaviour driven testing
• Spies & Mocks
• Asynchronous tests
• Angular's choice

Webpage 👉🏼

Writing: Jasmine

                    
                        describe('Calculator', function () {
                            it('should subtract correctly', function () {
                                const calculator = new Calculator();
                                const result = calculator.subtract(20, 5);
                                expect(result).toBe(15);
                            });
                        });
                    
                

Writing: Jest

• Parallel test runs
• Easy mocking
• Convenience layer on top of Jasmine
• Syntax based on Jasmine

Running: Karma

• Continuous testing (file watching)
• Integration with CIs (Jenkins, Travis)
• IDE Support
• Multiple browser support
• Testing framework agnostic (eg. Jasmine, Mocha, etc.)

Running: Jest

• Continuous testing (file watching)
• Integration with CIs (Jenkins, Travis)
• IDE Support
• Browser emulation with js-dom
• Fast (no browser start)

Running: Reporters

• Each reporter produces unique output
• Console: different formatting, cats
• File: different formats for integration purposes

Exercise Time 🧠

• Install Jest
• Add Jest to npm script "test"
• Run Jest
• Implement Test "should sort todos by status"
• Implement sort feature in file status-comparator.js