From b6b409feca787d582b7b794920ab2e0b236424d5 Mon Sep 17 00:00:00 2001
From: Lakshay Manchanda <lakshaymanchanda73@gmail.com>
Date: Wed, 22 Sep 2021 18:52:05 +0530
Subject: [PATCH 1/2] get started component test

---
 .../components/sign-up/get-started-test.js    | 81 +++++++++++++++++++
 1 file changed, 81 insertions(+)
 create mode 100644 tests/integration/components/sign-up/get-started-test.js

diff --git a/tests/integration/components/sign-up/get-started-test.js b/tests/integration/components/sign-up/get-started-test.js
new file mode 100644
index 00000000..084de87d
--- /dev/null
+++ b/tests/integration/components/sign-up/get-started-test.js
@@ -0,0 +1,81 @@
+import { module, test } from 'qunit';
+import { setupRenderingTest } from 'ember-qunit';
+import { hbs } from 'ember-cli-htmlbars';
+import { render } from '@ember/test-helpers';
+
+module('Integration | Component | sign-up/get-started', function (hooks) {
+  setupRenderingTest(hooks);
+
+  test('it renders in get-started state', async function (assert) {
+    assert.expect(5);
+
+    this.set('changeRouteParams', function (paramValue) {
+      this.isButtonDisabled = true;
+      if (paramValue)
+        this.transitionToRoute({ queryParams: { state: paramValue } });
+    });
+    this.set('state', 'get-started');
+
+    await render(
+      hbs`<SignUp::GetStarted @state={{this.state}} @changeRouteParams={{this.changeRouteParams}} />`
+    );
+
+    assert.equal(
+      this.element.querySelector('.landing h2').textContent.trim(),
+      'Thank you for connecting your GitHub!',
+      'Correct Heading'
+    );
+    assert.equal(
+      this.element.querySelector('.landing h3').textContent.trim(),
+      'Please complete the signup in order to:',
+      'Correct Subheading'
+    );
+    assert.equal(
+      this.element.querySelectorAll('.landing ul li')[0].textContent.trim(),
+      'Use Features',
+      'Correct list item'
+    );
+    assert.equal(
+      this.element.querySelectorAll('.landing ul li')[1].textContent.trim(),
+      'Display yourself on the (members) page',
+      'Correct list item'
+    );
+    assert.equal(
+      this.element.querySelector('.get-started__btn button').textContent.trim(),
+      'Get Started',
+      'Correct button title'
+    );
+  });
+
+  test('it renders in thankyou state', async function (assert) {
+    assert.expect(3);
+
+    this.set('changeRouteParams', function (paramValue) {
+      this.isButtonDisabled = true;
+      if (paramValue)
+        this.transitionToRoute({ queryParams: { state: paramValue } });
+    });
+    this.set('state', 'thank-you');
+
+    await render(
+      hbs`<SignUp::GetStarted @state={{this.state}} @changeRouteParams={{this.changeRouteParams}} />`
+    );
+
+    assert.equal(
+      this.element.querySelector('.landing h2').textContent.trim(),
+      'Congratulations!',
+      'Correct Heading'
+    );
+    assert.equal(
+      this.element.querySelector('.landing h3').textContent.trim(),
+      'Lets get you started on your journey',
+      'Correct Subheading'
+    );
+
+    assert.equal(
+      this.element.querySelector('.get-started__btn button').textContent.trim(),
+      "Let's Go",
+      'Correct button title'
+    );
+  });
+});

From fed0e7fd448770dd4905d1ad2e7af9d72d07ee9b Mon Sep 17 00:00:00 2001
From: Lakshay Manchanda <lakshaymanchanda73@gmail.com>
Date: Fri, 24 Sep 2021 03:32:07 +0530
Subject: [PATCH 2/2] Ember Test Selectors Added

---
 app/components/sign-up/button.hbs             |  1 +
 app/components/sign-up/get-started.hbs        |  8 ++---
 .../components/sign-up/get-started-test.js    | 34 ++++++-------------
 3 files changed, 15 insertions(+), 28 deletions(-)

diff --git a/app/components/sign-up/button.hbs b/app/components/sign-up/button.hbs
index 9538b550..1c9e14f3 100644
--- a/app/components/sign-up/button.hbs
+++ b/app/components/sign-up/button.hbs
@@ -1,4 +1,5 @@
 <button
+  data-test-button
   type="button"
   class="{{if @disabled 'btn-disabled'}}"
   disabled={{@disabled}}
diff --git a/app/components/sign-up/get-started.hbs b/app/components/sign-up/get-started.hbs
index 424373f6..e736fada 100644
--- a/app/components/sign-up/get-started.hbs
+++ b/app/components/sign-up/get-started.hbs
@@ -1,15 +1,15 @@
 
 <div class="landing">
-  <h2 class="landing__main-heading">
+  <h2 class="landing__main-heading" data-test-mainHeading>
     {{this.mainHeading}}
   </h2>
-  <h3 class="landing__sub-heading">
+  <h3 class="landing__sub-heading" data-test-subHeading>
     {{this.subHeading}}
   </h3>
   {{#if (eq @state "get-started")}}
     <ul class="landing__features-lists">
-      <li class="landing__features-list">Use Features</li>
-      <li class="landing__features-list">Display yourself on the (members) page</li>
+      <li class="landing__features-list" data-test-li1>Use Features</li>
+      <li class="landing__features-list" data-test-li2>Display yourself on the (members) page</li>
     </ul>
   {{/if}}
 
diff --git a/tests/integration/components/sign-up/get-started-test.js b/tests/integration/components/sign-up/get-started-test.js
index 084de87d..46789b7a 100644
--- a/tests/integration/components/sign-up/get-started-test.js
+++ b/tests/integration/components/sign-up/get-started-test.js
@@ -9,39 +9,32 @@ module('Integration | Component | sign-up/get-started', function (hooks) {
   test('it renders in get-started state', async function (assert) {
     assert.expect(5);
 
-    this.set('changeRouteParams', function (paramValue) {
-      this.isButtonDisabled = true;
-      if (paramValue)
-        this.transitionToRoute({ queryParams: { state: paramValue } });
-    });
     this.set('state', 'get-started');
 
-    await render(
-      hbs`<SignUp::GetStarted @state={{this.state}} @changeRouteParams={{this.changeRouteParams}} />`
-    );
+    await render(hbs`<SignUp::GetStarted @state={{this.state}} />`);
 
     assert.equal(
-      this.element.querySelector('.landing h2').textContent.trim(),
+      this.element.querySelector('[data-test-mainHeading]').textContent.trim(),
       'Thank you for connecting your GitHub!',
       'Correct Heading'
     );
     assert.equal(
-      this.element.querySelector('.landing h3').textContent.trim(),
+      this.element.querySelector('[data-test-subHeading]').textContent.trim(),
       'Please complete the signup in order to:',
       'Correct Subheading'
     );
     assert.equal(
-      this.element.querySelectorAll('.landing ul li')[0].textContent.trim(),
+      this.element.querySelector('[data-test-li1]').textContent.trim(),
       'Use Features',
       'Correct list item'
     );
     assert.equal(
-      this.element.querySelectorAll('.landing ul li')[1].textContent.trim(),
+      this.element.querySelector('[data-test-li2]').textContent.trim(),
       'Display yourself on the (members) page',
       'Correct list item'
     );
     assert.equal(
-      this.element.querySelector('.get-started__btn button').textContent.trim(),
+      this.element.querySelector('[data-test-button]').textContent.trim(),
       'Get Started',
       'Correct button title'
     );
@@ -50,30 +43,23 @@ module('Integration | Component | sign-up/get-started', function (hooks) {
   test('it renders in thankyou state', async function (assert) {
     assert.expect(3);
 
-    this.set('changeRouteParams', function (paramValue) {
-      this.isButtonDisabled = true;
-      if (paramValue)
-        this.transitionToRoute({ queryParams: { state: paramValue } });
-    });
     this.set('state', 'thank-you');
 
-    await render(
-      hbs`<SignUp::GetStarted @state={{this.state}} @changeRouteParams={{this.changeRouteParams}} />`
-    );
+    await render(hbs`<SignUp::GetStarted @state={{this.state}} />`);
 
     assert.equal(
-      this.element.querySelector('.landing h2').textContent.trim(),
+      this.element.querySelector('[data-test-mainHeading]').textContent.trim(),
       'Congratulations!',
       'Correct Heading'
     );
     assert.equal(
-      this.element.querySelector('.landing h3').textContent.trim(),
+      this.element.querySelector('[data-test-subHeading]').textContent.trim(),
       'Lets get you started on your journey',
       'Correct Subheading'
     );
 
     assert.equal(
-      this.element.querySelector('.get-started__btn button').textContent.trim(),
+      this.element.querySelector('[data-test-button]').textContent.trim(),
       "Let's Go",
       'Correct button title'
     );