Add source viewer component
What does this MR do and why?
Changes in this MR is part of bigger efforts to refactor the blob viewers and Highlight source code syntax on the frontend using HighlightJS.
This MR adds a source viewer component and uses highlight.js
to highlight the source on the frontend when viewing source code.
:refactor_blob_viewer
and :highlight_js
feature flags.
Here is what we plan to deliver during this milestone behind the highlight_js
feature flag:
task | MR |
---|---|
Add the highlight.js dependency | !76343 (merged) |
Use highlight.js to highlight source code | this MR |
Ensure highlighted source files matches one of the GitLab themes (white) | follow-up |
Screenshot
How to set up and validate locally
- Enable the Blob Viewer Refactor feature flag
Feature.enable(:refactor_blob_viewer)
- Enable the HighlightJS feature flag
Feature.enable(:highlight_js)
- Open a source file
MR acceptance checklist
This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.
-
I have evaluated the MR acceptance checklist for this MR.
Related to #345806 (closed)
Edited by Jacques Erasmus