-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Add unit testing with Jest, and React Testing Library. - Add Husky to prevent a push if tests are failing. - Perform patch and minor dependency updates. - Make a few refactoring changes. - Add new skills to profile. - Update version.
- Loading branch information
Showing
47 changed files
with
5,980 additions
and
750 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,6 @@ | ||
| #!/usr/bin/env sh | ||
| . "$(dirname -- "$0")/_/husky.sh" | ||
|
|
||
| # The git command throws an error if there are local uncommitted changes thus preventing a push. | ||
| # The test command runs all tests not in watch mode and prevents a push if any test fails. | ||
| git diff HEAD --quiet && npm run test -- --watchAll=false |
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,64 @@ | ||
| import { render, screen } from '@testing-library/react'; | ||
|
|
||
| import { App } from 'src/App'; | ||
| import * as useNavBar from 'src/components/NavBar/useNavBar'; | ||
| import { IMAGES } from 'src/data/images'; | ||
| import { PROJECTS } from 'src/data/projects'; | ||
| import { setupIntersectionObserverMock, testCategoriesIsRendered } from 'src/testUtilities'; | ||
|
|
||
| describe('test App', () => { | ||
| test('renders all of the project titles', () => { | ||
| setupIntersectionObserverMock(); | ||
| render(<App />); | ||
|
|
||
| PROJECTS.forEach(({ title }) => { | ||
| expect(screen.getByText(title)).toBeInTheDocument(); | ||
| }); | ||
| }); | ||
|
|
||
| describe('renders dependent components', () => { | ||
| afterEach(() => { | ||
| jest.restoreAllMocks(); | ||
| }); | ||
|
|
||
| test('renders NavBar', () => { | ||
| const useNavBarSpy = jest.spyOn(useNavBar, 'useNavBar'); | ||
|
|
||
| render(<App />); | ||
|
|
||
| expect(useNavBarSpy).toHaveBeenCalled(); | ||
| }); | ||
|
|
||
| test('renders Welcome', () => { | ||
| render(<App />); | ||
|
|
||
| expect(screen.getByTestId('welcome')).toBeInTheDocument(); | ||
| }); | ||
|
|
||
| test('renders Section three times', () => { | ||
| render(<App />); | ||
|
|
||
| expect(screen.getAllByRole('heading', { level: 2 }).length).toEqual(3); | ||
| }); | ||
|
|
||
| test('renders Profile', () => { | ||
| render(<App />); | ||
|
|
||
| // Categories is rendered by Profile, | ||
| // So if at least one category item is rendered | ||
| // Then we know Profile is rendered | ||
| testCategoriesIsRendered(); | ||
| }); | ||
|
|
||
| test('renders photography', () => { | ||
| // If at least one image is rendered then we know Photography was rendered | ||
| const { source, title } = IMAGES[0]; | ||
|
|
||
| render(<App />); | ||
|
|
||
| expect((screen.getAllByRole('img', { name: title })[0] as HTMLImageElement).src).toContain( | ||
| source, | ||
| ); | ||
| }); | ||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,11 @@ | ||
| import { render, screen } from '@testing-library/react'; | ||
|
|
||
| import { ButtonAnimation } from 'src/components/ButtonAnimation/ButtonAnimation'; | ||
|
|
||
| describe('test ButtonAnimation', () => { | ||
| test('renders buttons', () => { | ||
| render(<ButtonAnimation />); | ||
|
|
||
| expect(screen.getAllByRole('button')).not.toHaveLength(0); | ||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,91 @@ | ||
| import { render, screen } from '@testing-library/react'; | ||
| import userEvent from '@testing-library/user-event'; | ||
|
|
||
| import { ClientWork } from 'src/components/ClientWork/ClientWork'; | ||
| import { CLIENT_WORK } from 'src/data/clientWork'; | ||
|
|
||
| describe('test ClientWork', () => { | ||
| test('renders all the tabs with the correct label', () => { | ||
| render(<ClientWork />); | ||
|
|
||
| CLIENT_WORK.forEach(({ name }) => { | ||
| expect(screen.getByRole('tab', { name })).toBeInTheDocument(); | ||
| }); | ||
| }); | ||
|
|
||
| test('only renders a single tab panel', () => { | ||
| render(<ClientWork />); | ||
|
|
||
| expect(screen.getAllByRole('tabpanel')).toHaveLength(1); | ||
| }); | ||
|
|
||
| test('renders the first tab panel initially', () => { | ||
| render(<ClientWork />); | ||
|
|
||
| expect(screen.getByRole('tabpanel', { name: CLIENT_WORK[0].name })).toBeInTheDocument(); | ||
| }); | ||
|
|
||
| test('renders the correct tab panel after the its tab is clicked', () => { | ||
| const user = userEvent.setup(); | ||
|
|
||
| render(<ClientWork />); | ||
|
|
||
| CLIENT_WORK.forEach(async ({ name }) => { | ||
| await user.click( | ||
| screen.getByRole('tab', { | ||
| name, | ||
| }), | ||
| ); | ||
|
|
||
| expect(screen.getByRole('tabpanel', { name })).toBeInTheDocument(); | ||
| }); | ||
| }); | ||
|
|
||
| test('renders the correct image for each tab panel', () => { | ||
| const user = userEvent.setup(); | ||
|
|
||
| render(<ClientWork />); | ||
|
|
||
| CLIENT_WORK.forEach(async ({ image, name }) => { | ||
| await user.click( | ||
| screen.getByRole('tab', { | ||
| name, | ||
| }), | ||
| ); | ||
|
|
||
| expect(screen.getByRole('img', { name: image })).toBeInTheDocument(); | ||
| }); | ||
| }); | ||
|
|
||
| test('renders the correct description for each tab panel', () => { | ||
| const user = userEvent.setup(); | ||
|
|
||
| render(<ClientWork />); | ||
|
|
||
| CLIENT_WORK.forEach(async ({ description, name }) => { | ||
| await user.click( | ||
| screen.getByRole('tab', { | ||
| name, | ||
| }), | ||
| ); | ||
|
|
||
| expect(screen.getByText(description)).toBeInTheDocument(); | ||
| }); | ||
| }); | ||
|
|
||
| test('renders the correct link for each tab panel', () => { | ||
| const user = userEvent.setup(); | ||
|
|
||
| render(<ClientWork />); | ||
|
|
||
| CLIENT_WORK.forEach(async ({ href, name }) => { | ||
| await user.click( | ||
| screen.getByRole('tab', { | ||
| name, | ||
| }), | ||
| ); | ||
|
|
||
| expect(screen.getByRole('link')).toHaveAttribute('href', href); | ||
| }); | ||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.