jest-then

Jest-then

The problem

"describe" and "it" are great, but they don't really speak and guide your thinking during the testing process. Jest-then provides new keywords to help give your tests meaning and differentiate between the Arrange Act Assert part of each test.

What does it look like ?

import "jest-then" // This make given, when, ... available as global variable

Feature( `A user can sign-in`, () => {	
	Scenario( `Success`, () => {
		Given( () => {
			// ... pre-conditions for scenario to work
			When( authProvider.isAuthenticated() ).thenReturn( false )
			When( authProvider.signup( credentials ) ).thenResolve()
		} )
		
		Then( `A loader is displayed`, async () => {
			// ... code
			
		} )
		
		And( `A success message is passed to the view`, () => {
			// ... code
		} )
		
		And( `User is redirected to home after a timeout`, async () => {
			// ... code
		} )
	} )
	
	Scenario( `Sign-up error`, () => {
		Given( () => {
			// ... pre-conditions for scenario to work
			When( authProvider.isAuthenticated() ).thenReturn( false )
			When( authProvider.signup( credentials ) ).thenReject( error )
		} )
		
		Then( `An error message is passed to the view`, async () => {
			// ... code
		} )
		
		And( `Loader is disabled`, async () => {
			// ... code
		} )
		
		// ... etc
	} )
} )

Available keywords

Note, you can still use their full api. meaning you can use xscenario or scenario.only as you would with describe or it 😇

Keyword	Alias for
Scenario	describe
Feature	describe
Case	describe
Given	beforeEach
When	beforeEach
Then	test/it
And	test/it

But what if jest changes

Under the hood, this thing uses javascript proxies. I only delegate to the original jest object so you're safe 🥳