Branca colormap caption with apostrophe makes map does not show

[iladan0]

Describe the bug
When the caption of the colormap contains an apostrophe, the folium map does not show (I get a white rectangle)

To Reproduce

mymap= folium.Map(tiles = "Stamen Toner")

colormap = branca.colormap.LinearColormap(['red','yellow', 'green'], vmin=0.0, vmax=5.0)
colormap.caption = "Agency's rating"
colormap.add_to(mymap)

mymap

Expected behavior
The expected behavior is to get a folium map with red to green colormap having the caption "Agency's rating" but i got a white rectangle

Environment (please complete the following information):

• Browser chrome and edge
• Jupyter lab
• Python version 3.9.10
• folium version 0.12.1.post1
• branca version 0.4.2

Additional context
The code works perfectly fine if the caption does not have an apostrophe.

Possible solutions
List any solutions you may have come up with.

folium is maintained by volunteers. Can you help making a fix for this issue?

[Conengmo]

Thanks for the report! This is indeed an issue in branca's colormap functionality.

Looking into it very shortly, the issue seems to be in https://github.com/python-visualization/branca/blob/master/branca/templates/color_scale.js. My first intuition is to use Jinja2's tojson filter, which we use throughout folium already for the same purpose.