cypress_project by robsza1122 · Pull Request #347 · mate-academy/qa_cypress_e2e_project

robsza1122 · 2026-01-12T05:42:21Z

No description provided.

mateacademy-ai-mentor

Review Summary

You've done a great job building out the E2E test suite and implementing the Page Object Model. The structure is well-organized. However, I'm requesting a few changes to address some critical issues.

The most important issue is that the task required data-qa for test selectors, but data-cy was used project-wide. This needs to be corrected in all Vue components and tests. Additionally, please add a database reset command (e.g., cy.task('db:clear')) to a beforeEach hook in each test file to ensure tests run in a clean environment.

Finally, there are a few functional issues to resolve:

The follow/unfollow test logic in user.cy.js is incorrect; it should use two separate users.
The Settings.vue component has a fatal error due to a duplicate mounted hook.
Several router-links are broken because they are missing the : binding for the to prop.

Once these key items are addressed, your solution will be in great shape!

✨ Please rate this review in the Platform's notification center¹. I will be grateful for your feedback! ✨

Important

Fix the issues, commit the changes, and then re-request my review using the Re-request review button² in the Reviewers tab.

Tip

If you have any comments about this review, please leave a message in the Add a comment section below and mention me with the @mateacademy-ai-mentor tag³.
I will read your message during my next review of your pull request. Please do not reply directly to my comments, as that feature is not supported yet.

Caution

Do not close the pull request until the review is complete. Closing it early can lead to unexpected behavior and disrupt the review process.

mateacademy-ai-mentor · 2026-01-12T05:46:03Z

+const homePage = new HomePageObject();
+const settingsPage = new SettingsPageObject();

+describe('Settings page', () => {


This test suite is missing a beforeEach hook to handle common setup tasks.

DRY Principle: The setup logic for registering and logging in a user is repeated in every test. This common setup should be extracted into a beforeEach hook to avoid code duplication and improve maintainability.

Database Reset: A key requirement is to clear the database before each test to ensure test isolation. A call to cy.task('db:clear') should be included in the beforeEach hook.

mateacademy-ai-mentor · 2026-01-12T05:46:03Z

+    signInPage.clickSignInBtn();
+    signInPage.clickHeaderHomeBtn();
+    homePage.clickSettingsLink();
+    settingsPage.typeUserName('NewUser123!');


The new username is hardcoded. According to the task requirements, you should use faker or a custom utility to generate dynamic test data. This will make your tests more robust.

mateacademy-ai-mentor · 2026-01-12T05:46:03Z

+    signInPage.clickSignInBtn();
+    signInPage.clickHeaderHomeBtn();
+    homePage.clickSettingsLink();
+    settingsPage.typeBio('New Bio Text!!!');


The bio text is hardcoded. Please use faker to generate this data dynamically to comply with the task requirement of using fake data in tests.

mateacademy-ai-mentor · 2026-01-12T05:46:03Z

+    signInPage.clickSignInBtn();
+    signInPage.clickHeaderHomeBtn();
+    homePage.clickSettingsLink();
+    settingsPage.typeEmail('updateMail@example.com');


The new email address is hardcoded. It's best practice to generate this dynamically using faker to avoid potential conflicts and ensure the test is reliable.

mateacademy-ai-mentor · 2026-01-12T05:46:03Z

+    signInPage.clickSignInBtn();
+    signInPage.clickHeaderHomeBtn();
+    homePage.clickSettingsLink();
+    settingsPage.typePassword('UpdatePassword1');


The new password is hardcoded. Please generate a dynamic password for the update, as required by the task.

mateacademy-ai-mentor · 2026-01-12T05:46:03Z

+const articlePage = new ArticlePageObject();

+describe('Article', () => {
  beforeEach(() => {


A critical requirement is to 'Clear all data from the database before the test'. This step is missing from your beforeEach hook. To ensure each test runs independently and in a clean environment, please add a call to reset the database here. It looks like you have a cy.resetBase() custom command that can be used for this.

mateacademy-ai-mentor · 2026-01-12T05:46:03Z

+    articlePage.typeEdittedTitle('New Editted Title');
+    articlePage.typeEdittedDescription('New Editted Description');
+    articlePage.typeEdittedBody('New Editted Body!!!');


Using hardcoded values for test data is not ideal. The task requires using faker to generate data. Please use your generateArticle() utility to create dynamic content for the updated article, just as you do for the initial creation. This will make your test more robust.

mateacademy-ai-mentor · 2026-01-12T05:46:03Z

+    articlePage.clickDeleteArticleBtn();
+    homePage.clickHomeLink();
+    cy.scrollTo('bottom');
+    articlePage.assertionDeletedArticle(title, description);


This assertion for a deleted article is not reliable. If there are other articles on the page, should('not.have.text', title) will pass even if the deletion failed. A better way to check for non-existence is cy.contains(selector, text).should('not.exist').

Furthermore, since this check is performed on the home page, the assertion logic should be handled by the homePage object to maintain a clean Page Object Model structure. It seems homePage already has a better implementation for this.

mateacademy-ai-mentor · 2026-01-12T05:46:03Z

 .idea
 node_modules/
 src/public/js/app.js
+src/webpack.config.js


This webpack configuration file should not be ignored. It's a source file required to build the project, and other developers will need it to run the application and tests. Please remove this line.

mateacademy-ai-mentor · 2026-01-12T05:46:03Z

-    cy.task('generateUser').then((generateUser) => {
-      user = generateUser;
-    });
+  beforeEach(() => {


The task requires that you 'Clear all data from the database before the test.' This beforeEach hook is the perfect place to do that, but the step is missing. Please add a command here to reset the database to ensure that each test starts with a clean state and is not affected by previous tests.

mateacademy-ai-mentor · 2026-01-12T05:46:06Z

+const signUpPage = new SignUpPageObject();
+
+describe('Follow/unfollow button', () => {
+  beforeEach(() => {


The task requires clearing the database before each test to ensure test isolation. Please add a cy.task('db:clear') call within this beforeEach hook.

mateacademy-ai-mentor · 2026-01-12T05:46:06Z

+  it('should provide an ability to follow the another user', () => {
+    const { username, email, password } = generateUser();
+    const { title, description, body, tags } = generateArticle();
+
+    signUpPage.typeUserName(username);
+    signUpPage.typeEmail(email);
+    signUpPage.typePassword(password);
+    signUpPage.clickSignUpBtn();
+    signUpPage.clickSwalBtn();
+    articleInPage.clickArticleBtn();
+    articleInPage.typeTitle(title);
+    articleInPage.typeDescription(description);
+    articleInPage.typeBody(body);
+    articleInPage.typeTags(tags);
+    articleInPage.handleAddingArticle();
+    homeInPage.clickHomeLink();
+    homeInPage.clickYourFeedBtn();
+    homeInPage.clickFollowBtn();
+    homeInPage.assertFollowedUser();


This test has two main issues:

Logical Flaw: A user cannot follow themselves. To properly test this feature, you need to simulate two different users. One user should create an article, and then a second user should log in to find that article and follow the original author.

Code Duplication: The entire setup of creating a user and an article is repeated in the next test. This common logic should be extracted into the beforeEach hook to keep your tests DRY (Don't Repeat Yourself).

mateacademy-ai-mentor · 2026-01-12T05:46:06Z

+  it('should provide an ability to unfollow the another user', () => {
+    const { username, email, password } = generateUser();
+    const { title, description, body, tags } = generateArticle();

+    signUpPage.typeUserName(username);
+    signUpPage.typeEmail(email);
+    signUpPage.typePassword(password);
+    signUpPage.clickSignUpBtn();
+    signUpPage.clickSwalBtn();
+    articleInPage.clickArticleBtn();
+    articleInPage.typeTitle(title);
+    articleInPage.typeDescription(description);
+    articleInPage.typeBody(body);
+    articleInPage.typeTags(tags);
+    articleInPage.handleAddingArticle();
+    homeInPage.clickHomeLink();
+    homeInPage.clickYourFeedBtn();
+    homeInPage.clickFollowBtn();
+    homeInPage.clickFollowBtn();
+    homeInPage.assertUnfollowedUser();


This test case repeats the same flawed setup logic from the previous test. By moving the common user and article creation into a beforeEach hook and correcting the test logic to use two separate users, you will fix the duplication and logical issues in both tests.

mateacademy-ai-mentor · 2026-01-12T05:46:06Z

+const signInPage = new SignInPageObject();

+describe('Sign Up page', () => {
+  beforeEach(() => {


The task requires that you 'Clear all data from the database before the test'. This beforeEach hook is missing a call to cy.task('db:clear') to ensure that each test starts with a clean database state. Please add it here.

mateacademy-ai-mentor · 2026-01-12T05:46:06Z

+    homePage.assertHeaderContainUsername(username);
+  });

+  it(`should not accept email without dot, '@' and spaces`, () => {


This test case validates multiple scenarios (different invalid email formats) within a single it block. It is a best practice to create separate, focused test cases for each scenario. This improves readability, makes failures easier to diagnose, and reduces code repetition within the test.

mateacademy-ai-mentor · 2026-01-12T05:46:06Z

+    signUpPage.typeEmail('Cierra@examplecom');
+    signUpPage.typePassword(password);
+    signUpPage.clickSignUpBtn();
+    signInPage.assertSignInError();


You are using an assertion method from signInPage within a test for the sign-up page. This creates an unnecessary dependency between page objects. The logic for asserting an error on the sign-up page should be part of the SignUpPageObject to maintain a clear and logical structure.

mateacademy-ai-mentor · 2026-01-12T05:46:06Z

+Cypress.Commands.add('login',
+  // eslint-disable-next-line max-len
+  (email = 'user32@hotmail.com', username = 'user32', password = 'Userpass1') => {


This command is named 'login', but it actually registers a new user by sending a POST request to the /users endpoint, which can be confusing. Additionally, it uses hardcoded default values. Custom commands should be generic and receive all necessary data as arguments from the test, aligning with the requirement to use faker for test data.

mateacademy-ai-mentor · 2026-01-12T05:46:06Z

+Cypress.Commands.add('register',
+  (email = 'riot@qa.team', username = 'riot', password = '12345Qwert!') => {


This command uses hardcoded default values for registration. To comply with the requirement of using dynamically generated fake data, please remove these defaults and ensure that the user data is passed in from the test that calls this command.

mateacademy-ai-mentor · 2026-01-12T05:46:06Z

+
+class SettingsPageObject extends PageObject {
+  get usernameInSettings() {
+    return cy.getByDataCy('update-username');


The task description requires using data-qa attributes for all test selectors. This implementation uses data-cy. Please update the custom command and all selectors in your Page Objects and Vue components to use data-qa as specified in the requirements.

mateacademy-ai-mentor · 2026-01-12T05:46:06Z

+  }
+
+  get swalBtn() {
+    return cy.get('.swal-button');


Selecting elements by CSS class names like .swal-button makes tests fragile because these classes are often tied to styling and can change. It's a best practice to use test-specific attributes (like data-qa) for selectors. If you can modify the component that generates this button, please add a data-qa attribute to it.

mateacademy-ai-mentor · 2026-01-12T05:46:10Z

+  get editorArtTitle() {
+    return cy.getByDataCy('editor-art-title');
+  }
+
+  get editorArtDescription() {
+    return cy.getByDataCy('editor-art-description');
+  }
+
+  get editorArtBody() {
+    return cy.getByDataCy('editor-art-body');
+  }
+
+  get editorArtTags() {
+    return cy.getByDataCy('editor-art-tags');


These getters (editorArtTitle, editorArtDescription, etc.) are duplicates of the ones defined earlier in the file (e.g., titleInput, descriptionInput). To avoid redundancy and make the code cleaner and easier to maintain, you should define each element selector only once.

mateacademy-ai-mentor · 2026-01-12T05:46:10Z

+  assertionDeletedArticle(title, description) {
+    this.previewTitle
+      .should('not.have.text', title);
+    this.previewDescription
+      .should('not.have.text', description);
+  }


This method for asserting deletion is unreliable. should('not.have.text', ...) can pass if any other article preview is on the page, leading to a false positive. A better approach is to verify that the specific article preview element does not exist, for example, using cy.contains('[data-cy="preview-title"]', title).should('not.exist').

Additionally, since this assertion is run on the home page (after navigating back), this logic should be moved to the HomePageObject.

mateacademy-ai-mentor · 2026-01-12T05:46:10Z


-  get usernameLink() {
+  get homeLink() {
+    return cy.getByDataCy('home');


The task requirement was to use data-qa attributes for selectors. While data-cy is functional, it's important to adhere to the project's specific guidelines. Please update the custom command and the attributes in the Vue components from data-cy to data-qa.

mateacademy-ai-mentor · 2026-01-12T05:46:10Z

+      .should('not.exist');
+  }
+
+  checkProfileLinkForLogout() {


This method, checkProfileLinkForLogout, is an exact duplicate of assertLoggingOut. To adhere to the DRY (Don't Repeat Yourself) principle and avoid code redundancy, please remove this method and use assertLoggingOut in its place.

mateacademy-ai-mentor · 2026-01-12T05:46:10Z

+      .click();
+  };
+
+  clickInDeletionOfArticle() {


It's a best practice in the Page Object Model to define all selectors as getters at the top of the class. Here, you are calling cy.getByDataCy directly inside the method. To improve maintainability, you should create a getter for the 'delete-article-btn' and then reference it here (e.g., this.deleteArticleBtn.first().click();). The same applies to the clickInEditionOfArticle method.

mateacademy-ai-mentor · 2026-01-12T05:46:10Z

+      .click();
+  }
+
+  assertFollowedUser() {


Asserting against CSS classes like btn-primary can make tests fragile, as class names may change for purely stylistic reasons. A more robust approach is to check for something the user would see, like the button's text (e.g., 'Unfollow User'), or to use a dedicated data attribute that reflects the state. The same applies to the assertUnfollowedUser method.

mateacademy-ai-mentor · 2026-01-12T05:46:10Z

  <!-- Used when user is also author -->
  <span v-if="canModify">
-    <router-link class="btn btn-sm btn-outline-secondary" :to="editArticleLink">
+    <router-link class="btn btn-sm btn-outline-secondary" :to="editArticleLink" data-cy="edit-article">


The task requires using data-qa attributes for test selectors, but data-cy is used here. Please update this and all other data-cy attributes in the project to data-qa to meet the requirements.

mateacademy-ai-mentor · 2026-01-12T05:46:10Z

      class="btn btn-sm"
      @click="toggleFavorite"
      :class="toggleFavoriteButtonClasses"
+      data-cy="follow-user-btn"


The selector name follow-user-btn is misleading as this button handles the 'favorite' action (@click="toggleFavorite"), not following a user. Please rename this selector to something more descriptive, like favorite-article-btn, to avoid confusion.

mateacademy-ai-mentor · 2026-01-12T05:46:10Z

@@ -0,0 +1,52 @@
+import PageObject from '../PageObject';
+
+class SignUpPageObject extends PageObject {


This Page Object is missing a crucial method: one for asserting sign-up errors. Each Page Object should be self-contained. The corresponding test file currently calls an assertion method from SignInPageObject, which breaks encapsulation. Please add an assertSignUpError() method to this class to handle error validation for the sign-up page.

mateacademy-ai-mentor · 2026-01-12T05:46:10Z

+  url = '/#/register';
+
+  get usernameInput() {
+    return cy.getByDataCy('username-sign-up');


The task description requires using data-qa attributes for all test selectors. This implementation uses data-cy. Please ensure this is corrected throughout the project by renaming the custom command and updating the attributes in the Vue components.

mateacademy-ai-mentor · 2026-01-12T05:46:13Z

+  }
+
+  get swalBtn() {
+    return cy.get('.swal-button');


Using CSS class names for selectors is not a robust practice, as class names are prone to change for styling reasons. The task requires adding data-qa attributes to all elements used in tests. Please add a data-qa attribute to this sweet alert button in the application's source code and update the selector here accordingly.

mateacademy-ai-mentor · 2026-01-12T05:46:13Z

  }

+  get errorScreen() {
+    return cy.get('.swal-modal');


Using a CSS class like .swal-modal for selectors can make your tests fragile, as class names are often tied to styling and can change. The task requires adding data-qa attributes for all elements you interact with in tests. Please add a data-qa attribute to this modal and update the selector accordingly for better test stability.

mateacademy-ai-mentor · 2026-01-12T05:46:13Z

+  get headerHomeBtn() {
+    return cy.getByDataCy('home');


The header home button is a common element that appears on multiple pages, not just the sign-in page. According to the task requirements, common elements should be defined in the base PageObject.js file to avoid duplication and improve maintainability.

mateacademy-ai-mentor · 2026-01-12T05:46:13Z

+  clickHeaderHomeBtn() {
+    this.headerHomeBtn
+      .click();
+  }


Since the headerHomeBtn element should be moved to a base Page Object, this corresponding action method should also be moved there to keep related logic together.

mateacademy-ai-mentor · 2026-01-12T05:46:13Z

    <div class="banner">
      <div class="container">
-        <h1>{{ article.title }}</h1>
+        <h1 data-cy="article-title">{{ article.title }}</h1>


The task requires using data-qa for test selectors, but this element uses data-cy. Please update this attribute to data-qa="article-title" to align with the requirements.

mateacademy-ai-mentor · 2026-01-12T05:46:13Z

      <div class="row article-content">
        <div class="col-xs-12">
-          <div v-html="parseMarkdown(article.body)"></div>
+          <div v-html="parseMarkdown(article.body)" data-cy="article-body"></div>


This element uses data-cy for its test selector. Please change it to data-qa as specified in the task description.

mateacademy-ai-mentor · 2026-01-12T05:46:14Z

              <Tag
                :name="tag"
                className="tag-default tag-pill tag-outline"
+                data-cy="article-tag"


Please change this attribute from data-cy to data-qa to follow the project's testing requirements.

mateacademy-ai-mentor · 2026-01-12T05:46:14Z

            active-class="active"
            exact
            :to="{ name: 'home' }"
+            data-cy="header-home-btn"


The task explicitly requires using data-qa attributes for all test selectors. Please change data-cy to data-qa here and for all other selectors in this component to meet the requirement.

mateacademy-ai-mentor · 2026-01-12T05:46:14Z

  <div class="article-meta">
    <router-link
-      :to="{ name: 'profile', params: { username: authorUsername() } }"
+      to="{ name: 'profile', params: { username: authorUsername() } }"


This router-link's to prop is being treated as a static string because it's missing the : binding prefix. To make this a dynamic binding that correctly navigates to the author's profile, it should be written as :to="{ name: 'profile', params: { username: authorUsername() } }".

mateacademy-ai-mentor · 2026-01-12T05:46:14Z

      <router-link
        :to="{ name: 'profile', params: { username: authorUsername() } }"
        class="author"
+        data-cy="author-link"


The task explicitly requires using data-qa attributes for all test selectors. This should be changed from data-cy to data-qa="author-link" to meet the requirements.

mateacademy-ai-mentor · 2026-01-12T05:46:17Z

        'btn-primary': article && article.favorited,
        'btn-outline-primary': article && !article.favorited
      }"
+      data-cy="follow-user-btn"


This selector has two issues:

It should use data-qa instead of data-cy as per the task requirements.

The name follow-user-btn is misleading because this button's @click handler calls toggleFavorite. It should be renamed to something like favorite-article-btn to accurately reflect its function.

mateacademy-ai-mentor · 2026-01-12T05:46:17Z

+      <h1 v-text="article.title" data-cy="preview-title"/>
+      <p v-text="article.description" data-cy="preview-description" />


The task explicitly requires using data-qa attributes for all test selectors. Please rename these data-cy attributes to data-qa to comply with the project's requirements.

mateacademy-ai-mentor · 2026-01-12T05:46:17Z

+              setTimeout(() => {
+        const swalModal = document.querySelector('.swal-modal');
+        if (swalModal) {
+          swalModal.setAttribute('data-cy', 'login-loading-modal');
+        }
+
+
+        const swalText = document.querySelector('.swal-text');
+        if (swalText) {
+          swalText.setAttribute('data-cy', 'login-status-text');
+        }
+      }, 50);


This code dynamically adds test selectors to the sweet alert modals, which is a good approach for testability. However, the task requires using data-qa attributes, not data-cy. Please update these attributes to data-qa to meet the project's requirements.

mateacademy-ai-mentor · 2026-01-12T05:46:17Z

+      }).then(() => {
+         const errorModal = document.querySelector('.swal-modal');
+         if (errorModal) {
+           errorModal.setAttribute('data-cy', 'login-error-modal');
+         }


Similar to the loading modal, the test attribute for the error modal should be data-qa instead of data-cy to comply with the task requirements.

mateacademy-ai-mentor · 2026-01-12T05:46:17Z

                  :to="{ name: 'home-my-feed' }"
                  class="nav-link"
                  active-class="active"
+                  data-cy="your-feed-btn"


The task requires using data-qa attributes for test selectors, but data-cy has been used here. This needs to be corrected to data-qa="your-feed-btn" to align with the project requirements.

mateacademy-ai-mentor · 2026-01-12T05:46:17Z

+              <li 
+
+              class="nav-item"
+              data-cy="global-feed-btn"


This data-cy attribute on the <li> element is redundant because the same selector is already present on the router-link inside it. You should only have one test selector for a single interactive element.

mateacademy-ai-mentor · 2026-01-12T05:46:17Z

+              >
                <router-link
-                  :to="{ name: 'home' }"
+                  to="{ name: 'home' }"


The to prop for this router-link is being passed as a static string because it's missing the : binding prefix. This will cause the link to not work as expected. It should be :to="{ name: 'home' }" to be treated as a JavaScript object.

mateacademy-ai-mentor · 2026-01-12T05:46:17Z

              <li class="nav-item" v-if="tag">
                <router-link
-                  :to="{ name: 'home-tag', params: { tag } }"
+                  to="{ name: 'home-tag', params: { tag } }"


Similar to the previous link, this to prop is missing the : binding prefix, so it's being interpreted as a static string instead of a dynamic route object. It should be corrected to :to="{ name: 'home-tag', params: { tag } }".

mateacademy-ai-mentor · 2026-01-12T05:46:17Z

            <p>Popular Tags</p>
            <div class="tag-list">
-              <Tag v-for="(tag, index) in tags" :name="tag" :key="index">
+              <Tag v-for="(tag, index) in tags" name="tag" key="index">


There's a bug in how you are passing the name prop to the Tag component. name="tag" passes the literal string "tag" for every iteration of the loop. You need to bind it to the tag variable from the v-for loop like this: :name="tag".

mateacademy-ai-mentor

Review Summary

Great progress on this task! You've successfully implemented the Page Object Model and addressed several key issues from the last review. However, there are a few critical issues that need to be resolved before this can be approved.

Several parts of the site navigation are broken due to missing : bindings on router-links in src/vue/routes/Home.vue and src/vue/components/ArticleMeta.vue. The follow/unfollow test in cypress/e2e/user.cy.js is unreliable as it navigates to the wrong feed and targets the wrong element; the data-qa="follow-user-btn" attribute is incorrectly placed on the 'favorite article' button in ArticleMeta.vue. Additionally, the requirement to use data-qa for all selectors is not fully met, as the modals in src/vue/routes/Login.vue and src/vue/routes/Register.vue are missing these attributes.

Please address these points to ensure the application is fully functional and the tests are reliable.

✨ Please rate this review in the Platform's notification center¹. I will be grateful for your feedback! ✨

Important

Fix the issues, commit the changes, and then re-request my review using the Re-request review button² in the Reviewers tab.

Tip

If you have any comments about this review, please leave a message in the Add a comment section below and mention me with the @mateacademy-ai-mentor tag³.
I will read your message during my next review of your pull request. Please do not reply directly to my comments, as that feature is not supported yet.

Caution

Do not close the pull request until the review is complete. Closing it early can lead to unexpected behavior and disrupt the review process.

mateacademy-ai-mentor · 2026-01-12T18:03:00Z

+    signInPage.visit();
+    cy.register(email, username, password);
+    signInPage.typeEmail(email);
+    signInPage.typePassword(password);
+    signInPage.clickSignInBtn();
+    homePage.clickArticleBtn();


The cy.register() custom command already handles user creation and programmatic login by setting the session token. The subsequent UI actions to log in (visiting the sign-in page, typing credentials, and clicking the button) are redundant. For faster and more stable tests, it's best to rely on programmatic login for setup and navigate directly to the page under test afterward.

mateacademy-ai-mentor · 2026-01-12T18:03:00Z

+    signInPage.clickSignInBtn();
+    signInPage.clickHeaderHomeBtn();
+    homePage.clickSettingsLink();
+    settingsPage.typeUserName('NewUser123!');


It's a good practice to use faker or a similar library to generate test data instead of hardcoding values like 'NewUser123!'. This aligns with the task requirement and makes the test more robust by using unique data for each run.

mateacademy-ai-mentor · 2026-01-12T18:03:00Z

+    signInPage.clickSignInBtn();
+    signInPage.clickHeaderHomeBtn();
+    homePage.clickSettingsLink();
+    settingsPage.typeBio('New Bio Text!!!');


This hardcoded bio text should be dynamically generated using faker, for example with faker.lorem.sentence(). This ensures the test is not dependent on static data.

mateacademy-ai-mentor · 2026-01-12T18:03:00Z

+    signInPage.clickSignInBtn();
+    signInPage.clickHeaderHomeBtn();
+    homePage.clickSettingsLink();
+    settingsPage.typeEmail('updateMail@example.com');


This hardcoded email should be generated dynamically. You can define a new variable for the updated email at the start of the test and use it here and again when you log in with the new credentials.

mateacademy-ai-mentor · 2026-01-12T18:03:00Z

+    signInPage.clickSignInBtn();
+    signInPage.clickHeaderHomeBtn();
+    homePage.clickSettingsLink();
+    settingsPage.typePassword('UpdatePassword1');


Similar to other tests in this file, the new password should be generated dynamically using faker instead of being hardcoded. This improves test reliability.

mateacademy-ai-mentor · 2026-01-12T18:03:00Z

+  it(`should not accept email without dot, '@' and spaces`, () => {
+    const { username, password } = generateUser();
+    signUpPage.typeUserName(username);
+    signUpPage.typeEmail('Cierra@examplecom');
+    signUpPage.typePassword(password);
+    signUpPage.clickSignUpBtn();
+    signInPage.assertSignInError();
+    signUpPage.clickSwalBtn();
+    signUpPage.typeUserName(username);
+    signUpPage.typeEmail('Cierra@example      com');
+    signUpPage.typePassword(password);
+    signUpPage.clickSignUpBtn();
+    signInPage.assertSignInError();
+    signUpPage.clickSwalBtn();
+    signUpPage.typeUserName(username);
+    signUpPage.typeEmail('Cierraexample.com');
+    signUpPage.typePassword(password);
+    signUpPage.clickSignUpBtn();
+    signInPage.assertSignInError();
  });


This test block attempts to check multiple invalid scenarios sequentially. However, the type... methods in your page objects append text without clearing the input fields first. After the first failed submission, the form fields are not cleared, causing subsequent type... calls to append to the existing text. This results in unintended values like usernameusername being submitted.

To fix this, consider either clearing the fields before each attempt within this test or, for better test atomicity, splitting this into separate it blocks for each validation case.

mateacademy-ai-mentor · 2026-01-12T18:03:00Z

+  beforeEach(() => {
+    signUpPage.visit();
+    const { username, email, password } = generateUser();
+    const { title, description, body, tags } = generateArticle();
+
+    signUpPage.typeUserName(username);
+    signUpPage.typeEmail(email);
+    signUpPage.typePassword(password);
+    signUpPage.clickSignUpBtn();
+    signUpPage.clickSwalBtn();
+    articleInPage.clickArticleBtn();
+    articleInPage.typeTitle(title);
+    articleInPage.typeDescription(description);
+    articleInPage.typeBody(body);
+    articleInPage.typeTags(tags);
+    articleInPage.handleAddingArticle();
  });


This beforeEach block is missing cy.task('db:clear'), which is required to ensure tests are isolated from each other. Additionally, the setup logic of creating a user and an article via the UI is inefficient and can make tests flaky. It's better to use programmatic commands (like cy.register() and an API call to create an article) for test setup.

mateacademy-ai-mentor · 2026-01-12T18:03:00Z

+    signUpPage.clickSignUpBtn();
+    signUpPage.clickSwalBtn();
+    homeInPage.clickHomeLink();
+    homeInPage.clickYourFeedBtn();


Navigating to 'Your Feed' is incorrect here. 'Your Feed' only shows articles from users that the current user is following. Since this is a newly created user, their feed will be empty. The test should instead navigate to the 'Global Feed' to find the article posted by the first user.

mateacademy-ai-mentor · 2026-01-12T18:03:00Z

+    signUpPage.clickSignUpBtn();
+    signUpPage.clickSwalBtn();
+    homeInPage.clickHomeLink();
+    homeInPage.clickYourFeedBtn();


Similar to the 'follow' test, this navigation step is incorrect. The test should go to the 'Global Feed' to find the other user's article before attempting to follow and then unfollow them.

mateacademy-ai-mentor · 2026-01-12T18:03:00Z

+Cypress.Commands.add(
+  'login',
+  // eslint-disable-next-line max-len
+  (
+    email = 'user32@hotmail.com',
+    username = 'user32',
+    password = 'Userpass1'
+  ) => {
+    cy.request('POST', '/users', {
+      user: {
+        email,
+        username,
+        password
+      }
+    }).then((response) => {
+      const user = {
+        bio: response.body.user.bio,
+        effectiveImage:
+          'https://static.productionready.io/images/smiley-cyrus.jpg',
+        email: response.body.user.email,
+        image: response.body.user.image,
+        token: response.body.user.token,
+        username: response.body.user.username
+      };
+      window.localStorage.setItem('user', JSON.stringify(user));
+      cy.setCookie('auth', response.body.user.token);
+    });
+  }
+);


This login command appears to be incorrect. It's sending a request to the user registration endpoint (/users) rather than a login endpoint. Since it's also not used in any of the provided tests, it would be best to remove it to avoid confusion and potential misuse.

mateacademy-ai-mentor · 2026-01-12T18:03:04Z

+
 Cypress.Commands.add('getByDataCy', (selector) => {
-  cy.get(`[data-cy="${selector}"]`);
+  cy.get(`[data-qa="${selector}"]`);


The name of this command, getByDataCy, is now misleading since it selects elements using the data-qa attribute. To maintain consistency and clarity across the project, please rename this command to getByDataQa. You'll also need to update its usage in all Page Object files and its type definition in cypress/support/index.d.ts.

mateacademy-ai-mentor · 2026-01-12T18:03:04Z

+    cy.request('POST', '/users', {
+      email,
+      username,
+      password


The payload for this registration request may be incorrect. Typically, APIs like this expect the user data to be nested within a user object, like so: { user: { email, username, password } }. While the current implementation might work, it's worth double-checking the expected API contract to ensure robustness and consistency.

mateacademy-ai-mentor · 2026-01-12T18:03:04Z

+  url = '/editor';
+
+  get titleInput() {
+    return cy.getByDataCy('editor-art-title');


While this works, the custom command is named getByDataCy but it's actually selecting by data-qa. This can be confusing. It's better to rename the command to getByDataQa in commands.js and update its usage here for clarity and consistency.

mateacademy-ai-mentor · 2026-01-12T18:03:04Z

+  get editorArtTitle() {
+    return cy.getByDataCy('editor-art-title');
+  }
+
+  get editorArtDescription() {
+    return cy.getByDataCy('editor-art-description');
+  }
+
+  get editorArtBody() {
+    return cy.getByDataCy('editor-art-body');
+  }
+
+  get editorArtTags() {
+    return cy.getByDataCy('editor-art-tags');
+  }


These getters (editorArtTitle, editorArtDescription, editorArtBody, editorArtTags) are duplicates of the getters defined above (titleInput, descriptionInput, bodyInput, tagInput). They all select the same elements. To reduce redundancy and improve maintainability, you should remove these duplicate getters and update the typeEditted... methods to use the original ones (e.g., this.titleInput.clear().type(title)).

mateacademy-ai-mentor · 2026-01-12T18:03:04Z


-  get usernameLink() {
+  get homeLink() {
+    return cy.getByDataCy('home');


As highlighted in the review for commands.js, the custom command getByDataCy should be renamed to getByDataQa to accurately reflect its function. Please update this and all other occurrences throughout the file for consistency and clarity.

mateacademy-ai-mentor · 2026-01-12T18:03:04Z

+  clickInDeletionOfArticle() {
+    cy.getByDataCy('delete-article-btn').first().click();
+  }
+
+  clickInEditionOfArticle() {
+    cy.getByDataCy('edit-article-btn').first().click();
+  }


These two methods, clickInDeletionOfArticle and clickInEditionOfArticle, are not used in any of the tests and appear to target elements that belong on the article page, not the home page. To keep the page object focused and clean, these unused methods should be removed.

mateacademy-ai-mentor · 2026-01-12T18:03:04Z

@@ -4,5 +4,6 @@ declare namespace Cypress {
  interface Chainable<Subject> {
    getByDataCy(selector: string): Chainable<any>


In line with the project-wide change from data-cy to data-qa, this type definition should be renamed from getByDataCy to getByDataQa. This will ensure the type definition accurately reflects the custom command's implementation in commands.js.

mateacademy-ai-mentor · 2026-01-12T18:03:04Z

+
+class SettingsPageObject extends PageObject {
+  get usernameInSettings() {
+    return cy.getByDataCy('update-username');


As mentioned in the review for commands.js, this custom command should be renamed from getByDataCy to getByDataQa to accurately reflect that it's selecting elements using the data-qa attribute. This change should be applied project-wide for consistency.

mateacademy-ai-mentor · 2026-01-12T18:03:04Z

+  get errorScreen() {
+    return cy.get('.swal-modal');
+  }


The task requires using data-qa attributes for all elements in tests. This selector uses a CSS class (.swal-modal), which is less stable. In the src/vue/routes/Login.vue file, there's already logic to dynamically add a data-cy attribute to this modal. Please update that logic to add a data-qa attribute instead, and then use that attribute here for selection.

mateacademy-ai-mentor · 2026-01-12T18:03:04Z

+  get headerHomeBtn() {
+    return cy.getByDataCy('home');
+  }


The headerHomeBtn and its corresponding click method are for a common header element. According to the task requirements, elements common to the whole app should be in a shared location, like a base PageObject or a dedicated HeaderPageObject. While this works, consider refactoring to avoid duplicating header elements in multiple page objects.

mateacademy-ai-mentor · 2026-01-12T18:03:07Z

+  url = '/#/register';
+
+  get usernameInput() {
+    return cy.getByDataCy('username-sign-up');


As noted in the reviews for commands.js and other page objects, the custom command getByDataCy should be renamed to getByDataQa to accurately reflect its function of selecting elements by the data-qa attribute. This change should be applied consistently across all files.

mateacademy-ai-mentor · 2026-01-12T18:03:07Z

  <div class="article-meta">
    <router-link
-      :to="{ name: 'profile', params: { username: authorUsername() } }"
+      to="{ name: 'profile', params: { username: authorUsername() } }"


This router-link is missing the : before the to prop. Without the binding, the to value is treated as a static string instead of a dynamic route object, which will break navigation. This was a specific issue that needed to be fixed from the previous review.

mateacademy-ai-mentor · 2026-01-12T18:03:07Z

-        'btn-outline-primary': article && !article.favorited
+        'btn-outline-primary': article && !article.favorited,
      }"
+      data-qa="follow-user-btn"


The data-qa attribute here is named follow-user-btn, but the button's action is to favorite an article (@click="toggleFavorite"). This is misleading and causes the follow/unfollow tests to interact with the wrong element. The attribute should be renamed to accurately reflect its purpose, for example, favourite-article-btn.

mateacademy-ai-mentor · 2026-01-12T18:03:07Z

+              <li class="nav-item" data-qa="global-feed-btn">
                <router-link
-                  :to="{ name: 'home' }"
+                  to="{ name: 'home' }"


This router-link is missing the : before the to prop. Without the dynamic binding, the link will not function correctly, as the to value is treated as a static string instead of a route object. This was a critical fix requested in the previous review.

mateacademy-ai-mentor · 2026-01-12T18:03:08Z

              <li class="nav-item" v-if="tag">
                <router-link
-                  :to="{ name: 'home-tag', params: { tag } }"
+                  to="{ name: 'home-tag', params: { tag } }"


Similar to the 'Global Feed' link, this router-link is missing the : binding for the to prop. This will prevent the tag-based navigation from working as intended.

mateacademy-ai-mentor · 2026-01-12T18:03:08Z

          <h1 class="text-xs-center">Sign up</h1>
          <p class="text-xs-center">
-            <router-link :to="{ name: 'login' }">
+            <router-link to="login">


This router-link should use a dynamic :to binding to ensure it resolves to the correct route object. It should be :to="{ name: 'login' }" instead of to="login" for consistency and best practice with named routes.

mateacademy-ai-mentor

Review Summary

I am approving your solution so you can continue to make progress, but please review the following feedback carefully for your next submission.

You've done an excellent job building out the test suite and using the Page Object Model to structure your tests. However, there are a few critical issues to address. The most important is that several navigation links in the application are broken because they are missing the : binding on the to prop (e.g., in src/vue/routes/Home.vue). Additionally, the follow/unfollow test is failing because the data-qa="follow-user-btn" attribute is incorrectly placed on the 'favorite article' button instead of the actual follow button. Please also ensure all test data, including updates, is generated dynamically with faker instead of being hardcoded.

Keep up the great work! Addressing these key points will significantly improve the reliability of both the application and your tests.

✨ Please rate this review in the Platform's notification center¹. I will be grateful for your feedback! ✨

Rate AI review example ↩

mateacademy-ai-mentor · 2026-01-12T18:29:08Z

+    signInPage.visit();
+    cy.register(email, username, password);
+    signInPage.typeEmail(email);
+    signInPage.typePassword(password);
+    signInPage.clickSignInBtn();


The cy.register() custom command already logs the user in by setting the authentication token. The subsequent UI login steps (visiting the sign-in page, typing credentials, and clicking the button) are redundant. You can navigate directly to the settings page after cy.register().

mateacademy-ai-mentor · 2026-01-12T18:29:08Z

+    settingsPage.typeUserName('NewUser123!');
+    settingsPage.clickUpdateSettingsBtn();
+    homePage.assertHeaderContainUsername('NewUser123!');


Instead of hardcoding the new username, you should generate it using faker or another user from generateUser(). Store it in a variable and use that variable for both typing the new username and for the assertion. This makes the test more dynamic and less prone to errors.

mateacademy-ai-mentor · 2026-01-12T18:29:08Z

+    settingsPage.typeBio('New Bio Text!!!');
+    settingsPage.clickUpdateSettingsBtn();
+    homePage.clickSettingsLink();
+    settingsPage.clickSwalBtn();
+    settingsPage.assertUpdatedBio('New Bio Text!!!');


Hardcoded values should be avoided. Please use faker to generate a bio text. Store it in a variable to use it for both typing and assertion.

mateacademy-ai-mentor · 2026-01-12T18:29:08Z

+    settingsPage.typeEmail('updateMail@example.com');
+    settingsPage.clickUpdateSettingsBtn();
+    homePage.clickSettingsLink();
+    settingsPage.clickSwalBtn();
+    settingsPage.clickLogoutBtn();
+    homePage.clickSignInNav();
+    signInPage.typeEmail('updateMail@example.com');


This test uses a hardcoded email address. It's better to generate a new email using faker, store it in a variable, and use that variable here and in the login step.

mateacademy-ai-mentor · 2026-01-12T18:29:08Z

+    settingsPage.typePassword('UpdatePassword1');
+    settingsPage.clickUpdateSettingsBtn();
+    settingsPage.clickSwalBtn();
+    settingsPage.clickLogoutBtn();
+    homePage.clickSignInNav();
+    signInPage.typeEmail(email);
+    signInPage.typePassword('UpdatePassword1');


The new password is hardcoded. Please generate a new password, perhaps using faker or just a different string stored in a variable, and use it for both updating and logging in.

mateacademy-ai-mentor · 2026-01-12T18:29:08Z

+    signInPage.visit();
+    cy.register(email, username, password);
+    signInPage.typeEmail(email);
+    signInPage.typePassword(password);
+    signInPage.clickSignInBtn();


The cy.register() custom command already handles user registration and logs the user in by setting the authentication token. The subsequent UI login steps (typing email/password and clicking sign-in) are redundant and make the test setup slower. You can remove lines 18-22 and navigate directly to the 'new article' page after cy.register completes.

mateacademy-ai-mentor · 2026-01-12T18:29:08Z

+    articlePage.typeEdittedTitle('New Editted Title');
+    articlePage.typeEdittedDescription('New Editted Description');
+    articlePage.typeEdittedBody('New Editted Body!!!');


The task requires using faker to generate test data. Here, you are using hardcoded strings for the edited article's title, description, and body. You should use generateArticle() again to create new, dynamic data for the update.

mateacademy-ai-mentor · 2026-01-12T18:29:08Z

+Cypress.Commands.add(
+  'login',
+  // eslint-disable-next-line max-len
+  (
+    email = 'user32@hotmail.com',
+    username = 'user32',
+    password = 'Userpass1'
+  ) => {
+    cy.request('POST', '/users', {
+      user: {
+        email,
+        username,
+        password
+      }
+    }).then((response) => {
+      const user = {
+        bio: response.body.user.bio,
+        effectiveImage:
+          'https://static.productionready.io/images/smiley-cyrus.jpg',
+        email: response.body.user.email,
+        image: response.body.user.image,
+        token: response.body.user.token,
+        username: response.body.user.username
+      };
+      window.localStorage.setItem('user', JSON.stringify(user));
+      cy.setCookie('auth', response.body.user.token);
+    });
+  }
+);


This login command appears to be unused across the test suite, as all tests use cy.register() instead. Furthermore, its name is misleading because it's calling the user registration endpoint (POST /users), not a login endpoint. It's best to remove this unused command to avoid confusion.

mateacademy-ai-mentor · 2026-01-12T18:29:08Z

+    cy.request('POST', '/users', {
+      email,
+      username,
+      password


The payload for this API request is incorrect. The backend API expects the user data to be nested inside a user object. The correct structure should be { user: { email, username, password } }. Without this change, the registration will fail.

mateacademy-ai-mentor · 2026-01-12T18:29:09Z

+Cypress.Commands.add('resetBase', () => {
+  return cy.request('POST', 'http://localhost:1667/api/testing/reset');
 });


This resetBase command is not being used in any of the test files. The tests consistently use cy.task('db:clear') for resetting the database state. To keep the codebase clean, you should remove this unused command.

mateacademy-ai-mentor · 2026-01-12T18:29:12Z

+describe('Follow/unfollow button', () => {
+  beforeEach(() => {
+    cy.task('db:clear');
+    signUpPage.visit();
+    const { username, email, password } = generateUser();
+    const { title, description, body, tags } = generateArticle();
+
+    signUpPage.typeUserName(username);
+    signUpPage.typeEmail(email);
+    signUpPage.typePassword(password);
+    signUpPage.clickSignUpBtn();
+    signUpPage.clickSwalBtn();
+    articleInPage.clickArticleBtn();
+    articleInPage.typeTitle(title);
+    articleInPage.typeDescription(description);
+    articleInPage.typeBody(body);
+    articleInPage.typeTags(tags);
+    articleInPage.handleAddingArticle();
  });

-  it.skip('should be able to follow the another user', () => {
+  it('should provide an ability to follow the another user', () => {
+    signUpPage.visit();
+    const { username, email, password } = generateUser();
+    signUpPage.typeUserName(username);
+    signUpPage.typeEmail(email);
+    signUpPage.typePassword(password);
+    signUpPage.clickSignUpBtn();
+    signUpPage.clickSwalBtn();
+    homeInPage.clickHomeLink();
+    homeInPage.clickGlobalFeedBtn();
+    homeInPage.clickFollowBtn();
+    homeInPage.assertFollowedUser();
+  });

+  it('should provide an ability to unfollow the another user', () => {
+    signUpPage.visit();
+    const { username, email, password } = generateUser();
+    signUpPage.typeUserName(username);
+    signUpPage.typeEmail(email);
+    signUpPage.typePassword(password);
+    signUpPage.clickSignUpBtn();
+    signUpPage.clickSwalBtn();
+    homeInPage.clickHomeLink();
+    homeInPage.clickGlobalFeedBtn();
+    homeInPage.clickFollowBtn();
+    homeInPage.clickFollowBtn();
+    homeInPage.assertUnfollowedUser();
  });


This test suite has a critical flaw: it doesn't test the follow/unfollow functionality. It clicks the 'Favorite Article' button instead. This is because the data-qa="follow-user-btn" selector is incorrectly placed on the favorite button in the ArticleMeta.vue component, an issue that was highlighted in the previous review.

To fix this, you should:

Correct the data-qa attribute placement in the Vue components. The follow button is available on the user's profile page (Profile.vue).

Update the test flow to navigate to the author's profile page from the global feed and then click the correct follow button.

Additionally, the test setup is inefficient. Creating users and articles via the UI is slow and brittle. A better approach is to use cy.register() and cy.request() to set up the necessary data (author, article, follower) via API calls in a beforeEach hook. This makes the tests much faster and more reliable.

mateacademy-ai-mentor · 2026-01-12T18:29:12Z

+    signUpPage.typeUserName(username);
+    signUpPage.typeEmail('Cierra@examplecom');
+    signUpPage.typePassword(password);
+    signUpPage.clickSignUpBtn();
+    signInPage.assertSignInError();
+    signUpPage.clickSwalBtn();
+    signUpPage.typeUserName(username);
+    signUpPage.typeEmail('Cierra@example      com');
+    signUpPage.typePassword(password);
+    signUpPage.clickSignUpBtn();
+    signInPage.assertSignInError();
+    signUpPage.clickSwalBtn();
+    signUpPage.typeUserName(username);
+    signUpPage.typeEmail('Cierraexample.com');
+    signUpPage.typePassword(password);
+    signUpPage.clickSignUpBtn();
+    signInPage.assertSignInError();


This test case contains a lot of repeated code for checking different invalid email formats. The sequence of typing user info, clicking sign-up, asserting an error, and closing the modal is duplicated three times. A better approach would be to store the invalid emails in an array and loop through them, performing the check for each one. This would make your test more concise and easier to extend.

mateacademy-ai-mentor · 2026-01-12T18:29:12Z

+  }
+
+  get swalBtn() {
+    return cy.get('.swal-button');


The task requirements and previous review feedback explicitly state that all selectors must use data-qa attributes for stability. This getter uses a class selector (.swal-button), which is brittle and violates the requirement. You will need to add a data-qa attribute to the sweetalert modal/button in the application code and update this selector to use it.

mateacademy-ai-mentor · 2026-01-12T18:29:12Z

+  get followBtn() {
+    return cy.getByDataQa('follow-user-btn').first();
+  }
+
+  get feedBtn() {
+    return cy.getByDataQa('global-feed-btn');
+  }
+
+  get newTitleInBanner() {
+    return cy.getByDataQa('banner-title');
+  }
+
+  get bodyUnderBanner() {
+    return cy.getByDataQa('article-page-body');
+  }
+
+  get previewTitle() {
+    return cy.getByDataQa('preview-title');
+  }
+
+  get previewDescription() {
+    return cy.getByDataQa('preview-description');
+  }
+
+  get author() {
+    return cy.getByDataQa('author-link');
+  }
+
+  get globalFeedBtn() {
+    return cy.getByDataQa('your-feed-btn');
  }

  assertHeaderContainUsername(username) {
-    this.usernameLink
-      .should('contain', username);
+    this.profileLink.should('contain', username);
+  }
+
+  assertLoggingOut() {
+    this.profileLink.should('not.exist');
+  }
+
+  clickHomeLink() {
+    this.homeLink.click();
+  }
+
+  clickSettingsLink() {
+    this.settingsLink.click();
+  }
+
+  clickSignInNav() {
+    this.signInNavigation.click();
+  }
+
+  clickArticleBtn() {
+    this.articleLink.click();
+  }
+
+  clickGlobalFeedBtn() {
+    this.feedBtn.click();
+  }
+
+  clickProfileLink() {
+    this.profileLink.click();
+  }
+
+  clickFollowBtn() {
+    this.followBtn.click();
+  }
+
+  clickAuthor() {
+    this.author.click();
+  }
+
+  clickInDeletionOfArticle() {
+    cy.getByDataQa('delete-article-btn').first().click();
+  }
+
+  clickInEditionOfArticle() {
+    cy.getByDataQa('edit-article-btn').first().click();
+  }
+
+  assertFollowedUser() {
+    this.followBtn.should('have.class', 'btn btn-sm pull-xs-right btn-primary');
+  }
+
+  assertUnfollowedUser() {
+    this.followBtn.should(
+      'have.class',
+      'btn btn-sm pull-xs-right btn-outline-primary'
+    );


This getter, along with the assertFollowedUser and assertUnfollowedUser methods, is incorrectly implemented. The data-qa="follow-user-btn" selector currently points to the 'favorite article' button in the article feed (ArticleMeta.vue), not the user follow button. The assertions also check the classes of the favorite button. This was a key issue from the previous review. The actual follow button is on the user's profile page (Profile.vue). This implementation must be corrected to target the right element on the correct page.

mateacademy-ai-mentor · 2026-01-12T18:29:12Z

+  get newTitleInBanner() {
+    return cy.getByDataQa('banner-title');
+  }
+
+  get bodyUnderBanner() {
+    return cy.getByDataQa('article-page-body');
+  }
+
+  get previewTitle() {
+    return cy.getByDataQa('preview-title');
+  }
+
+  get previewDescription() {
+    return cy.getByDataQa('preview-description');
+  }
+
+  get author() {
+    return cy.getByDataQa('author-link');
+  }
+
+  get globalFeedBtn() {
+    return cy.getByDataQa('your-feed-btn');
  }

  assertHeaderContainUsername(username) {
-    this.usernameLink
-      .should('contain', username);
+    this.profileLink.should('contain', username);
+  }
+
+  assertLoggingOut() {
+    this.profileLink.should('not.exist');
+  }
+
+  clickHomeLink() {
+    this.homeLink.click();
+  }
+
+  clickSettingsLink() {
+    this.settingsLink.click();
+  }
+
+  clickSignInNav() {
+    this.signInNavigation.click();
+  }
+
+  clickArticleBtn() {
+    this.articleLink.click();
+  }
+
+  clickGlobalFeedBtn() {
+    this.feedBtn.click();
+  }
+
+  clickProfileLink() {
+    this.profileLink.click();
+  }
+
+  clickFollowBtn() {
+    this.followBtn.click();
+  }
+
+  clickAuthor() {
+    this.author.click();
+  }
+
+  clickInDeletionOfArticle() {
+    cy.getByDataQa('delete-article-btn').first().click();
+  }
+
+  clickInEditionOfArticle() {
+    cy.getByDataQa('edit-article-btn').first().click();
+  }
+
+  assertFollowedUser() {
+    this.followBtn.should('have.class', 'btn btn-sm pull-xs-right btn-primary');
+  }
+
+  assertUnfollowedUser() {
+    this.followBtn.should(
+      'have.class',
+      'btn btn-sm pull-xs-right btn-outline-primary'
+    );
+  }
+
+  assertNewArticle(title, description) {
+    this.newTitleInBanner.should('contain.text', title);
+    this.bodyUnderBanner.should('contain.text', description);
+  }
+
+  assertTitleInBanner(title) {
+    this.newTitleInBanner.should('contain.text', title);
+  }
+
+  assertBodyUnderBanner(body) {
+    this.bodyUnderBanner.should('contain.text', body);
+  }


These elements and the assertion methods that use them (assertNewArticle, assertTitleInBanner, assertBodyUnderBanner) belong to the article detail page, not the home page. They should be moved to Article.pageObject.js. Additionally, the selectors banner-title and article-page-body do not appear to be present in the application code provided.

mateacademy-ai-mentor · 2026-01-12T18:29:12Z

+  get globalFeedBtn() {
+    return cy.getByDataQa('your-feed-btn');
  }


This getter is named globalFeedBtn but it selects your-feed-btn. This is misleading and there is already another getter, feedBtn, that correctly selects global-feed-btn. This confusing duplicate should be removed to improve clarity.

mateacademy-ai-mentor · 2026-01-12T18:29:12Z

+  clickInDeletionOfArticle() {
+    cy.getByDataQa('delete-article-btn').first().click();
+  }
+
+  clickInEditionOfArticle() {
+    cy.getByDataQa('edit-article-btn').first().click();
+  }


These methods for editing and deleting an article belong on the article details page, so they should be moved to Article.pageObject.js. Furthermore, the selectors they use (delete-article-btn, edit-article-btn) are incorrect as the -btn suffix is not in the application code. Correct implementations already exist in Article.pageObject.js, so these duplicates should be removed.

mateacademy-ai-mentor · 2026-01-12T18:29:12Z

-    register(email: string, username: string, password: string): Chainable<any>
+    getByDataQa(selector: string): Chainable<any>;
+    register(email: string, username: string, password: string): Chainable<any>;
+    resetBase(): Chainable<any>;


The resetBase command is not used in any of the test files; instead, cy.task('db:clear') is used for resetting the database. Since the command itself should be removed from commands.js for code cleanliness, this type declaration should also be removed.

mateacademy-ai-mentor · 2026-01-12T18:29:12Z

+  get editorArtTitle() {
+    return cy.getByDataQa('editor-art-title');
+  }
+
+  get editorArtDescription() {
+    return cy.getByDataQa('editor-art-description');
+  }
+
+  get editorArtBody() {
+    return cy.getByDataQa('editor-art-body');
+  }
+
+  get editorArtTags() {
+    return cy.getByDataQa('editor-art-tags');


These getters (editorArtTitle, editorArtDescription, editorArtBody, editorArtTags) are duplicates of titleInput, descriptionInput, bodyInput, and tagInput defined earlier in this class. To improve code maintainability and reduce redundancy, you should remove these duplicates and update the typeEditted... methods to use the original getters.

mateacademy-ai-mentor · 2026-01-12T18:29:12Z

+  }
+
+  get swalBtn() {
+    return cy.get('.swal-button');


The task requirements and previous review feedback explicitly state that all selectors must use data-qa attributes for stability. This getter uses a class selector (.swal-button), which is brittle and violates the requirement. You will need to add a data-qa attribute to the sweetalert modal/button in the application code and update this selector to use it.

mateacademy-ai-mentor · 2026-01-12T18:29:16Z

+  }
+
+  get errorScreen() {
+    return cy.get('.swal-modal');


The task requirements and previous review feedback state that all selectors must use data-qa attributes. This selector uses a class name, which is not ideal for test stability. Please add a data-qa attribute to the error modal in src/vue/routes/Login.vue and update this getter to use cy.getByDataQa().

mateacademy-ai-mentor · 2026-01-12T18:29:16Z

  <div class="article-meta">
    <router-link
-      :to="{ name: 'profile', params: { username: authorUsername() } }"
+      to="{ name: 'profile', params: { username: authorUsername() } }"


This router-link is missing the required : binding for the to prop. Without it, the to attribute is treated as a static string instead of a route object, which will break the navigation to the author's profile page.

mateacademy-ai-mentor · 2026-01-12T18:29:16Z

-        'btn-outline-primary': article && !article.favorited
+        'btn-outline-primary': article && !article.favorited,
      }"
+      data-qa="follow-user-btn"


This data-qa attribute is incorrect. This button is for favoriting an article (it has a heart icon and calls toggleFavorite), but the data-qa attribute is follow-user-btn. This was a high-priority issue in the last review and is the reason the follow/unfollow tests are failing or testing the wrong functionality. The follow-user-btn selector should be on the actual follow/unfollow button, which is located on the user's profile page (Profile.vue).

mateacademy-ai-mentor · 2026-01-12T18:29:16Z

+              <li class="nav-item" data-qa="global-feed-btn">
                <router-link
-                  :to="{ name: 'home' }"
+                  to="{ name: 'home' }"


This router-link is missing the required : before the to prop. Without the binding, the to attribute is treated as a literal string "{ name: 'home' }" instead of a route object, which will break navigation. This was a high-priority issue from the previous review that still needs to be addressed.

mateacademy-ai-mentor · 2026-01-12T18:29:16Z

              <li class="nav-item" v-if="tag">
                <router-link
-                  :to="{ name: 'home-tag', params: { tag } }"
+                  to="{ name: 'home-tag', params: { tag } }"


Similar to the global feed link, this router-link is also missing the : binding for its to prop. It should be :to to correctly bind to the route object.

mateacademy-ai-mentor · 2026-01-12T18:29:16Z

          <h1 class="text-xs-center">Sign up</h1>
          <p class="text-xs-center">
-            <router-link :to="{ name: 'login' }">
+            <router-link to="login">


This router-link should use a bound :to attribute for consistency with the rest of the application. While to="login" may work, using :to="{ name: 'login' }" is the standard practice for named routes and is more robust.

cypress_project

cbb11ea

mateacademy-ai-mentor suggested changes Jan 12, 2026

View reviewed changes

mateacademy-ai-mentor reviewed Jan 12, 2026

View reviewed changes

fixing tests for user and other mistakes

ca64402

robsza1122 requested a review from mateacademy-ai-mentor January 12, 2026 17:59

mateacademy-ai-mentor suggested changes Jan 12, 2026

View reviewed changes

mateacademy-ai-mentor reviewed Jan 12, 2026

View reviewed changes

changing dataqa and global button

8661638

robsza1122 requested a review from mateacademy-ai-mentor January 12, 2026 18:24

mateacademy-ai-mentor approved these changes Jan 12, 2026

View reviewed changes

mateacademy-ai-mentor reviewed Jan 12, 2026

View reviewed changes

		Cypress.Commands.add('register',
		(email = 'riot@qa.team', username = 'riot', password = '12345Qwert!') => {

		@@ -0,0 +1,52 @@
		import PageObject from '../PageObject';

		class SignUpPageObject extends PageObject {

		<h1 v-text="article.title" data-cy="preview-title"/>
		<p v-text="article.description" data-cy="preview-description" />

		@@ -4,5 +4,6 @@ declare namespace Cypress {
		interface Chainable<Subject> {
		getByDataCy(selector: string): Chainable<any>

Uh oh!

Conversation

robsza1122 commented Jan 12, 2026

Uh oh!

mateacademy-ai-mentor left a comment

Choose a reason for hiding this comment

Review Summary

Footnotes

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment