Fix draw support for folium >= 0.15 (#162)

* Fix draw support for folium >= 0.15

* Bump version

setup.py

@@ -2,7 +2,7 @@
 
 setuptools.setup(
     name="streamlit_folium",
-    version="0.17.2",
+    version="0.17.3",
     author="Randy Zwitch",
     author_email="[email protected]",
     description="Render Folium objects in Streamlit",

streamlit_folium/__init__.py

@@ -132,6 +132,9 @@ def _get_map_string(fig: folium.Map) -> str:
     # Get rid of the annoying popup
     leaflet = leaflet.replace("alert(coords);", "")
 
+    # Rename drawnItems
+    leaflet = leaflet.replace("drawnItems_draw_control_div_1", "drawnItems")
+
     leaflet = dedent(leaflet)
 
     if "drawnItems" not in leaflet:

streamlit_folium/frontend/src/index.tsx

@@ -1,4 +1,4 @@
-import { Streamlit, RenderData } from "streamlit-component-lib"
+import { RenderData, Streamlit } from "streamlit-component-lib"
 import { debounce } from "underscore"
 import { circleToPolygon } from "./circle-to-polygon"
 

tests/test_frontend.py

@@ -91,6 +91,22 @@ def test_draw(page: Page):
         'internal:attr=[title="streamlit_folium.st_folium"i]'
     ).get_by_role("link", name="Draw a polygon").click()
 
+    # Should be no drawings
+    expect(page.get_by_text('"all_drawings":NULL')).to_be_visible()
+
+    page.frame_locator('iframe[title="streamlit_folium\\.st_folium"]').get_by_role(
+        "link", name="Draw a marker"
+    ).click()
+    page.frame_locator('iframe[title="streamlit_folium\\.st_folium"]').locator(
+        ".leaflet-marker-icon"
+    ).first.click()
+    page.frame_locator('iframe[title="streamlit_folium\\.st_folium"]').locator(
+        "#map_div"
+    ).click()
+
+    # Should be one item in drawings after having placed a marker
+    expect(page.get_by_text('"all_drawings":NULL')).to_be_hidden()
+
 
 def test_limit_data(page: Page):
     # Test limit data support

tests/test_package.py

@@ -50,11 +50,11 @@ def test_draw_support():
     map.render()
     leaflet = _get_map_string(map)
     assert "map_div.on(L.Draw.Event.CREATED, function(e) {" in leaflet
-    assert "drawnItems_draw_control_div_1.addLayer(layer);" in leaflet
+    assert "drawnItems.addLayer(layer);" in leaflet
 
     assert (
         """map_div.on('draw:created', function(e) {
-    drawnItems_draw_control_div_1.addLayer(e.layer);
+    drawnItems.addLayer(e.layer);
 });"""
         in leaflet
     )