Cached jQuery selectors

app/assets/javascripts/right_sidebar.js.coffee

@@ -47,40 +47,41 @@ class @Sidebar
       .off 'click', '.js-issuable-todo'
       .on 'click', '.js-issuable-todo', @toggleTodo
 
-  toggleTodo: (e) ->
+  toggleTodo: ->
     $this = $(@)
-    $btnText = $this.find('span')
-    data = {
-      todo_id: $this.attr('data-id')
-    }
+    $todoLoading = $('.js-issuable-todo-loading')
+    $btnText = $('.js-issuable-todo-text', $this)
 
     $.ajax(
       url: $this.data('url')
       type: 'POST'
       dataType: 'json'
-      data: data
+      data:
+        todo_id: $this.attr('data-id')
       beforeSend: ->
         $this.disable()
-        $('.js-issuable-todo-loading').removeClass 'hidden'
+        $todoLoading.removeClass 'hidden'
     ).done (data) ->
       $todoPendingCount = $('.todos-pending-count')
       $todoPendingCount.text data.count
 
       $this.enable()
-      $('.js-issuable-todo-loading').addClass 'hidden'
+      $todoLoading.addClass 'hidden'
 
       if data.count is 0
-        $todoPendingCount
-          .addClass 'hidden'
+        $todoPendingCount.addClass 'hidden'
       else
-        $todoPendingCount
-          .removeClass 'hidden'
+        $todoPendingCount.removeClass 'hidden'
 
       if data.todo?
+        $this
+          .attr 'aria-label', $this.data('mark-text')
+          .attr 'data-id', data.todo.id
         $btnText.text $this.data('mark-text')
-        $this.attr 'data-id', data.todo.id
       else
-        $this.removeAttr 'data-id'
+        $this
+          .attr 'aria-label', $this.data('todo-text')
+          .removeAttr 'data-id'
         $btnText.text $this.data('todo-text')
 
   sidebarDropdownLoading: (e) ->

app/views/shared/issuable/_sidebar.html.haml

@@ -9,12 +9,11 @@
       %a.gutter-toggle.pull-right.js-sidebar-toggle{ role: "button", href: "#", aria: { label: "Toggle sidebar" } }
         = sidebar_gutter_toggle_icon
       - if current_user
-        %button.btn.btn-default.issuable-header-btn.pull-right.js-issuable-todo{ type: "button", data: { todo_text: "Add Todo", mark_text: "Mark Done", id: (todo.id unless todo.nil?), url: issuable_todo_path(issuable) } }
-          - if todo.nil?
-            %span
+        %button.btn.btn-default.issuable-header-btn.pull-right.js-issuable-todo{ type: "button", aria: { label: (todo.nil? ? "Add Todo" : "Mark Done") }, data: { todo_text: "Add Todo", mark_text: "Mark Done", id: (todo.id unless todo.nil?), url: issuable_todo_path(issuable) } }
+          %span.js-issuable-todo-text
+            - if todo.nil?
               Add Todo
-          - else
-            %span
+            - else
               Mark Done
           = icon('spin spinner', class: 'hidden js-issuable-todo-loading')