diff --git a/app/assets/javascripts/diffs/components/app.vue b/app/assets/javascripts/diffs/components/app.vue
index 7c60fb3da42df0e4d174658f4c50fed0615607c9..f80e20a4391f802d70282239378f70ab74ba2f59 100644
--- a/app/assets/javascripts/diffs/components/app.vue
+++ b/app/assets/javascripts/diffs/components/app.vue
@@ -128,6 +128,7 @@ export default {
     eventHub.$once('fetchedNotesData', this.setDiscussions);
   },
   methods: {
+    ...mapActions(['startTaskList']),
     ...mapActions('diffs', [
       'setBaseConfig',
       'fetchDiffFiles',
@@ -157,7 +158,13 @@ export default {
       if (this.isNotesFetched && !this.assignedDiscussions && !this.isLoading) {
         this.assignedDiscussions = true;
 
-        requestIdleCallback(() => this.assignDiscussionsToDiff(), { timeout: 1000 });
+        requestIdleCallback(
+          () =>
+            this.assignDiscussionsToDiff()
+              .then(this.$nextTick)
+              .then(this.startTaskList),
+          { timeout: 1000 },
+        );
       }
     },
     adjustView() {
diff --git a/app/assets/javascripts/notes/components/note_body.vue b/app/assets/javascripts/notes/components/note_body.vue
index cf4c35de42c8a63204c0602b2807efab94c9ad96..9375627359c4b670b4c20913d724d622d8755f74 100644
--- a/app/assets/javascripts/notes/components/note_body.vue
+++ b/app/assets/javascripts/notes/components/note_body.vue
@@ -4,7 +4,6 @@ import noteEditedText from './note_edited_text.vue';
 import noteAwardsList from './note_awards_list.vue';
 import noteAttachment from './note_attachment.vue';
 import noteForm from './note_form.vue';
-import TaskList from '../../task_list';
 import autosave from '../mixins/autosave';
 
 export default {
@@ -37,14 +36,12 @@ export default {
   },
   mounted() {
     this.renderGFM();
-    this.initTaskList();
 
     if (this.isEditing) {
       this.initAutoSave(this.note);
     }
   },
   updated() {
-    this.initTaskList();
     this.renderGFM();
 
     if (this.isEditing) {
@@ -59,15 +56,6 @@ export default {
     renderGFM() {
       $(this.$refs['note-body']).renderGFM();
     },
-    initTaskList() {
-      if (this.canEdit) {
-        this.taskList = new TaskList({
-          dataType: 'note',
-          fieldName: 'note',
-          selector: '.notes',
-        });
-      }
-    },
     handleFormUpdate(note, parentElement, callback) {
       this.$emit('handleFormUpdate', note, parentElement, callback);
     },
diff --git a/app/assets/javascripts/notes/components/noteable_note.vue b/app/assets/javascripts/notes/components/noteable_note.vue
index e302a89ee95ab0a1cf058e807a8370659647901d..9ab91e2abe566c57499df1553f0decf07fa6d5c4 100644
--- a/app/assets/javascripts/notes/components/noteable_note.vue
+++ b/app/assets/javascripts/notes/components/noteable_note.vue
@@ -46,6 +46,7 @@ export default {
         'is-requesting being-posted': this.isRequesting,
         'disabled-content': this.isDeleting,
         target: this.isTarget,
+        'is-editable': this.note.current_user.can_edit,
       };
     },
     canResolve() {
diff --git a/app/assets/javascripts/notes/components/notes_app.vue b/app/assets/javascripts/notes/components/notes_app.vue
index e555279a6acb9096533c4108488f69ecd16390ee..69ddfd751e0ac9f94677db89bdfa2adccd23e66a 100644
--- a/app/assets/javascripts/notes/components/notes_app.vue
+++ b/app/assets/javascripts/notes/components/notes_app.vue
@@ -122,6 +122,7 @@ export default {
       setTargetNoteHash: 'setTargetNoteHash',
       toggleDiscussion: 'toggleDiscussion',
       setNotesFetchedState: 'setNotesFetchedState',
+      startTaskList: 'startTaskList',
     }),
     getComponentName(discussion) {
       if (discussion.isSkeletonNote) {
@@ -157,6 +158,7 @@ export default {
           this.isFetching = false;
         })
         .then(() => this.$nextTick())
+        .then(() => this.startTaskList())
         .then(() => this.checkLocationHash())
         .catch(() => {
           this.setLoadingState(false);
diff --git a/app/assets/javascripts/notes/stores/actions.js b/app/assets/javascripts/notes/stores/actions.js
index 88739ffb0833beedc7f95420efb89b9d1045f8f5..e67b3a6a3f6f80616b14ca77cb56cc00e448d035 100644
--- a/app/assets/javascripts/notes/stores/actions.js
+++ b/app/assets/javascripts/notes/stores/actions.js
@@ -1,6 +1,8 @@
+import Vue from 'vue';
 import $ from 'jquery';
 import axios from '~/lib/utils/axios_utils';
 import Visibility from 'visibilityjs';
+import TaskList from '../../task_list';
 import Flash from '../../flash';
 import Poll from '../../lib/utils/poll';
 import * as types from './mutation_types';
@@ -368,5 +370,13 @@ export const setCommentsDisabled = ({ commit }, data) => {
   commit(types.DISABLE_COMMENTS, data);
 };
 
+export const startTaskList = ({ dispatch }) =>
+  new TaskList({
+    dataType: 'note',
+    fieldName: 'note',
+    selector: '.notes .is-editable',
+    onSuccess: () => Vue.$nextTick(() => dispatch('startTaskList')),
+  });
+
 // prevent babel-plugin-rewire from generating an invalid default during karma tests
 export default () => {};