From 9d8ca38f2e7016b753d7951a12b4b10ac3089c9f Mon Sep 17 00:00:00 2001
From: Sarah Vaupel <vaupel.sarah@campus.lmu.de>
Date: Fri, 29 Nov 2019 15:06:28 +0100
Subject: [PATCH] fix(hide-columns): fix repositioning of table hiders onclick

---
 frontend/src/utils/hide-columns/hide-columns.js | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/frontend/src/utils/hide-columns/hide-columns.js b/frontend/src/utils/hide-columns/hide-columns.js
index e8c826408..fd3c94d32 100644
--- a/frontend/src/utils/hide-columns/hide-columns.js
+++ b/frontend/src/utils/hide-columns/hide-columns.js
@@ -78,9 +78,9 @@ export class HideColumns {
   }
 
   hideHiderBehindHeader(hider) {
-    // move hider right before table (inside any scrolltable element)
-    this._tableHiderContainer.appendChild(hider);
-    // reposition hider
+    if (!this._tableHiderContainer.contains(hider)) {
+      this._tableHiderContainer.appendChild(hider);
+    }
     const thR = this.hiderToHeader.get(hider).getBoundingClientRect();
     const hR  = hider.getBoundingClientRect();
     const pR  = this._tableHiderContainer.getBoundingClientRect();
@@ -103,7 +103,11 @@ export class HideColumns {
     hider.addEventListener('click', (event) => {
       event.preventDefault();
       this.switchColumnDisplay(th, hider);
-      this._tableHiderContainer.getElementsByClassName(TABLE_HIDER_CLASS).forEach(hider => this.hideHiderBehindHeader(hider));
+
+      // recompute position for every table hider
+      this._tableHiderContainer.getElementsByClassName(TABLE_HIDER_CLASS).forEach(hider => {
+        this.hideHiderBehindHeader(hider);
+      });
     });
 
     th.addEventListener('mouseover', () => {