apexcharts / Blazor-ApexCharts

A blazor wrapper for ApexCharts.js
https://apexcharts.github.io/Blazor-ApexCharts
MIT License
803 stars 92 forks source link

Add custom JsonConverters to ensure that JS function strings are evaluated into function when deserialized by JS #453

Closed SparkyTD closed 5 months ago

SparkyTD commented 5 months ago

Summary

This PR adds two custom JsonConverters to handle the serialization of function strings/arrays. Every property that represents a function or a CustomFunction will be serialized as a JSON object like the following:

someApexFunction: {
    "@eval": "function (arg1, arg2, ...) {...}"
}

Or in the case of a CustomFunction with multiple values:

someApexMultiFunction: {
    "@eval": [
        "function (arg1, arg2, ...) {...}",
        "function (arg1, arg2, ...) {...}",
        ...
    ]
}

This way, the client side deserialization logic can simply check if a JSON property's value is an object that contains the @eval key, and apply the function evaluations appropriately. This way there is no need to hard-code function names in the deserializer logic to check what needs to be evaluated.

To mark a string property in the data model as a function, simply add the [JsonConverter(typeof(FunctionStringConverter))] attribute to it. In case of CustomFunction properties, use [JsonConverter(typeof(FunctionValueOrListConverterConverter))].

Things to consider

Is there any way this can break existing functionality?

Since this PR includes changes in the JS code, some browsers might load a cached version of the previous blazor-apexcharts.js file, which will lead to an incompatibility unless the user force-reloads the page. One possible solution is to bake the current commit hash into the path of the js file (e.g. var javascriptPath = $".../blazor-apexcharts.js?hash={commitHash}"). The commit-hash can be obtained at build time using the GitInfo package.