Owasp issue with inline styles and CSP with no unsafe-hashes

[refamila]

Hello, Using react-apexchart and adding a Content-Security-Policy header I get errors in console. Error: Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'self' fonts.googleapis.com 'sha256-0LPZoaUlRg6skhVDAsOXJDYd0QywFnns8TclTlStHUs=' ". Either the 'unsafe-inline' keyword, a hash ('sha256-0LPZoaUlRg6skhVDAsOXJDYd0QywFnns8TclTlStHUs='), or a nonce ('nonce-...') is required to enable inline execution. Note that hashes do not apply to event handlers, style attributes and javascript: navigations unless the 'unsafe-hashes' keyword is present.

I get the "Refused to apply inline style..." error in the console pointing to apexcharts.common.js (even if I add the sha-256 that the error is showing) . This error is not shown if I add 'unsafe-hashes' to the csp but that doesn't pass owasp health check.

I have the last version both of react-apexcharts (1.4.0) and apexcharts (3.40.0) libraries

I have this CSP in my app:

<meta http-equiv="Content-Security-Policy"  
       content="style-src 'self' fonts.googleapis.com  'sha256-0LPZoaUlRg6skhVDAsOXJDYd0QywFnns8TclTlStHUs=' ;"/>

And this sample chart:

 import React from 'react';
import ReactApexChart from 'react-apexcharts';

function Home() {
   // Datos del gráfico
   const chartData = {
    options: {
      // Opciones de configuración del gráfico
      chart: {
        id: 'basic-bar'
      },
      xaxis: {
        categories: ['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio']
      }
    },
    series: [
      {
        name: 'Ventas',
        data: [30, 40, 35, 50, 49, 60, 70]
      }
    ]
  };
  return (
    <React.Fragment>
    <h1>Gráfico de Ventas</h1>
      <ReactApexChart
        options={chartData.options}
        series={chartData.series}
        type="bar"
        height={350}
      />
      </React.Fragment>
  );
}

export default Home;

Maybe this issue is related : https://github.com/apexcharts/apexcharts.js/issues/727

Thanks for your help.

[refamila]

@junedchhipa the above PR fixes the csp console error. Thanks!

[ighunter]

We are also affected by this issue - thank you for the fix @refamila!

@junedchhipa I see you have approved & merged the PR, but there has been no release since then. When could we hope to have a new version? :pray:

[refamila]

Sorry for delay on closing it. Fixed in https://github.com/apexcharts/apexcharts.js/releases/tag/v3.41.1