From fe4ccddd4e637c05e7001da657248df811a8b083 Mon Sep 17 00:00:00 2001
From: shubhamsigdar1 <shubhamsigdar@gmail.com>
Date: Fri, 19 May 2023 04:23:25 +0530
Subject: [PATCH 1/5] added test for user-status page

---
 app/components/user-status.hbs                |  14 +-
 .../components/user-status-test.js            | 150 ++++++++++++++++++
 2 files changed, 157 insertions(+), 7 deletions(-)
 create mode 100644 tests/integration/components/user-status-test.js

diff --git a/app/components/user-status.hbs b/app/components/user-status.hbs
index 345ef6fc..1fa37eaa 100644
--- a/app/components/user-status.hbs
+++ b/app/components/user-status.hbs
@@ -3,21 +3,21 @@
     <Spinner />
   </div>
 {{else}}
-<div class="heading">
+<div data-test-heading class="heading">
   {{#each this.currentUserStatus as |currentStatus|}}
   {{#if (eq @status currentStatus.status)}}
     {{#if (eq currentStatus.status "ONBOARDING")}}
       <div data-test-onboarding-details class="onboarding-details">
         <h2 data-test-status>You are undergoing onboarding</h2>
-        <p data-test-details>
+        <p data-test-details-p1>
           If you are a Developer, please complete your submission for 
           <a href="https://github.com/Real-Dev-Squad/lift-simulation">Lift Simulation</a>, 
           and ask for doubts in the team chat on Discord.
         </p>
-        <p data-test-details>If you are not a developer, please contact Ankush for next steps.</p>
+        <p data-test-details-p2>If you are not a developer, please contact Ankush for next steps.</p>
         <button class="buttons__active" type="button"  {disabled={{@isStatusUpdating}} {{on "click" (fn
           this.changeStatus "ACTIVE" )}} data-test-active-button>
-          <span>Change your status to Active</span>
+          <span data-test-btn-label="ACTIVE">Change your status to Active</span>
         </button>
       </div>
     {{else}}
@@ -27,12 +27,12 @@
   {{/each}}
 </div>
 
-<div class="buttons">
+<div data-test-btn-div class="buttons">
   {{#each this.currentUserStatus as |currentStatus|}}
     {{#if (eq @status currentStatus.status)}}
       {{#each currentStatus.otherAvailableStatus as |otherPossibleStatus|}}
-        <button class={{otherPossibleStatus.class}} type="button" disabled={{@isStatusUpdating}} {{on "click" (fn this.changeStatus otherPossibleStatus.status )}}>
-          <span>{{otherPossibleStatus.message}}</span>
+        <button data-test-btn={{otherPossibleStatus.status}} class={{otherPossibleStatus.class}} type="button" disabled={{@isStatusUpdating}} {{on "click" (fn this.changeStatus otherPossibleStatus.status )}}>
+          <span data-test-btn-label={{otherPossibleStatus.status}}>{{otherPossibleStatus.message}}</span>
         </button>
       {{/each}}
     {{/if}}
diff --git a/tests/integration/components/user-status-test.js b/tests/integration/components/user-status-test.js
new file mode 100644
index 00000000..be6371e8
--- /dev/null
+++ b/tests/integration/components/user-status-test.js
@@ -0,0 +1,150 @@
+import { module, test } from 'qunit';
+import { setupRenderingTest } from 'ember-qunit';
+import { render } from '@ember/test-helpers';
+import { hbs } from 'ember-cli-htmlbars';
+
+module('Integration | Component | user-status-modal', function (hooks) {
+  setupRenderingTest(hooks);
+
+  test('status is "DNE"', async function (assert) {
+    this.setProperties({
+      status: 'DNE',
+      isStatusUpdating: false,
+    });
+    await render(hbs`
+            <UserStatus 
+                @status={{this.status}} 
+                @isStatusUpdating={{this.isStatusUpdating}}
+            />
+            `);
+
+    assert.dom('[data-test-heading]').exists();
+    assert.dom('[data-test-status]').hasText("Your Status doesn't exist");
+
+    assert.dom('[data-test-btn-div]').exists();
+    assert.dom('[data-test-btn="ACTIVE"]').exists();
+    assert
+      .dom('[data-test-btn-label="ACTIVE"]')
+      .hasText('Change your status to Active');
+
+    assert.dom('[data-test-btn="IDLE"]').exists();
+    assert
+      .dom('[data-test-btn-label="IDLE"]')
+      .hasText('Change your status to Idle');
+
+    assert.dom('[data-test-btn="OOO"]').exists();
+    assert
+      .dom('[data-test-btn-label="OOO"]')
+      .hasText('Change your status to OOO');
+  });
+
+  test('status is "ONBOARDING"', async function (assert) {
+    this.setProperties({
+      status: 'ONBOARDING',
+      isStatusUpdating: false,
+    });
+    await render(hbs`
+            <UserStatus 
+                @status={{this.status}} 
+                @isStatusUpdating={{this.isStatusUpdating}}
+            />
+            `);
+
+    assert.dom('[data-test-heading]').exists();
+    assert.dom('[data-test-onboarding-details]').exists();
+    assert.dom('[data-test-status]').hasText('You are undergoing onboarding');
+    assert
+      .dom('[data-test-details-p1]')
+      .hasText(
+        'If you are a Developer, please complete your submission for Lift Simulation, and ask for doubts in the team chat on Discord.'
+      );
+    assert
+      .dom('[data-test-details-p2]')
+      .hasText(
+        'If you are not a developer, please contact Ankush for next steps.'
+      );
+    assert.dom('[data-test-active-button]').exists();
+    assert
+      .dom('[data-test-btn-label="ACTIVE"]')
+      .hasText('Change your status to Active');
+  });
+
+  test('status is "ACTIVE"', async function (assert) {
+    this.setProperties({
+      status: 'ACTIVE',
+      isStatusUpdating: false,
+    });
+    await render(hbs`
+            <UserStatus 
+                @status={{this.status}} 
+                @isStatusUpdating={{this.isStatusUpdating}}
+            />
+            `);
+    assert.dom('[data-test-heading]').exists();
+    assert.dom('[data-test-status]').hasText('You are Active');
+
+    assert.dom('[data-test-btn-div]').exists();
+    assert.dom('[data-test-btn="IDLE"]').exists();
+    assert
+      .dom('[data-test-btn-label="IDLE"]')
+      .hasText('Change your status to Idle');
+
+    assert.dom('[data-test-btn="OOO"]').exists();
+    assert
+      .dom('[data-test-btn-label="OOO"]')
+      .hasText('Change your status to OOO');
+  });
+
+  test('status is "IDLE"', async function (assert) {
+    this.setProperties({
+      status: 'IDLE',
+      isStatusUpdating: false,
+    });
+    await render(hbs`
+            <UserStatus 
+                @status={{this.status}} 
+                @isStatusUpdating={{this.isStatusUpdating}}
+            />
+            `);
+    assert.dom('[data-test-heading]').exists();
+    assert.dom('[data-test-status]').hasText('You are Idle');
+
+    assert.dom('[data-test-btn-div]').exists();
+    assert.dom('[data-test-btn="ACTIVE"]').exists();
+    assert
+      .dom('[data-test-btn-label="ACTIVE"]')
+      .hasText('Change your status to Active');
+
+    assert.dom('[data-test-btn="OOO"]').exists();
+    assert
+      .dom('[data-test-btn-label="OOO"]')
+      .hasText('Change your status to OOO');
+  });
+
+  test('status is "OOO"', async function (assert) {
+    this.setProperties({
+      status: 'OOO',
+      isStatusUpdating: false,
+    });
+    await render(hbs`
+            <UserStatus 
+                @status={{this.status}} 
+                @isStatusUpdating={{this.isStatusUpdating}}
+            />
+            `);
+
+    assert.dom('[data-test-heading]').exists();
+    assert.dom('[data-test-status]').hasText('You are OOO');
+
+    assert.dom('[data-test-btn-div]').exists();
+    assert.dom('[data-test-btn="ACTIVE"]').exists();
+    assert
+      .dom('[data-test-btn-label="ACTIVE"]')
+      .hasText('Change your status to Active');
+
+    assert.dom('[data-test-btn="IDLE"]').exists();
+    assert
+      .dom('[data-test-btn-label="IDLE"]')
+      .hasText('Change your status to Idle');
+  });
+});

From acb7ecade5c8ec933d32c5bc57f89de90b51990d Mon Sep 17 00:00:00 2001
From: shubhamsigdar1 <shubhamsigdar@gmail.com>
Date: Tue, 23 May 2023 01:27:55 +0530
Subject: [PATCH 2/5] write test  button is disabled or isNotDisabled

---
 .../components/user-status-test.js            | 20 +++++++++++++++++++
 1 file changed, 20 insertions(+)

diff --git a/tests/integration/components/user-status-test.js b/tests/integration/components/user-status-test.js
index be6371e8..e17966a0 100644
--- a/tests/integration/components/user-status-test.js
+++ b/tests/integration/components/user-status-test.js
@@ -23,16 +23,22 @@ module('Integration | Component | user-status-modal', function (hooks) {
 
     assert.dom('[data-test-btn-div]').exists();
     assert.dom('[data-test-btn="ACTIVE"]').exists();
+    assert.dom('.buttons__active').exists();
+    assert.dom('[data-test-btn="ACTIVE"]').isNotDisabled();
     assert
       .dom('[data-test-btn-label="ACTIVE"]')
       .hasText('Change your status to Active');
 
     assert.dom('[data-test-btn="IDLE"]').exists();
+    assert.dom('.buttons__idle').exists();
+    assert.dom('[data-test-btn="IDLE"]').isNotDisabled();
     assert
       .dom('[data-test-btn-label="IDLE"]')
       .hasText('Change your status to Idle');
 
     assert.dom('[data-test-btn="OOO"]').exists();
+    assert.dom('.buttons__ooo').exists();
+    assert.dom('[data-test-btn="OOO"]').isNotDisabled();
     assert
       .dom('[data-test-btn-label="OOO"]')
       .hasText('Change your status to OOO');
@@ -64,6 +70,8 @@ module('Integration | Component | user-status-modal', function (hooks) {
         'If you are not a developer, please contact Ankush for next steps.'
       );
     assert.dom('[data-test-active-button]').exists();
+    assert.dom('.buttons__active').exists();
+    assert.dom('[data-test-active-button]').isNotDisabled();
     assert
       .dom('[data-test-btn-label="ACTIVE"]')
       .hasText('Change your status to Active');
@@ -85,11 +93,15 @@ module('Integration | Component | user-status-modal', function (hooks) {
 
     assert.dom('[data-test-btn-div]').exists();
     assert.dom('[data-test-btn="IDLE"]').exists();
+    assert.dom('.buttons__idle').exists();
+    assert.dom('[data-test-btn="IDLE"]').isNotDisabled();
     assert
       .dom('[data-test-btn-label="IDLE"]')
       .hasText('Change your status to Idle');
 
     assert.dom('[data-test-btn="OOO"]').exists();
+    assert.dom('.buttons__ooo').exists();
+    assert.dom('[data-test-btn="OOO"]').isNotDisabled();
     assert
       .dom('[data-test-btn-label="OOO"]')
       .hasText('Change your status to OOO');
@@ -111,11 +123,15 @@ module('Integration | Component | user-status-modal', function (hooks) {
 
     assert.dom('[data-test-btn-div]').exists();
     assert.dom('[data-test-btn="ACTIVE"]').exists();
+    assert.dom('.buttons__active').exists();
+    assert.dom('[data-test-btn="ACTIVE"]').isNotDisabled();
     assert
       .dom('[data-test-btn-label="ACTIVE"]')
       .hasText('Change your status to Active');
 
     assert.dom('[data-test-btn="OOO"]').exists();
+    assert.dom('.buttons__ooo').exists();
+    assert.dom('[data-test-btn="OOO"]').isNotDisabled();
     assert
       .dom('[data-test-btn-label="OOO"]')
       .hasText('Change your status to OOO');
@@ -138,11 +154,15 @@ module('Integration | Component | user-status-modal', function (hooks) {
 
     assert.dom('[data-test-btn-div]').exists();
     assert.dom('[data-test-btn="ACTIVE"]').exists();
+    assert.dom('.buttons__active').exists();
+    assert.dom('[data-test-btn="ACTIVE"]').isNotDisabled();
     assert
       .dom('[data-test-btn-label="ACTIVE"]')
       .hasText('Change your status to Active');
 
     assert.dom('[data-test-btn="IDLE"]').exists();
+    assert.dom('.buttons__idle').exists();
+    assert.dom('[data-test-btn="IDLE"]').isNotDisabled();
     assert
       .dom('[data-test-btn-label="IDLE"]')
       .hasText('Change your status to Idle');

From 75ef74ad4bd82b1e66a64931ddd89b938e23c02b Mon Sep 17 00:00:00 2001
From: shubhamsigdar1 <shubhamsigdar@gmail.com>
Date: Wed, 24 May 2023 04:50:36 +0530
Subject: [PATCH 3/5] write assertions for the class value

---
 .../components/user-status-test.js            | 22 +++++++++----------
 1 file changed, 11 insertions(+), 11 deletions(-)

diff --git a/tests/integration/components/user-status-test.js b/tests/integration/components/user-status-test.js
index e17966a0..c6a762e9 100644
--- a/tests/integration/components/user-status-test.js
+++ b/tests/integration/components/user-status-test.js
@@ -3,7 +3,7 @@ import { setupRenderingTest } from 'ember-qunit';
 import { render } from '@ember/test-helpers';
 import { hbs } from 'ember-cli-htmlbars';
 
-module('Integration | Component | user-status-modal', function (hooks) {
+module('Integration | Component | user-status', function (hooks) {
   setupRenderingTest(hooks);
 
   test('status is "DNE"', async function (assert) {
@@ -23,21 +23,21 @@ module('Integration | Component | user-status-modal', function (hooks) {
 
     assert.dom('[data-test-btn-div]').exists();
     assert.dom('[data-test-btn="ACTIVE"]').exists();
-    assert.dom('.buttons__active').exists();
+    assert.dom('[data-test-btn="ACTIVE"]').hasClass('buttons__active');
     assert.dom('[data-test-btn="ACTIVE"]').isNotDisabled();
     assert
       .dom('[data-test-btn-label="ACTIVE"]')
       .hasText('Change your status to Active');
 
     assert.dom('[data-test-btn="IDLE"]').exists();
-    assert.dom('.buttons__idle').exists();
+    assert.dom('[data-test-btn="IDLE"]').hasClass('buttons__idle');
     assert.dom('[data-test-btn="IDLE"]').isNotDisabled();
     assert
       .dom('[data-test-btn-label="IDLE"]')
       .hasText('Change your status to Idle');
 
     assert.dom('[data-test-btn="OOO"]').exists();
-    assert.dom('.buttons__ooo').exists();
+    assert.dom('[data-test-btn="OOO"]').hasClass('buttons__ooo');
     assert.dom('[data-test-btn="OOO"]').isNotDisabled();
     assert
       .dom('[data-test-btn-label="OOO"]')
@@ -70,7 +70,7 @@ module('Integration | Component | user-status-modal', function (hooks) {
         'If you are not a developer, please contact Ankush for next steps.'
       );
     assert.dom('[data-test-active-button]').exists();
-    assert.dom('.buttons__active').exists();
+    assert.dom('[data-test-active-button]').hasClass('buttons__active');
     assert.dom('[data-test-active-button]').isNotDisabled();
     assert
       .dom('[data-test-btn-label="ACTIVE"]')
@@ -93,14 +93,14 @@ module('Integration | Component | user-status-modal', function (hooks) {
 
     assert.dom('[data-test-btn-div]').exists();
     assert.dom('[data-test-btn="IDLE"]').exists();
-    assert.dom('.buttons__idle').exists();
+    assert.dom('[data-test-btn="IDLE"]').hasClass('buttons__idle');
     assert.dom('[data-test-btn="IDLE"]').isNotDisabled();
     assert
       .dom('[data-test-btn-label="IDLE"]')
       .hasText('Change your status to Idle');
 
     assert.dom('[data-test-btn="OOO"]').exists();
-    assert.dom('.buttons__ooo').exists();
+    assert.dom('[data-test-btn="OOO"]').hasClass('buttons__ooo');
     assert.dom('[data-test-btn="OOO"]').isNotDisabled();
     assert
       .dom('[data-test-btn-label="OOO"]')
@@ -123,14 +123,14 @@ module('Integration | Component | user-status-modal', function (hooks) {
 
     assert.dom('[data-test-btn-div]').exists();
     assert.dom('[data-test-btn="ACTIVE"]').exists();
-    assert.dom('.buttons__active').exists();
+    assert.dom('[data-test-btn="ACTIVE"]').hasClass('buttons__active');
     assert.dom('[data-test-btn="ACTIVE"]').isNotDisabled();
     assert
       .dom('[data-test-btn-label="ACTIVE"]')
       .hasText('Change your status to Active');
 
     assert.dom('[data-test-btn="OOO"]').exists();
-    assert.dom('.buttons__ooo').exists();
+    assert.dom('[data-test-btn="OOO"]').hasClass('buttons__ooo');
     assert.dom('[data-test-btn="OOO"]').isNotDisabled();
     assert
       .dom('[data-test-btn-label="OOO"]')
@@ -154,14 +154,14 @@ module('Integration | Component | user-status-modal', function (hooks) {
 
     assert.dom('[data-test-btn-div]').exists();
     assert.dom('[data-test-btn="ACTIVE"]').exists();
-    assert.dom('.buttons__active').exists();
+    assert.dom('[data-test-btn="ACTIVE"]').hasClass('buttons__active');
     assert.dom('[data-test-btn="ACTIVE"]').isNotDisabled();
     assert
       .dom('[data-test-btn-label="ACTIVE"]')
       .hasText('Change your status to Active');
 
     assert.dom('[data-test-btn="IDLE"]').exists();
-    assert.dom('.buttons__idle').exists();
+    assert.dom('[data-test-btn="IDLE"]').hasClass('buttons__idle');
     assert.dom('[data-test-btn="IDLE"]').isNotDisabled();
     assert
       .dom('[data-test-btn-label="IDLE"]')

From 0b13e12b3a004dff3f7c04d20c090ea93693b7c2 Mon Sep 17 00:00:00 2001
From: shubhamsigdar1 <shubhamsigdar@gmail.com>
Date: Thu, 25 May 2023 03:00:50 +0530
Subject: [PATCH 4/5] added test for when button is clicked

---
 .../components/user-status-test.js            | 76 ++++++++++++++++++-
 1 file changed, 75 insertions(+), 1 deletion(-)

diff --git a/tests/integration/components/user-status-test.js b/tests/integration/components/user-status-test.js
index c6a762e9..af953647 100644
--- a/tests/integration/components/user-status-test.js
+++ b/tests/integration/components/user-status-test.js
@@ -1,6 +1,6 @@
 import { module, test } from 'qunit';
 import { setupRenderingTest } from 'ember-qunit';
-import { render } from '@ember/test-helpers';
+import { click, render } from '@ember/test-helpers';
 import { hbs } from 'ember-cli-htmlbars';
 
 module('Integration | Component | user-status', function (hooks) {
@@ -10,11 +10,27 @@ module('Integration | Component | user-status', function (hooks) {
     this.setProperties({
       status: 'DNE',
       isStatusUpdating: false,
+      updateStatus: (statusPayLoad) => {
+        const {
+          currentStatus: { updatedAt, from, state  },
+        } = statusPayLoad;
+        assert.equal(state, 'ACTIVE', 'new state present in the payload');
+        assert.ok(typeof from === 'number', 'from is a numeric timestamp');
+        assert.ok(
+          typeof updatedAt === 'number',
+          'updatedAt is a numeric timestamp'
+        );
+      },
+      changeStatus: () => {
+        assert.ok('true','button is clicked');
+      },
     });
     await render(hbs`
             <UserStatus 
                 @status={{this.status}} 
+                @changeStatus={{this.changeStatus}} 
                 @isStatusUpdating={{this.isStatusUpdating}}
+                @updateStatus={{this.updateStatus}} 
             />
             `);
 
@@ -28,6 +44,7 @@ module('Integration | Component | user-status', function (hooks) {
     assert
       .dom('[data-test-btn-label="ACTIVE"]')
       .hasText('Change your status to Active');
+    await click('[data-test-btn="ACTIVE"]');
 
     assert.dom('[data-test-btn="IDLE"]').exists();
     assert.dom('[data-test-btn="IDLE"]').hasClass('buttons__idle');
@@ -35,6 +52,7 @@ module('Integration | Component | user-status', function (hooks) {
     assert
       .dom('[data-test-btn-label="IDLE"]')
       .hasText('Change your status to Idle');
+    await click('[data-test-btn="IDLE"]');
 
     assert.dom('[data-test-btn="OOO"]').exists();
     assert.dom('[data-test-btn="OOO"]').hasClass('buttons__ooo');
@@ -42,17 +60,30 @@ module('Integration | Component | user-status', function (hooks) {
     assert
       .dom('[data-test-btn-label="OOO"]')
       .hasText('Change your status to OOO');
+    await click('[data-test-btn="OOO"]');
   });
 
   test('status is "ONBOARDING"', async function (assert) {
     this.setProperties({
       status: 'ONBOARDING',
       isStatusUpdating: false,
+      updateStatus: (statusPayLoad) => {
+        const {
+          currentStatus: { updatedAt, from, state  },
+        } = statusPayLoad;
+        assert.equal(state, 'ACTIVE', 'new state present in the payload');
+        assert.ok(typeof from === 'number', 'from is a numeric timestamp');
+        assert.ok(
+          typeof updatedAt === 'number',
+          'updatedAt is a numeric timestamp'
+        );
+      },
     });
     await render(hbs`
             <UserStatus 
                 @status={{this.status}} 
                 @isStatusUpdating={{this.isStatusUpdating}}
+                @updateStatus={{this.updateStatus}}
             />
             `);
 
@@ -75,16 +106,21 @@ module('Integration | Component | user-status', function (hooks) {
     assert
       .dom('[data-test-btn-label="ACTIVE"]')
       .hasText('Change your status to Active');
+    await click('[data-test-active-button]');
   });
 
   test('status is "ACTIVE"', async function (assert) {
     this.setProperties({
       status: 'ACTIVE',
       isStatusUpdating: false,
+      changeStatus: () => {
+        assert.ok('true','button is clicked');
+      },
     });
     await render(hbs`
             <UserStatus 
                 @status={{this.status}} 
+                @changeStatus={{this.changeStatus}} 
                 @isStatusUpdating={{this.isStatusUpdating}}
             />
             `);
@@ -98,6 +134,7 @@ module('Integration | Component | user-status', function (hooks) {
     assert
       .dom('[data-test-btn-label="IDLE"]')
       .hasText('Change your status to Idle');
+    await click('[data-test-btn="IDLE"]');
 
     assert.dom('[data-test-btn="OOO"]').exists();
     assert.dom('[data-test-btn="OOO"]').hasClass('buttons__ooo');
@@ -105,17 +142,34 @@ module('Integration | Component | user-status', function (hooks) {
     assert
       .dom('[data-test-btn-label="OOO"]')
       .hasText('Change your status to OOO');
+    await click('[data-test-btn="OOO"]');
   });
 
   test('status is "IDLE"', async function (assert) {
     this.setProperties({
       status: 'IDLE',
       isStatusUpdating: false,
+      updateStatus: (statusPayLoad) => {
+        const {
+          currentStatus: { updatedAt, from, state  },
+        } = statusPayLoad;
+        assert.equal(state, 'ACTIVE', 'new state present in the payload');
+        assert.ok(typeof from === 'number', 'from is a numeric timestamp');
+        assert.ok(
+          typeof updatedAt === 'number',
+          'updatedAt is a numeric timestamp'
+        );
+      },
+      changeStatus: () => {
+        assert.ok('true','button is clicked');
+      },
     });
     await render(hbs`
             <UserStatus 
                 @status={{this.status}} 
+                @changeStatus={{this.changeStatus}} 
                 @isStatusUpdating={{this.isStatusUpdating}}
+                @updateStatus={{this.updateStatus}}
             />
             `);
     assert.dom('[data-test-heading]').exists();
@@ -128,6 +182,7 @@ module('Integration | Component | user-status', function (hooks) {
     assert
       .dom('[data-test-btn-label="ACTIVE"]')
       .hasText('Change your status to Active');
+    await click('[data-test-btn="ACTIVE"]');
 
     assert.dom('[data-test-btn="OOO"]').exists();
     assert.dom('[data-test-btn="OOO"]').hasClass('buttons__ooo');
@@ -135,17 +190,34 @@ module('Integration | Component | user-status', function (hooks) {
     assert
       .dom('[data-test-btn-label="OOO"]')
       .hasText('Change your status to OOO');
+    await click('[data-test-btn="OOO"]');
   });
 
   test('status is "OOO"', async function (assert) {
     this.setProperties({
       status: 'OOO',
       isStatusUpdating: false,
+      updateStatus: (statusPayLoad) => {
+        const {
+          currentStatus: { updatedAt, from, state  },
+        } = statusPayLoad;
+        assert.equal(state, 'ACTIVE', 'new state present in the payload');
+        assert.ok(typeof from === 'number', 'from is a numeric timestamp');
+        assert.ok(
+          typeof updatedAt === 'number',
+          'updatedAt is a numeric timestamp'
+        );
+      },
+      changeStatus: () => {
+        assert.ok('true','button is clicked');
+      },
     });
     await render(hbs`
             <UserStatus 
                 @status={{this.status}} 
+                @changeStatus={{this.changeStatus}}
                 @isStatusUpdating={{this.isStatusUpdating}}
+                @updateStatus={{this.updateStatus}}
             />
             `);
 
@@ -159,6 +231,7 @@ module('Integration | Component | user-status', function (hooks) {
     assert
       .dom('[data-test-btn-label="ACTIVE"]')
       .hasText('Change your status to Active');
+    await click('[data-test-btn="ACTIVE"]');
 
     assert.dom('[data-test-btn="IDLE"]').exists();
     assert.dom('[data-test-btn="IDLE"]').hasClass('buttons__idle');
@@ -166,5 +239,6 @@ module('Integration | Component | user-status', function (hooks) {
     assert
       .dom('[data-test-btn-label="IDLE"]')
       .hasText('Change your status to Idle');
+    await click('[data-test-btn="IDLE"]');
   });
 });

From 1b56e938fea0f7f0709e6e618b5ddc117410cf28 Mon Sep 17 00:00:00 2001
From: shubhamsigdar1 <shubhamsigdar@gmail.com>
Date: Thu, 25 May 2023 03:01:39 +0530
Subject: [PATCH 5/5] added test for when button is clicked

---
 tests/integration/components/user-status-test.js | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/tests/integration/components/user-status-test.js b/tests/integration/components/user-status-test.js
index af953647..c72da238 100644
--- a/tests/integration/components/user-status-test.js
+++ b/tests/integration/components/user-status-test.js
@@ -12,7 +12,7 @@ module('Integration | Component | user-status', function (hooks) {
       isStatusUpdating: false,
       updateStatus: (statusPayLoad) => {
         const {
-          currentStatus: { updatedAt, from, state  },
+          currentStatus: { updatedAt, from, state },
         } = statusPayLoad;
         assert.equal(state, 'ACTIVE', 'new state present in the payload');
         assert.ok(typeof from === 'number', 'from is a numeric timestamp');
@@ -22,7 +22,7 @@ module('Integration | Component | user-status', function (hooks) {
         );
       },
       changeStatus: () => {
-        assert.ok('true','button is clicked');
+        assert.ok('true', 'button is clicked');
       },
     });
     await render(hbs`
@@ -69,7 +69,7 @@ module('Integration | Component | user-status', function (hooks) {
       isStatusUpdating: false,
       updateStatus: (statusPayLoad) => {
         const {
-          currentStatus: { updatedAt, from, state  },
+          currentStatus: { updatedAt, from, state },
         } = statusPayLoad;
         assert.equal(state, 'ACTIVE', 'new state present in the payload');
         assert.ok(typeof from === 'number', 'from is a numeric timestamp');
@@ -114,7 +114,7 @@ module('Integration | Component | user-status', function (hooks) {
       status: 'ACTIVE',
       isStatusUpdating: false,
       changeStatus: () => {
-        assert.ok('true','button is clicked');
+        assert.ok('true', 'button is clicked');
       },
     });
     await render(hbs`
@@ -151,7 +151,7 @@ module('Integration | Component | user-status', function (hooks) {
       isStatusUpdating: false,
       updateStatus: (statusPayLoad) => {
         const {
-          currentStatus: { updatedAt, from, state  },
+          currentStatus: { updatedAt, from, state },
         } = statusPayLoad;
         assert.equal(state, 'ACTIVE', 'new state present in the payload');
         assert.ok(typeof from === 'number', 'from is a numeric timestamp');
@@ -161,7 +161,7 @@ module('Integration | Component | user-status', function (hooks) {
         );
       },
       changeStatus: () => {
-        assert.ok('true','button is clicked');
+        assert.ok('true', 'button is clicked');
       },
     });
     await render(hbs`
@@ -199,7 +199,7 @@ module('Integration | Component | user-status', function (hooks) {
       isStatusUpdating: false,
       updateStatus: (statusPayLoad) => {
         const {
-          currentStatus: { updatedAt, from, state  },
+          currentStatus: { updatedAt, from, state },
         } = statusPayLoad;
         assert.equal(state, 'ACTIVE', 'new state present in the payload');
         assert.ok(typeof from === 'number', 'from is a numeric timestamp');
@@ -209,7 +209,7 @@ module('Integration | Component | user-status', function (hooks) {
         );
       },
       changeStatus: () => {
-        assert.ok('true','button is clicked');
+        assert.ok('true', 'button is clicked');
       },
     });
     await render(hbs`