From 4f57bb1b6437bf19f89bc664e1b328afd94a09e1 Mon Sep 17 00:00:00 2001
From: Faris Ansari <netchamp.faris@gmail.com>
Date: Sun, 23 Sep 2018 14:45:12 +0530
Subject: [PATCH] fix(filterRows): Show/hide rows using setStyle and
 removeStyle

Finding row elements and adding/removing classes on them is slower and unreliable
---
 src/rowmanager.js | 15 +++++++--------
 src/style.js      | 30 ++++++++++++++++++++++++++----
 2 files changed, 33 insertions(+), 12 deletions(-)

diff --git a/src/rowmanager.js b/src/rowmanager.js
index c161aa5..5bb710d 100644
--- a/src/rowmanager.js
+++ b/src/rowmanager.js
@@ -14,7 +14,8 @@ export default class RowManager {
             'fireEvent',
             'wrapper',
             'bodyScrollable',
-            'bodyRenderer'
+            'bodyRenderer',
+            'style'
         ]);
 
         this.bindEvents();
@@ -176,18 +177,16 @@ export default class RowManager {
 
     hideRows(rowIndices) {
         rowIndices = ensureArray(rowIndices);
-        rowIndices.map(rowIndex => {
-            const $tr = this.getRow$(rowIndex);
-            $tr.classList.add('dt-row--hide');
+        const selector = rowIndices.map(this.selector).join(',');
+        this.style.setStyle(selector, {
+            display: 'none'
         });
     }
 
     showRows(rowIndices) {
         rowIndices = ensureArray(rowIndices);
-        rowIndices.map(rowIndex => {
-            const $tr = this.getRow$(rowIndex);
-            $tr.classList.remove('dt-row--hide');
-        });
+        const selector = rowIndices.map(this.selector).join(',');
+        this.style.removeStyle(selector);
     }
 
     openSingleNode(rowIndex) {
diff --git a/src/style.js b/src/style.js
index d91be24..48eeacd 100644
--- a/src/style.js
+++ b/src/style.js
@@ -60,14 +60,14 @@ export default class Style {
             return;
         }
 
+        selector = selector.trim();
+        if (!selector) return;
+
         this._styleRulesMap = this._styleRulesMap || {};
         const prefixedSelector = this._getPrefixedSelector(selector);
 
         if (this._styleRulesMap[prefixedSelector]) {
-            // find and remove
-            const index = Array.from(this.stylesheet.cssRules)
-                .findIndex(rule => rule.selectorText === prefixedSelector);
-            this.stylesheet.deleteRule(index);
+            this.removeStyle(selector);
 
             // merge with old styleobject
             styleObject = Object.assign({}, this._styleRulesMap[prefixedSelector], styleObject);
@@ -80,6 +80,28 @@ export default class Style {
         this.stylesheet.insertRule(ruleString);
     }
 
+    removeStyle(selector) {
+        if (selector.includes(',')) {
+            selector.split(',')
+                .map(s => s.trim())
+                .forEach(selector => {
+                    this.removeStyle(selector);
+                });
+            return;
+        }
+
+        selector = selector.trim();
+        if (!selector) return;
+
+        // find and remove
+        const prefixedSelector = this._getPrefixedSelector(selector);
+        const index = Array.from(this.stylesheet.cssRules)
+            .findIndex(rule => rule.selectorText === prefixedSelector);
+
+        if (index === -1) return;
+        this.stylesheet.deleteRule(index);
+    }
+
     _getPrefixedSelector(selector) {
         return `.${this.scopeClass} ${selector}`;
     }