diff --git a/app/assets/javascripts/notes/components/issue_note_signed_out_widget.vue b/app/assets/javascripts/notes/components/issue_note_signed_out_widget.vue
index 9527d0fd80a..6d551225b29 100644
--- a/app/assets/javascripts/notes/components/issue_note_signed_out_widget.vue
+++ b/app/assets/javascripts/notes/components/issue_note_signed_out_widget.vue
@@ -1,5 +1,6 @@
 <script>
   export default {
+    name: 'singInLinksNotes',
     data() {
       const { newSessionPath, registerPath } = this.$store.getters.notesData;
 
diff --git a/app/assets/javascripts/notes/components/issue_system_note.vue b/app/assets/javascripts/notes/components/issue_system_note.vue
index 492ba58c6a6..d7af0458198 100644
--- a/app/assets/javascripts/notes/components/issue_system_note.vue
+++ b/app/assets/javascripts/notes/components/issue_system_note.vue
@@ -4,6 +4,7 @@
   import issueNoteHeader from './issue_note_header.vue';
 
   export default {
+    name: 'systemNote',
     props: {
       note: {
         type: Object,
diff --git a/spec/javascripts/notes/components/issue_system_note_spec.js b/spec/javascripts/notes/components/issue_system_note_spec.js
new file mode 100644
index 00000000000..779de4ab657
--- /dev/null
+++ b/spec/javascripts/notes/components/issue_system_note_spec.js
@@ -0,0 +1,17 @@
+describe('issue system note', () => {
+  it('should render a list item with correct id', () => {
+
+  });
+
+  it('should render target class is note is target note', () => {
+
+  });
+
+  it('should render svg icon', () => {
+
+  });
+
+  it('should render note header component', () => {
+
+  });
+});