diff --git a/src/components/timerToggleButton/TimerToggleButton.test.js b/src/components/timerToggleButton/TimerToggleButton.test.js new file mode 100644 index 0000000..b2f7737 --- /dev/null +++ b/src/components/timerToggleButton/TimerToggleButton.test.js @@ -0,0 +1,72 @@ +import React from 'react' +import { fireEvent, render, screen } from '@testing-library/react'; +import TimerToggleButton from './TimerToggleButton'; + +const stubSetElapsedTime = jest.fn(); +const stubSetIsRunning = jest.fn(); +const stubUseContext = jest.fn(); + +const defaultContext = { + isRunning: false, + setElapsedTime: stubSetElapsedTime, + setIsRunning: stubSetIsRunning +} + +const renderWithContext = (context = defaultContext) => { + React.useContext = stubUseContext.mockReturnValue(context) + return render() +}; + +beforeEach(() => { + jest.useFakeTimers(); +}) + +afterEach(() => { + jest.useRealTimers(); +}); + +test('should render as expected when isRunning is set to false', () => { +const component = renderWithContext(); + + expect(component.container).toMatchSnapshot(); +}); + +test('should render as expected when isRunning is set to true', () => { + const givenContext = { + ...defaultContext, + isRunning: true + } + + const component = renderWithContext(givenContext); + + expect(component.container).toMatchSnapshot(); + }); + +test('should call setIsRunning with true on button click when isRunning is false', () => { + renderWithContext(); + + const button = screen.getByText('Start'); + + fireEvent.click(button) + + jest.runAllTimers(); + + expect(stubSetIsRunning).toHaveBeenCalledWith(true); +}); + +test('should call setIsRunning with false on button click when isRunning is true', () => { + const givenContext = { + ...defaultContext, + isRunning: true + } + + renderWithContext(givenContext); + + const button = screen.getByText('Stop'); + + fireEvent.click(button) + + jest.runAllTimers(); + + expect(stubSetIsRunning).toHaveBeenCalledWith(false); +}); \ No newline at end of file diff --git a/src/components/timerToggleButton/__snapshots__/TimerToggleButton.test.js.snap b/src/components/timerToggleButton/__snapshots__/TimerToggleButton.test.js.snap new file mode 100644 index 0000000..f25d2e0 --- /dev/null +++ b/src/components/timerToggleButton/__snapshots__/TimerToggleButton.test.js.snap @@ -0,0 +1,23 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`should render as expected when isRunning is set to false 1`] = ` +
+ +
+`; + +exports[`should render as expected when isRunning is set to true 1`] = ` +
+ +
+`;