Initial render of issue title & description

Instead of wait for Vue for data which can cause a flash of no content depending on how quickly the API returns data. This renders the data with HAML & then passes this over to Vue to render

1 files changed, 4 insertions, 0 deletions

diff --git a/app/assets/javascripts/issue_show/index.js b/app/assets/javascripts/issue_show/index.js
index 6dba7b90716..9056f978df9 100644
--- a/app/assets/javascripts/issue_show/index.js
+++ b/app/assets/javascripts/issue_show/index.js
@@ -4,6 +4,8 @@ import '../vue_shared/vue_resource_interceptor';
 
 (() => {
   const issueTitleData = document.querySelector('.issue-title-data').dataset;
+  const initialTitle = document.querySelector('.js-issue-title').innerHTML;
+  const initialDescription = document.querySelector('.js-issue-description').innerHTML;
   const { canUpdateTasksClass, endpoint, isEdited } = issueTitleData;
 
   const vm = new Vue({
@@ -13,6 +15,8 @@ import '../vue_shared/vue_resource_interceptor';
         canUpdateTasksClass,
         endpoint,
         isEdited,
+        initialTitle,
+        initialDescription,
       },
     }),
   });