Moved the dismiss-icon listener to close the callout to a button

app/assets/javascripts/user_callout.js

@@ -2,7 +2,7 @@
 /* global Cookies */
 
 const userCalloutElementName = '.user-callout';
-const dismissIcon = '.dismiss-icon';
+const closeButton = '.close-user-callout';
 const userCalloutBtn = '.user-callout-btn';
 
 const USER_CALLOUT_COOKIE = 'user_callout_dismissed';
@@ -16,7 +16,7 @@ class UserCallout {
 
   init() {
     $(document)
-      .on('click', dismissIcon, () => this.closeAndDismissCallout())
+      .on('click', closeButton, () => this.closeAndDismissCallout())
       .on('click', userCalloutBtn, () => this.closeAndDismissCallout());
   }
 

app/views/shared/_user_callout.html.haml

 .user-callout
   .bordered-box.landing.content-block
-    %button.btn.btn-default.close{ type: "button" }
+    %button.btn.btn-default.close.close-user-callout{ type: "button" }
       = icon("times", class: "dismiss-icon")
     .row
       .col-sm-3.col-xs-12.svg-container

spec/features/user_callout_spec.rb

@@ -30,7 +30,7 @@ describe 'User Callouts', js: true do
   it 'hides the user callout when click on the dismiss icon' do
     visit user_path(user)
     within('.user-callout') do
-      find('.dismiss-icon').click
+      find('.close-user-callout').click
     end
     expect(page).not_to have_selector('#user-callout')
   end

spec/javascripts/fixtures/user_callout.html.haml

 .user-callout
   .bordered-box.landing.content-block
-    %button.btn.btn-default.close{ type: "button" }
+    %button.btn.btn-default.close.close-user-callout{ type: "button" }
       %i.fa.fa-times.dismiss-icon
     .row
       .col-sm-3.col-xs-12.svg-container

spec/javascripts/user_callout_spec.js

@@ -11,7 +11,7 @@ describe('UserCallout', function () {
   beforeEach(() => {
     loadFixtures(fixtureName);
     this.userCallout = new UserCallout();
-    this.dismissIcon = $('.dismiss-icon');
+    this.closeButton = $('.close-user-callout');
     this.userCalloutContainer = $('.user-callout');
     this.userCalloutBtn = $('.user-callout-btn');
     Cookie.set(USER_CALLOUT_COOKIE, 0);
@@ -23,7 +23,7 @@ describe('UserCallout', function () {
   });
 
   it('hides when user clicks on the dismiss-icon', () => {
-    this.dismissIcon.click();
+    this.closeButton.click();
     expect(this.userCalloutContainer.is(':visible')).toBe(false);
     expect(Cookie.get(USER_CALLOUT_COOKIE)).toBe('1');
   });