Resolve "Update preview when selecting a new template"
What does this MR do?
Updates the markdown preview in the Issue and Merge Request description editors when the user changes the description's template using the "Choose a template" dropdown.
Implementation approach
I've tried to maintain a minimal footprint in the source code for this bug fix. The first reason behind this is that I noticed two implementations of the markdown-editor
component used in the issue and merge request pages: One implemented in Vue and another using jQuery. I assumed that pages using the jQuery implementation will eventually transition to Vue's hence it's not worth making significant changes. The other reason is to avoid creating a MR with too many changes.
I added a content
property to the markdown-editor
component in order to refresh the markdown preview when the editor's content changes. This is not the approach I prefer but it is the least dramatic change I could think of that didn't require to change the component's data-flow design. Currently, this component picks the content it renders from the DOM and is aware of the content embedded in its slot
placeholder which is not a good practice.
Testing approach
I implemented two feature tests to catch the regressions. Even though GitLab encourages to avoid adding new feature tests as much as possible, I found too complex — for my experience with the source code — to test the interaction between the template selector and the markdown preview editor because some of these components are too tied to the DOM. If I get some mentorship about how to write an integration test, I would do it.
I also wrote some unit tests for the changes I made in the template selector and markdown-editor components.
What are the relevant issue numbers?
Fixes #21656 (moved)
Does this MR meet the acceptance criteria?
-
Changelog entry added, if necessary -
Documentation created/updated via this MR -
Documentation reviewed by technical writer or follow-up review issue created -
Tests added for this feature/bug -
Tested in all supported browsers -
Conforms to the code review guidelines -
Conforms to the merge request performance guidelines -
Conforms to the style guides -
Conforms to the database guides -
Link to e2e tests MR added if this MR has Requires e2e tests label. See the Test Planning Process. -
Security reports checked/validated by reviewer