caMicroscope
caMicroscope copied to clipboard
Bug : Responsive table duplication on mobile screens due to stacktable.js multiple initializations
Describe the bug The responsive tables rendered on mobile screens exhibit duplicated tables. The issue is caused by multiple instances of responsive tables being initialized by the stacktable.js plugin, without the previous instances being cleared from the DOM. This results in stacked tables accumulating and rendering duplicate content.
To Reproduce Steps to reproduce the behavior:
- Navigate to the Slides table page on a desktop browser.
- Activate responsive design mode, simulating a mobile viewport.
- Observe the manifestation of duplicate table instances indicated by multiple .stacktable.small-only elements.
Expected behavior There should be no table duplicates in the table.html page.
Screenshots
Desktop (please complete the following information):
- OS: Windows
- Browser Chrome
- Version 123.0.6312.58 (Official Build) (64-bit)
Additional context When the page is loaded or when certain actions trigger a table refresh on mobile devices, the stacktable.js plugin is called to create the mobile-friendly table layout. If the plugin is called multiple times without proper cleanup, each call generates a new stacked table, leading to multiple stacked tables being inserted into the DOM.