#VemProReact
Correção da atividade!
yarn upgrade-interactive...
"collectCoverageFrom": [
"src/**/*.js",
"!src/dev/**",
"!src/**/*.styles.js",
"!src/lib/services/graphql/**",
"!src/lib/setupTests.js"
]
...package.json
#VemProReact
Correção da atividade!
...
let props;
describe('LotacaoPrincipal component', () => {
beforeEach(() => {
props = {
foro: {}
};
});
test('Should renders the component', () => {
const { container } = render(<LotacaoPrincipal {...props} />);
expect(container).toBeDefined();
});
});LotacaoPrincipal.test.js
#VemProReact
Correção da atividade!
...
test('Should renders the component', () => {
...
test('Should renders the component with options', async () => {
...
test('Should renders the component with value', () => {
...
test('Should handle input change', async () => {
...
test('Should handle option change', async () => {
...SelectCargo.test.js
#VemProReact
Correção da atividade!
...
test('Should renders the component with Auth', async () => {
const { container, queryByText } = render(
<MockedProvider mocks={mocks} addTypename={false}>
<ToastProvider maxSnack={3}>
<Dados {...props} />
</ToastProvider>
</MockedProvider>
);
await wait(0);
const button = queryByText('SAVE');
expect(container).toBeDefined();
expect(button).not.toBeNull();
});
...Dados.test.js
#VemProReact
Correção da atividade!
...
test('Should execute callback function', () => {
...
test('Should execute callback function after default wait', () => {
...debounce.test.js
#VemProReact
Correção da atividade!
#Desafio!
https://git-unj.softplan.com.br/vemproreact-jep/vemproreact-jep => aula-10-desafio#VemProReact
__mocks__
Referências para estudos:
#VemProReact
paths
O problema:
import { GET_SOMETHING } from '../../../../services/graphql/queries';import { MOCK_SOMETHING } from '../../../../../__mocks__/apollo/something';#VemProReact
paths
A solução:
{
"compilerOptions": {
"baseUrl": "src/lib"
}
}jsconfig.json
"jest": {
"moduleNameMapper": {
"^lib(.*)$": "<rootDir>/src/lib$1",
"^__mocks__(.*)$": "<rootDir>/__mocks__$1"
}
}package.json
import { GET_SOMETHING } from 'services/graphql/queries';import { MOCK_SOMETHING } from '__mocks__/apollo/something';#VemProReact
data-testid
Referências para estudos:
https://kentcdodds.com/blog/making-your-ui-tests-resilient-to-change
#VemProReact
Defects
#VemProReact
Fluxo GitLab
Referências para estudos:
#VemProReact
Dúvidas?
#VemProReact
Atividade!
#VemProReact
Obrigado!