diff --git a/.env b/.env index f61b9ba8..746e65e0 100644 --- a/.env +++ b/.env @@ -1,4 +1,3 @@ NEXT_PUBLIC_CLIENT_BASE_URL=https://uat.a-comosus.link NEXT_PUBLIC_GRAPHQL_ENDPOINT=https://api.uat.a-comosus.link/graphql/ -NEXT_PUBLIC_RECAPTCHA_SITE_KEY=6LcYqNcgAAAAAEVUbCZb4cvf919b48U9Ux-Mz_cv - +NEXT_PUBLIC_RECAPTCHA_SITE_KEY=6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI diff --git a/.env.development b/.env.development new file mode 100644 index 00000000..28c3d824 --- /dev/null +++ b/.env.development @@ -0,0 +1,2 @@ +NEXT_PUBLIC_GRAPHQL_ENDPOINT=http://localhost:3100/graphql/ +GRAPHQL_ENDPOINT=http://localhost:3100/graphql/ \ No newline at end of file diff --git a/cypress.config.ts b/cypress.config.ts index 37d50055..cb6dc01c 100644 --- a/cypress.config.ts +++ b/cypress.config.ts @@ -2,6 +2,7 @@ import { defineConfig } from 'cypress'; export default defineConfig({ projectId: '21s6cy', + chromeWebSecurity: false, e2e: { setupNodeEvents(on, config) { // implement node event listeners here diff --git a/cypress/e2e/auth/login.cy.js b/cypress/e2e/auth/auth.cy.js similarity index 58% rename from cypress/e2e/auth/login.cy.js rename to cypress/e2e/auth/auth.cy.js index 99599883..da8096d9 100644 --- a/cypress/e2e/auth/login.cy.js +++ b/cypress/e2e/auth/auth.cy.js @@ -1,14 +1,14 @@ /// -describe('Login Feature', function () { +describe('Auth Feature', function () { beforeEach(() => { - cy.visit('http://localhost:3000/login'); cy.fixture('auth').then((data) => { this.authData = data; }); }); it('displays two input field by default', () => { + cy.visit('http://localhost:3000/login'); cy.get('form').within(() => { cy.get('input').should('have.length', 2); }); @@ -17,7 +17,6 @@ describe('Login Feature', function () { it('navigate user to admin panel when logged in', () => { const { username, password } = this.authData; cy.login(username.valid, password.valid); - cy.url().should('contains', '/admin'); }); it('display error message when entered incorrect credential', () => { @@ -25,4 +24,16 @@ describe('Login Feature', function () { cy.login(username.invalid, password.invalid); cy.get('[data-test-id="login.error"]').should('be.visible'); }); + + it('Signup Feature', () => { + const { username, email, password } = this.authData; + cy.signup(username.valid, email.valid, password.valid); + cy.get('[data-testid="checkbox"]').click(); + cy.get('[data-testid="register"]').click(); + cy.get('[data-testid="display-name"]').type('KevinLu'); + cy.get('[data-testid="continue-btn"]').click(); + cy.get(':nth-child(2) > .css-13qzv8t').click(); + cy.recaptcha(); + cy.get('[data-testid="recaptcha-continue-btn"]').click(); + }); }); diff --git a/cypress/fixtures/auth.json b/cypress/fixtures/auth.json index 4167581f..05c37d74 100644 --- a/cypress/fixtures/auth.json +++ b/cypress/fixtures/auth.json @@ -1,6 +1,10 @@ { "username": { - "valid": "norris-wu", + "valid": "tester", + "invalid": "invalid" + }, + "email": { + "valid": "tester@gmail.com", "invalid": "invalid" }, "password": { diff --git a/cypress/support/commands.ts b/cypress/support/commands.ts index 51a4e03b..4774603a 100644 --- a/cypress/support/commands.ts +++ b/cypress/support/commands.ts @@ -19,6 +19,31 @@ Cypress.Commands.add('login', (username: string, password: string) => { }); }); +Cypress.Commands.add( + 'signup', + (username: string, email: string, password: string) => { + cy.visit('http://localhost:3000/sign-up'); + cy.get('form').within(() => { + const randomStr = (Math.random() + 1).toString(36).substring(7); + cy.get('[id="username"]').type(`KevinLu${randomStr}`); + cy.get('[id="email"]').type(`turnkevin${randomStr}@gmail.com`); + cy.get('[id="password"]').type('admin123'); + }); + }, +); + +Cypress.Commands.add('recaptcha', () => { + cy.get('iframe') + .first() + .its('0.contentDocument.body') + .should('not.be.undefined') + .and('not.be.empty') + .then(cy.wrap) + .find('#recaptcha-anchor') + .should('be.visible') + .click(); +}); + // -- This is a child command -- // Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... }) // diff --git a/src/modules/auth/SignUpForm/Policy.tsx b/src/modules/auth/SignUpForm/Policy.tsx index d7e8c28a..d14d9af5 100644 --- a/src/modules/auth/SignUpForm/Policy.tsx +++ b/src/modules/auth/SignUpForm/Policy.tsx @@ -17,7 +17,7 @@ export default function Policy({ name, control }: PolicyProps) { render={({ field, fieldState: { invalid, error } }) => ( - + {t('sign-up.policy.description')} {error && ( diff --git a/src/modules/auth/SignUpForm/SignUpForm.tsx b/src/modules/auth/SignUpForm/SignUpForm.tsx index 7eb9a3ee..5300e357 100644 --- a/src/modules/auth/SignUpForm/SignUpForm.tsx +++ b/src/modules/auth/SignUpForm/SignUpForm.tsx @@ -103,7 +103,12 @@ export default function SignUpForm({ testId="sign-up.error" error={t('sign-up.error.user-exist')} /> - diff --git a/src/modules/onboarding/OnboardingForm/OnboardingForm.DisplayName.tsx b/src/modules/onboarding/OnboardingForm/OnboardingForm.DisplayName.tsx index fb9ee1b6..b0db1c98 100644 --- a/src/modules/onboarding/OnboardingForm/OnboardingForm.DisplayName.tsx +++ b/src/modules/onboarding/OnboardingForm/OnboardingForm.DisplayName.tsx @@ -20,6 +20,7 @@ export default function DisplayName({ name, control }: DisplayNameProps) { control={control} placeholder={t('display-name.placeholder')} borderRadius={15} + data-testid="display-name" /> ); diff --git a/src/modules/onboarding/OnboardingForm/OnboardingForm.tsx b/src/modules/onboarding/OnboardingForm/OnboardingForm.tsx index bc5f21b0..5b5bb929 100644 --- a/src/modules/onboarding/OnboardingForm/OnboardingForm.tsx +++ b/src/modules/onboarding/OnboardingForm/OnboardingForm.tsx @@ -68,6 +68,7 @@ export default function OnboardingForm({ _.isNil(getFieldState('displayName').error) && toggleIsDisplayNameFilled(); }} + data-testid="continue-btn" > {t('continue')} @@ -92,6 +93,7 @@ export default function OnboardingForm({ isDisabled={!isValid} isLoading={isOnboarding} type="submit" + data-testid="recaptcha-continue-btn" > {t('continue')}