diff --git a/src/OpenLayers.Blazor/Map.razor.cs b/src/OpenLayers.Blazor/Map.razor.cs
index f999ae8..4f54c46 100644
--- a/src/OpenLayers.Blazor/Map.razor.cs
+++ b/src/OpenLayers.Blazor/Map.razor.cs
@@ -520,13 +520,14 @@ public async Task SetVisibleExtent(Extent extent)
     }
 
     [JSInvokable]
-    public StyleOptions OnGetShapeStyle(Internal.Shape shape)
+    public Task<StyleOptions> OnGetShapeStyle(Internal.Shape shape)
     {
 #if DEBUG
         Console.WriteLine($"OnGetShapeStyle: {JsonSerializer.Serialize(shape)}");
 #endif
 
-        return ShapeStyleCallback(new Shape(shape));
+        var result = ShapeStyleCallback(new Shape(shape));
+        return Task.FromResult(result);
     }
 
     /// <summary>
diff --git a/src/OpenLayers.Blazor/wwwroot/openlayers_interop.js b/src/OpenLayers.Blazor/wwwroot/openlayers_interop.js
index c36f034..0be6ffc 100644
--- a/src/OpenLayers.Blazor/wwwroot/openlayers_interop.js
+++ b/src/OpenLayers.Blazor/wwwroot/openlayers_interop.js
@@ -564,8 +564,8 @@ MapOL.prototype.setDrawingSettings = function(enableNewShapes, enableEditShapes,
         });
         this.currentDraw.on("drawend",
             function(evt) {
-                const style = that.getShapeStyle(evt.feature);
-                evt.feature.setStyle(style);
+                that.getShapeStyle(evt.feature)
+                    .then(style => evt.feature.setStyle(style));
             });
 
         this.Map.addInteraction(this.currentDraw);
@@ -972,11 +972,11 @@ MapOL.prototype.customImageStyle = function(marker) {
 };
 
 // Shape Style
-MapOL.prototype.getShapeStyle = function(feature) {
+MapOL.prototype.getShapeStyle = async function(feature) {
     const that = this;
 
     const shape = this.mapFeatureToShape(feature);
-    var style = this.Instance.invokeMethod("OnGetShapeStyle", shape);
+    var style = await this.Instance.InvokeMethodAsync("OnGetShapeStyle", shape);
     style = MapOL.transformNullToUndefined(style);
 
     if (feature.getGeometry().getType() == "Point") {