Skip to content

Instantly share code, notes, and snippets.

View mariocsantos's full-sized avatar

Mário Santos mariocsantos

View GitHub Profile
@mariocsantos
mariocsantos / FavoriteFoodSearch.test.js
Created January 10, 2021 17:18
Favorites food search violations test
import React from 'react';
import { render } from '@testing-library/react';
import { axe, toHaveNoViolations } from 'jest-axe';
import { FavoriteFoodSearch } from '../FavoriteFoodSearch';
expect.extend(toHaveNoViolations)
describe('FavoriteFoodSearch', () => {
it('should not fail any accessibility tests', async () => {
@mariocsantos
mariocsantos / FavoriteFoodSearch.js
Created January 10, 2021 17:16
Favorite food search
import React, { useState } from 'react';
function FavoriteFoodSearch() {
const [search, setSearch] = useState('');
const handleChange = (event) => {
setSearch(event.target.value ?? '');
}
return (
@mariocsantos
mariocsantos / FavoriteFoods.test.js
Created January 10, 2021 16:31
Favorite foods test with waitFor function.
import React from 'react';
import { render, screen, waitFor } from '@testing-library/react';
import { FavoriteFoodList } from '../FavoriteFoodList';
describe('FavoriteFoodList', () => {
it('should render my favorites food', async () => {
render(<FavoriteFoodList />);
await waitFor(() => expect(screen.getAllByRole('listitem')).toHaveLength(3));
});
});
@mariocsantos
mariocsantos / FavoriteFoods.js
Last active January 13, 2021 14:12
Dynamically favorite foods
import React, { useEffect, useState } from 'react';
import { getFavoritesFood } from './api';
function FavoriteFoodList() {
const [list, setList] = useState([]);
const getList = async () => {
const newList = await getFavoritesFood();
setList(newList);
@mariocsantos
mariocsantos / FavoriteFood.js
Last active January 13, 2021 14:16
Favorite food with onSubmit prop
import React, { useState } from 'react';
function FavoriteFood({ onSubmit }) {
const [favoriteFood, setFavoriteFood] = useState('');
const handleChange = (event) => {
setFavoriteFood(event.target.value);
}
const handleSubmit = (event) => {
@mariocsantos
mariocsantos / FavoriteFood.test.js
Last active January 13, 2021 21:01
Favorite food test mock prop
import React from 'react';
import { render, screen } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { FavoriteFood } from '../FavoriteFood';
describe('FavoriteFood', () => {
it('should submit form', () => {
const onSubmitMock = jest.fn();
render(<FavoriteFood onSubmit={onSubmitMock} />);
import React from 'react';
import { render, screen } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { FavoriteFood } from '../FavoriteFood';
describe('FavoriteFood', () => {
it('should disable add food button', () => {
render(<FavoriteFood />);
expect(screen.getByRole('button')).toBeDisabled();
@mariocsantos
mariocsantos / FavoriteFood.js
Last active January 13, 2021 14:16
Favorite food
import React, { useState } from 'react';
function FavoriteFood() {
const [favoriteFood, setFavoriteFood] = useState('');
const handleChange = (event) => {
setFavoriteFood(event.target.value);
}
return (
@mariocsantos
mariocsantos / FavoriteFoodList.test.js
Created December 23, 2020 14:26
Debugging favorites food
import React from 'react';
import { render, screen } from '@testing-library/react';
import { FavoriteFoodList } from '../FavoriteFoodList';
describe('FavoriteFoodList', () => {
it('should render my favorites food', () => {
render(<FavoriteFoodList />);
screen.debug();
});
});
@mariocsantos
mariocsantos / FavoriteFoodList.test.js
Created December 22, 2020 22:22
Favorite food list test using "not"
import React from 'react';
import { render, screen } from '@testing-library/react';
import { FavoriteFoodList } from '../FavoriteFoodList';
describe('FavoriteFoodList', () => {
it('should render my favorites food', () => {
render(<FavoriteFoodList />);
expect(screen.getAllByRole('listitem')).not.toHaveLength(3);
});
});