diff --git a/apps/container/src/mocks/handlers.ts b/apps/container/src/mocks/handlers.ts index 7017eb3c..e486906f 100644 --- a/apps/container/src/mocks/handlers.ts +++ b/apps/container/src/mocks/handlers.ts @@ -17,7 +17,6 @@ const baseUrl = 'https://api.ufabcnext.com/v1'; export const handlers = [ http.get(`${baseUrl}/users/info`, () => HttpResponse.json(user)), - http.delete(`${baseUrl}/users/me/delete`, () => HttpResponse.json({})), http.get(`${baseUrl}/enrollments`, () => HttpResponse.json(enrollments)), http.get(`${baseUrl}/stats/usage`, () => HttpResponse.json(usage)), http.get(`${baseUrl}/stats/disciplinas/courses`, () => @@ -44,6 +43,9 @@ export const handlers = [ http.get(`${baseUrl}/historiesGraduations`, () => HttpResponse.json(historiesGraduations), ), + http.delete(`${baseUrl}/users/me/delete`, () => HttpResponse.json({})), http.post(`${baseUrl}/account/confirm`, () => HttpResponse.json({})), http.post(`${baseUrl}/users/me/recover`, () => HttpResponse.json({})), + http.post(`${baseUrl}/users/me/resend`, () => HttpResponse.json({})), + http.put(`${baseUrl}/users/complete`, () => HttpResponse.json({})), ]; diff --git a/apps/container/src/mocks/users.ts b/apps/container/src/mocks/users.ts index a064bd63..d652cf72 100644 --- a/apps/container/src/mocks/users.ts +++ b/apps/container/src/mocks/users.ts @@ -12,7 +12,7 @@ export const user: User = { picture: 'picture', google: 'google', }, - ra: 123, + ra: 11201810622, email: 'email@aluno.ufabc.edu.br', }; diff --git a/apps/container/src/router/index.ts b/apps/container/src/router/index.ts index 2d93f4cd..cf41aa20 100644 --- a/apps/container/src/router/index.ts +++ b/apps/container/src/router/index.ts @@ -81,7 +81,7 @@ const routes: Array = [ component: SignUpView, meta: { title: 'Cadastro', - confirmed: false, + // confirmed: false, }, props: true, }, @@ -171,7 +171,7 @@ router.beforeEach(async (to, _from, next) => { } else if (process.env.VUE_APP_MF_ENV !== 'local') { return (window.location.pathname = '/'); } - next('/reviews') + next('/reviews'); } if (notAllowAuth) { if (userToken) return next('/reviews'); diff --git a/apps/container/src/views/SignUp/SignUpView.test.ts b/apps/container/src/views/SignUp/SignUpView.test.ts new file mode 100644 index 00000000..fc143c1b --- /dev/null +++ b/apps/container/src/views/SignUp/SignUpView.test.ts @@ -0,0 +1,258 @@ +import { render, screen, userEvent, waitFor } from '@/test-utils'; +import { SignUpView } from '.'; +import { user as mockedUser } from '@/mocks/users'; +import * as vuetify from 'vuetify'; +import { server } from '@/mocks/server'; +import { HttpResponse, http } from 'msw'; +import { useAuth } from '@/stores/useAuth'; + +describe('', () => { + const originalUseAuthValue = useAuth.getState(); + beforeEach(() => { + useAuth.setState({ + ...originalUseAuthValue, + token: 'token', + user: mockedUser, + }); + }); + afterEach(() => { + useAuth.setState(originalUseAuthValue); + }); + test('render sign up page', () => { + render(SignUpView, { + global: { + stubs: ['router-link'], + }, + }); + expect( + screen.getByText(/Usar outra conta do google\/facebook/i), + ).toBeInTheDocument(); + expect( + screen.getByAltText(/Pessoa meditando na frente do computador/), + ).toBeInTheDocument(); + expect(screen.getByText(/O que você faz na UFABC\?/)).toBeInTheDocument(); + }); + test('logout when click to change account', async () => { + const user = await userEvent.setup(); + render(SignUpView, { + global: { + stubs: ['router-link'], + }, + }); + expect(useAuth.getState().token).not.toBeNull(); + expect(useAuth.getState().user).not.toBeNull(); + await user.click(screen.getByText(/Usar outra conta do google\/facebook/i)); + await waitFor(() => { + expect(useAuth.getState().token).toBeNull(); + expect(useAuth.getState().user).toBeNull(); + }); + }); + test('render sm and down screen', async () => { + vi.spyOn(vuetify, 'useDisplay').mockImplementation( + () => + ({ + smAndDown: true, + }) as unknown as ReturnType, + ); + + render(SignUpView, { + global: { + stubs: ['router-link'], + }, + }); + + expect( + screen.getByAltText(/Pessoa meditando na frente do computador/), + ).toBeInTheDocument(); + expect(screen.getByText(/O que você faz na UFABC\?/)).toBeInTheDocument(); + }); + test('fill form as teacher', async () => { + const user = await userEvent.setup(); + render(SignUpView, { + global: { + stubs: ['router-link'], + }, + }); + + await user.click(screen.getByText(/Professor/i)); + + expect(screen.getByText(/Estamos trabalhando nisso!/i)).toBeInTheDocument(); + }); + test('fill form as student', async () => { + const user = await userEvent.setup(); + render(SignUpView, { + global: { + stubs: ['router-link'], + }, + }); + + await user.click(screen.getByText(/Aluno/)); + + expect( + screen.getByText(/Falta pouco para completar o seu cadastro/i), + ).toBeInTheDocument(); + + await user.type( + screen.getByRole('textbox', { name: 'Insira seu email institucional' }), + mockedUser.email.replace(/(.*)@.*/, '$1'), + ); + + await user.type( + screen.getByRole('textbox', { name: 'Insira seu RA' }), + String(mockedUser.ra), + ); + + await user.type( + screen.getByRole('textbox', { name: 'Confirme seu RA' }), + '123456789', + ); + + expect( + await screen.findByText(/Os campos RA devem ser iguais/), + ).toBeInTheDocument(); + }); + test('fill form as student', async () => { + const user = await userEvent.setup(); + render(SignUpView, { + global: { + stubs: ['router-link'], + }, + }); + + await user.click(screen.getByText(/Aluno/)); + + expect( + screen.getByText(/Falta pouco para completar o seu cadastro/i), + ).toBeInTheDocument(); + + await user.type( + screen.getByRole('textbox', { name: 'Insira seu email institucional' }), + mockedUser.email.replace(/(.*)@.*/, '$1'), + ); + + await user.type( + screen.getByRole('textbox', { name: 'Insira seu RA' }), + String(mockedUser.ra), + ); + + await user.type( + screen.getByRole('textbox', { name: 'Confirme seu RA' }), + String(mockedUser.ra), + ); + + await user.click(screen.getByRole('checkbox')); + + expect(screen.getByText(/Enviar/i)).toBeEnabled(); + await user.click(screen.getByText(/Enviar/i)); + + expect( + await screen.findByText(/Enviamos um email de confirmação para/), + ).toBeInTheDocument(); + + expect(await screen.findByText(mockedUser.email)).toBeInTheDocument(); + + await user.click( + await screen.findByLabelText(/Reenviar email de confirmação/), + ); + + expect( + await screen.findByText(/Email reenviado com sucesso/), + ).toBeInTheDocument(); + }); + test('fill form as student but get error when submit form', async () => { + server.use( + http.put('*/users/complete', () => + HttpResponse.json({ error: 'Erro ao se cadastrar' }, { status: 500 }), + ), + ); + + const user = await userEvent.setup(); + render(SignUpView, { + global: { + stubs: ['router-link'], + }, + }); + + await user.click(screen.getByText(/Aluno/)); + + expect( + screen.getByText(/Falta pouco para completar o seu cadastro/i), + ).toBeInTheDocument(); + + await user.type( + screen.getByRole('textbox', { name: 'Insira seu email institucional' }), + mockedUser.email.replace(/(.*)@.*/, '$1'), + ); + + await user.type( + screen.getByRole('textbox', { name: 'Insira seu RA' }), + String(mockedUser.ra), + ); + + await user.type( + screen.getByRole('textbox', { name: 'Confirme seu RA' }), + String(mockedUser.ra), + ); + + await user.click(screen.getByRole('checkbox')); + + expect(screen.getByText(/Enviar/i)).toBeEnabled(); + await user.click(screen.getByText(/Enviar/i)); + + expect(await screen.findByText(/Erro ao se cadastrar/)).toBeInTheDocument(); + }); + test('fill form as student and get error to resend email', async () => { + server.use( + http.post('*/users/me/resend', () => + HttpResponse.json({ error: 'Erro ao reenviar email' }, { status: 500 }), + ), + ); + + const user = await userEvent.setup(); + render(SignUpView, { + global: { + stubs: ['router-link'], + }, + }); + + await user.click(screen.getByText(/Aluno/)); + + expect( + screen.getByText(/Falta pouco para completar o seu cadastro/i), + ).toBeInTheDocument(); + + await user.type( + screen.getByRole('textbox', { name: 'Insira seu email institucional' }), + mockedUser.email.replace(/(.*)@.*/, '$1'), + ); + + await user.type( + screen.getByRole('textbox', { name: 'Insira seu RA' }), + String(mockedUser.ra), + ); + + await user.type( + screen.getByRole('textbox', { name: 'Confirme seu RA' }), + String(mockedUser.ra), + ); + + await user.click(screen.getByRole('checkbox')); + + expect(screen.getByText(/Enviar/i)).toBeEnabled(); + await user.click(screen.getByText(/Enviar/i)); + + expect( + await screen.findByText(/Enviamos um email de confirmação para/), + ).toBeInTheDocument(); + + expect(await screen.findByText(mockedUser.email)).toBeInTheDocument(); + + await user.click( + await screen.findByLabelText(/Reenviar email de confirmação/), + ); + + expect( + await screen.findByText(/Erro ao reenviar email/), + ).toBeInTheDocument(); + }); +}); diff --git a/apps/container/src/views/SignUp/SignUpView.vue b/apps/container/src/views/SignUp/SignUpView.vue index 68015694..cee465c2 100644 --- a/apps/container/src/views/SignUp/SignUpView.vue +++ b/apps/container/src/views/SignUp/SignUpView.vue @@ -3,7 +3,7 @@ - + logo do UFABC Next aqui + aqui

{{ enableResendEmail ? 'mdi-email' : 'mdi-check-circle' @@ -355,7 +357,7 @@ const validationSchema = toTypedSchema( }), ); -const { handleSubmit, meta } = useForm({ +const { handleSubmit, meta, setValues } = useForm({ validationSchema, }); @@ -400,10 +402,14 @@ watch( () => { if (user.value?.ra && user.value?.email) { step.value = 3; - email.value.value = user.value.email.replace('@aluno.ufabc.edu.br', ''); - ra.value.value = user.value.ra.toString(); - raConfirm.value.value = user.value.ra.toString(); - check.value.value = true; + setValues({ + email: user.value.email.replace('@aluno.ufabc.edu.br', ''), + ra: { + ra: user.value.ra.toString(), + confirm: user.value.ra.toString(), + }, + check: true, + }); } }, );