diff --git a/app/assets/javascripts/issues/show/components/description.vue b/app/assets/javascripts/issues/show/components/description.vue
index 6412a13e3e6e2ce79e6fc7a350ee518cb03ef2a8..3721f224d5eb53a7b6508c6f0c447f3225a02a37 100644
--- a/app/assets/javascripts/issues/show/components/description.vue
+++ b/app/assets/javascripts/issues/show/components/description.vue
@@ -132,7 +132,10 @@ export default {
   },
   watch: {
     descriptionHtml(newDescription, oldDescription) {
-      if (!this.initialUpdate && newDescription !== oldDescription) {
+      if (
+        !this.initialUpdate &&
+        this.stripClientState(newDescription) !== this.stripClientState(oldDescription)
+      ) {
         this.animateChange();
       } else {
         this.initialUpdate = false;
@@ -321,6 +324,9 @@ export default {
         listItem.append(element);
       }
     },
+    stripClientState(description) {
+      return description.replaceAll('<details open="true">', '<details>');
+    },
     async createTask({ taskTitle, taskDescription, oldDescription }) {
       try {
         const { title, description } = extractTaskTitleAndDescription(taskTitle, taskDescription);
diff --git a/spec/frontend/issues/show/components/description_spec.js b/spec/frontend/issues/show/components/description_spec.js
index 4b7b363f5da796b3197e8e58c3f6223060af12e4..56057e9819f664a8e43a9077b5ce5b66c9d3d911 100644
--- a/spec/frontend/issues/show/components/description_spec.js
+++ b/spec/frontend/issues/show/components/description_spec.js
@@ -19,7 +19,11 @@ import {
   getIssueDetailsResponse,
   projectWorkItemTypesQueryResponse,
 } from 'jest/work_items/mock_data';
-import { descriptionProps as initialProps, descriptionHtmlWithList } from '../mock_data/mock_data';
+import {
+  descriptionProps as initialProps,
+  descriptionHtmlWithList,
+  descriptionHtmlWithDetailsTag,
+} from '../mock_data/mock_data';
 
 jest.mock('~/alert');
 jest.mock('~/task_list');
@@ -111,6 +115,19 @@ describe('Description component', () => {
     expect(findGfmContent().classes()).toContain('issue-realtime-trigger-pulse');
   });
 
+  it('doesnt animate expand/collapse of details elements', async () => {
+    createComponent();
+
+    await wrapper.setProps({ descriptionHtml: descriptionHtmlWithDetailsTag.collapsed });
+    expect(findGfmContent().classes()).not.toContain('issue-realtime-pre-pulse');
+
+    await wrapper.setProps({ descriptionHtml: descriptionHtmlWithDetailsTag.expanded });
+    expect(findGfmContent().classes()).not.toContain('issue-realtime-pre-pulse');
+
+    await wrapper.setProps({ descriptionHtml: descriptionHtmlWithDetailsTag.collapsed });
+    expect(findGfmContent().classes()).not.toContain('issue-realtime-pre-pulse');
+  });
+
   it('applies syntax highlighting and math when description changed', async () => {
     createComponent();
 
diff --git a/spec/frontend/issues/show/mock_data/mock_data.js b/spec/frontend/issues/show/mock_data/mock_data.js
index e923c0d97f4e5617008988d948ca7a665e227f4c..ed969a08ac563d1a59c457828f714660b8094145 100644
--- a/spec/frontend/issues/show/mock_data/mock_data.js
+++ b/spec/frontend/issues/show/mock_data/mock_data.js
@@ -79,3 +79,16 @@ export const descriptionHtmlWithList = `
     <li data-sourcepos="3:1-3:8">todo 3</li>
   </ul>
 `;
+
+export const descriptionHtmlWithDetailsTag = {
+  expanded: `
+    <details open="true">
+      <summary>Section 1</summary>
+      <p>Data</p>
+    </details>'`,
+  collapsed: `
+    <details>
+      <summary>Section 1</summary>
+      <p>Data</p>
+    </details>'`,
+};