Search code examples
javascriptcypresse2e-testingweb-api-testing

Cypress: Checking if the columns have the correct data


I have created test case that gets all informations from table, in this table there is Users; Name, Role, Status, Last active statuses are listed, I select each line according to the user's id, I get the id information from the API before, I cannot assert them through the API because there are only "id","email" and " name" information, other information is not available. How can I test that columns Role,Status, Last active status has the correct data? Thanks in advance for all the ideas.

Example of table;
Name |Email | Roles | Status | Last active
user00 |user00@mail.com | Doctor | Active | 1 hour ago
user01 |user01@mail.com | Engineer | Active |2 minutes ago
user02 |user02@mail.com | Doctor | Pending | 2 months ago
user03 |user03@mail.com | Police |Inactive | 11 days ago*

Example of html part ( [1]child element and [7] child element are not necessary to check)

  <table>
     <tbody class="TableBody-root">
      <tr class="TableRow-root user_12341234blabla">
       <td class"TableCell-root TableCell-body width">
       <td class"TableCell-root TableCell-body">user00</td>
       <td class"TableCell-root TableCell-body">user00@mail.com</td>
       <td class"TableCell-root TableCell-body">Doctor</td>
       <td class"TableCell-root TableCell-body">Active</td>
       <td class"TableCell-root TableCell-body">1 hour ago</td>
       <td class"TableCell-root TableCell-body stngs">
      </tr>
      <tr class="TableRow-root user_42241234alsbla">
       <td class"TableCell-root TableCell-body width">
       <td class"TableCell-root TableCell-body">user01</td>
       <td class"TableCell-root TableCell-body">user01@mail.com</td>
       <td class"TableCell-root TableCell-body">Engineer</td>
       <td class"TableCell-root TableCell-body">Active</td>
       <td class"TableCell-root TableCell-body">2 minutes ago</td>
       <td class"TableCell-root TableCell-body stngs">
      </tr>
    <tr class="TableRow-root user_3554a234alsbla">
       <td class"TableCell-root TableCell-body width">
       <td class"TableCell-root TableCell-body">user02</td>
       <td class"TableCell-root TableCell-body">user02@mail.com</td>
       <td class"TableCell-root TableCell-body">Doctorr</td>
       <td class"TableCell-root TableCell-body">Pending</td>
       <td class"TableCell-root TableCell-body">2 months ago</td>
       <td class"TableCell-root TableCell-body stngs">
      </tr>
    <tr class="TableRow-root user_87941234sasbla">
       <td class"TableCell-root TableCell-body width">
       <td class"TableCell-root TableCell-body">user03</td>
       <td class"TableCell-root TableCell-body">user03@mail.com</td>
       <td class"TableCell-root TableCell-body">Police</td>
       <td class"TableCell-root TableCell-body">Inactive</td>
       <td class"TableCell-root TableCell-body">11 days ago</td>
       <td class"TableCell-root TableCell-body stngs">
      </tr>

   </tbody> 
</table>

And this is my code;

  cy.wait("@getUsers") 
 
      .its("response.body")
      .its("user")
      .then(user => {
  

        for (let i = 0; i < user.length; i++) {
          for (let a = 2; a <= 6; a++) {
            cy.get(`.user_${user[i].id}>:nth-child(${a})`)
              .invoke("text")
              .then(userInfo => {
                expect(userInfo).to.equal() // here i stuck
              });
          }
        }
**Its response.body**

    user    [ {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, … ]
    0   Object { id: "user_12341234blabla", name: "user00", email: "user00@mail.com", … }
    1   Object { id: "user_42241234alsbla", name: "user01", email: "user01@mail.com", … }
    2   Object { id: "user_3554a234alsbla", name: "user02", email: "user02@mail.com", … }

    3   Object { id: "user_87941234sasbla", name: "user03", email: "user03@mail.com", … }
    
    **Under the object [0]**
    
    id  "12341234blabla"
    name    "user00"
    email   "user00@mail.com"
    locale  "en"
    receive_notifications   true
    current_sign_in_at  "2022-06-14T00:36:41.240+02:00"
    created_at  "2022-02-10T10:25:45.333+01:00"
    updated_at  "2022-06-14T00:36:41.240+02:00"
    unconfirmed_email   null
    pending_reconfirmation  false
    confirmation_sent_at    null
    confirmation_period_expired null
    is_invited  false  //if its true it means status is pending otherwise active or inactive 
    is_managed_externally   false
    roles_without_context   [ {…} ]
    resource_role_users [ {…} ]
    invitee_invitations []
    
    **Under roles_without_context [{...}]**
    
    0   Object { id: "0a79-43ee-ae43", 
    created_at: "2022-02-10T10:25:45.345+01:00", 
    updated_at: "2022-02-10T10:25:45.345+01:00", … }
    id  "0a79-43ee-ae43"
    context_type    null
    context_id  null
    role    null
    created_at  "2022-02-10T10:25:45.345+01:00"
    updated_at  "2022-02-10T10:25:45.345+01:00"
    locked  true
    name    "Doctor"   //it shows role 
    clm_name    null
    client_id   "8506-d772d917af86"

Solution

  • Are the values you need to compare on the user object?

    Check it out with console.log(user), for example if user looks like

    [
      {
        id: "user00",
        email: "user00@mail.com",
        roles_without_context: {
          name: "Doctor"
        }
        status: "Active",
        lastSeen: "1 hour ago"
      },
      {
        id: "user01",
      ...
    ]
    

    then in the test (roughly)

    const thisUser = user[i]
    
    if (a === 2) {
      expect(userInfo).to.equal(thisUser.email)
    } 
    if (a === 3) {
      const role = user.roles_without_context.name
      expect(userInfo).to.equal(role)
    } 
    if (a === 4) {
      const status = thisUser.pending_reconfirmation ? 'Pending' : 'Active';
      expect(userInfo).to.equal(status)
    } 
    if (a === 5) {
      const lastSeen = thisUser.??? // what field is this
      expect(userInfo).to.equal(lastSeen)
    }