[fix] Fixed "Esc" key close bug in the visualizer #185

Fixes #185
openwisp · May 26, 2023 · f6cdbec · f6cdbec
1 parent d1d6bd3
commit f6cdbec
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 1 deletion.
diff --git a/openwisp_network_topology/static/netjsongraph/js/visualize.js b/openwisp_network_topology/static/netjsongraph/js/visualize.js
@@ -33,14 +33,16 @@ django.jQuery(function ($) {
 
             overlay.find('.closeBtn').click(function (e) {
                 e.preventDefault();
-                window.graph.echarts.dispose();
                 closeOverlay();
             });
         });
         $(document).keydown(disableArrowKeys);
     };
 
     var closeOverlay = function () {
+        // Make sure that whenever this function is called,
+        // We first destroy the echart instance
+        window.graph.echarts.dispose();
         $(document).unbind('keydown', disableArrowKeys);
         inner.empty();
         overlay.hide();

diff --git a/openwisp_network_topology/tests/test_selenium.py b/openwisp_network_topology/tests/test_selenium.py
@@ -5,6 +5,7 @@
 from selenium.common.exceptions import ElementClickInterceptedException
 from selenium.webdriver.common.by import By
 from selenium.webdriver.common.desired_capabilities import DesiredCapabilities
+from selenium.webdriver.common.keys import Keys
 from selenium.webdriver.support import expected_conditions as EC
 from selenium.webdriver.support.ui import WebDriverWait
 from swapper import load_model
@@ -169,3 +170,21 @@ def test_topology_admin_visualizer_multiple_close_btn_append(self):
             self.web_driver.find_element(By.CLASS_NAME, 'closeBtn').click()
         except ElementClickInterceptedException:
             self.fail('Multiple "closeBtn" are present in the visualizer DOM')
+
+    def test_topology_admin_esc_key_close_visualizer(self):
+        path = reverse(f'{self.prefix}_topology_change', args=[self.topology.pk])
+        self.login(username=self.admin_username, password=self.admin_password)
+        self.open(path)
+        self.web_driver.find_element(By.CSS_SELECTOR, 'input.visualizelink').click()
+        self._assert_topology_graph()
+        # Try to close the visualizer with the "Esc" key.
+        body = self.web_driver.find_element(By.TAG_NAME, 'body')
+        body.send_keys(Keys.ESCAPE)
+        # Open the visualizer again and make sure no JS errors
+        # are thrown when the visualizer is closed again
+        self.web_driver.find_element(By.CSS_SELECTOR, 'input.visualizelink').click()
+        self._assert_topology_graph()
+        self.web_driver.find_element(By.CLASS_NAME, 'closeBtn').click()
+        console_logs = self.web_driver.get_log('browser')
+        console_errors = self._get_console_errors(console_logs)
+        self.assertEqual(console_errors, [])