Fix image lightbox in markdown tables with sticky headers
What does this MR do and why?
When the editor_sticky_table_headers feature flag is enabled, rendered markdown tables are replaced by the MarkdownTable Vue component, which re-renders cell content via v-html. The image lightbox click listeners attached by renderGFM remained on the replaced (detached) table nodes, so clicking an image inside a markdown table no longer opened the lightbox.
This MR re-initializes the image lightbox on the re-rendered cell nodes when the table component mounts, and destroys the per-container lightbox instance on teardown.
Same root cause as the reference popover bug fixed in !247575 (merged) (follow-up to it, but independently mergeable).
Screenshots or screen recordings
| Before | After |
|---|---|
References
- Related: !247575 (merged)
- Feature flag:
editor_sticky_table_headers(default off)
How to set up and validate locally
-
Enable the feature flag:
Feature.enable(:editor_sticky_table_headers) -
Create a comment or wiki page containing a markdown table with an uploaded image in a cell, e.g.
| Image | |-------| |  | -
Click the image inside the table — the lightbox should open.
-
Verify images outside tables still open the lightbox.
MR acceptance checklist
Evaluated against the MR acceptance checklist.
Related to #593078, #585265 (closed)