Code Panel: weird syntax highlighting

[jamessspanggg]

Link to reproduce

[Tejas2805]

Based on my investigation its looks like, hljs is picking it up as regex and that's why the wrong highlighting.

UPDATE: This is a bug in highlight.js and happens because it's picking up the code as regex. I have tried the latest released version (v9.18.1), but it's still not fixed. They plan to release it in v10.0

[jamessspanggg]

@Tejas2805 I've looked into it and I think the issue is because -

``${(pos - offset) * 100 / base}%`; is an ES6 way for string interpolation, while the code highlighted is based on javascript instead of ES6:

Have tried switching to interpret it as ES6 and it highlights correctly:

Update: I think my investigation is wrong, ES6 syntax is supported in hljs javascript

[gerhean]

UPDATE: This is a bug in highlight.js and happens because it's picking up the code as regex. I have tried the latest released version (v9.18.1), but it's still not fixed. They plan to release it in v10.0

The latest Highlight.js is at v10.7.1, so can be fixed easily. However the code given in Link to reproduce does not exist anymore so can't really test.

[dcshzj]

You can reproduce this by specifying the date range to generate the report:

gradlew run -Dargs="--since d1 --until 16/03/2020"
gradlew run -Dargs="--view ./reposense-report"

Click on the Code Panel for Metta (ongspxm) to see the weird syntax highlighting.

[gerhean]

Fixed by v10.7.1

Will be doing PR soon.