Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Solution #172

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion cypress.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,8 @@ const { defineConfig } = require('cypress');

module.exports = defineConfig({
e2e: {
baseUrl: 'https://react-redux.realworld.io/#/register?_k=blrz2w',
setupNodeEvents(on, config) {
// implement node event listeners here
}
}
});
17 changes: 17 additions & 0 deletions cypress/e2e/signUp.cy.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,22 @@
import { generateUser } from '../support/generate';

describe('Sign Up page', () => {
it('should provide an ability to register new account', () => {
const { email, username, password } = generateUser();

cy.visit(Cypress.config().baseUrl);

cy.get('[placeholder=Username]')
.type(username);

cy.get('[placeholder=Email]')
.type(email);

cy.get('[placeholder=Password]')
.type(password);

cy.get('button[type=submit]').click();

cy.get('a.nav-link').contains(username).should('exist');

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Although checking for the existence of a username in the navigation bar is a good way to confirm successful registration, it might be more robust to check something more specific to the user's account, like a welcome message or user settings. This would make your test more resistant to changes in the UI.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's better to use more specific selectors than 'a.nav-link'. This will make your tests more resilient to changes in the HTML structure. Consider adding a data-test attribute to the element you want to select.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's good that you are checking if the username appears on the navigation bar after registration, but you should also add some assertions to check if the registration was successful. For example, you could check if a success message appears on the screen or if the user is redirected to the correct page. This will make your tests more robust and reliable.

});
Comment on lines 3 to 21

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's a good practice to add comments to your tests to explain what each part of the test is doing. This can make your tests easier to understand and maintain, especially for other people who might work on them in the future. Try to describe the purpose of each test, what actions it performs and what results it expects.

});
13 changes: 13 additions & 0 deletions cypress/support/generate.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
import { faker } from '@faker-js/faker';

function generateUser() {
const randomNumber = Math.random().toString().slice(2, 6);

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Consider adding a comment here explaining the purpose of the randomNumber and why it's used in the username. This will improve the readability of your code.

/* randomNumer is variable for generation more reliable value */
const username = faker.internet.userName() + '_' + randomNumber;
const email = `${username}@mail.com`;
const password = faker.internet.password();

return { email, password, username };
}

module.exports = { generateUser };