Add latest changes from gitlab-org/gitlab@master

2 files changed, 48 insertions, 1 deletions

diff --git a/app/assets/javascripts/issue_show/stores/index.js b/app/assets/javascripts/issue_show/stores/index.js
index d32747b5053..688ba7b268d 100644
--- a/app/assets/javascripts/issue_show/stores/index.js
+++ b/app/assets/javascripts/issue_show/stores/index.js
@@ -1,4 +1,6 @@
+import _ from 'underscore';
 import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils';
+import updateDescription from '../utils/update_description';
 
 export default class Store {
   constructor(initialState) {
@@ -19,8 +21,15 @@ export default class Store {
     }
 
     Object.assign(this.state, convertObjectPropsToCamelCase(data));
+    // find if there is an open details node inside of the issue description.
+    const descriptionSection = document.body.querySelector(
+      '.detail-page-description.content-block',
+    );
+    const details =
+      !_.isNull(descriptionSection) && descriptionSection.getElementsByTagName('details');
+
+    this.state.descriptionHtml = updateDescription(data.description, details);
     this.state.titleHtml = data.title;
-    this.state.descriptionHtml = data.description;
     this.state.lock_version = data.lock_version;
   }
 
diff --git a/app/assets/javascripts/issue_show/utils/update_description.js b/app/assets/javascripts/issue_show/utils/update_description.js
new file mode 100644
index 00000000000..315f6c23b02
--- /dev/null
+++ b/app/assets/javascripts/issue_show/utils/update_description.js
@@ -0,0 +1,38 @@
+import _ from 'underscore';
+
+/**
+ * Function that replaces the open attribute for the <details> element.
+ *
+ * @param {String} descriptionHtml - The html string passed back from the server as a result of polling
+ * @param {Array} details - All detail nodes inside of the issue description.
+ */
+
+const updateDescription = (descriptionHtml = '', details) => {
+  let detailNodes = details;
+
+  if (_.isEmpty(details)) {
+    detailNodes = [];
+  }
+
+  const placeholder = document.createElement('div');
+  placeholder.innerHTML = descriptionHtml;
+
+  const newDetails = placeholder.getElementsByTagName('details');
+
+  if (newDetails.length !== detailNodes.length) {
+    return descriptionHtml;
+  }
+
+  Array.from(newDetails).forEach((el, i) => {
+    /*
+     * <details> has an open attribute that can have a value, "", "true", "false"
+     * and will show the dropdown, which is why we are setting the attribute
+     * explicitly to true.
+     */
+    if (detailNodes[i].open) el.setAttribute('open', true);
+  });
+
+  return placeholder.innerHTML;
+};
+
+export default updateDescription;