React Highchart: How set the "accessibility.enabled" option to false

Question

I have this error in console:

Highcharts warning: Consider including the "accessibility.js" module to make your chart more usable for people with disabilities. Set the "accessibility.enabled" option to false to remove this warning. See https://www.highcharts.com/docs/accessibility/accessibility-module.

Cannot find in documentation where Set the "accessibility.enabled" option to false.

This is the option that I pass to component:

const optionNUsersPerService = {
        chart: {
            plotBackgroundColor: null,
            plotBorderWidth: null,
            plotShadow: false,
            type: 'pie'
        },
        title: {
            text: 'Utenti per servizio'
        },
        tooltip: {
            pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
        },
        accessibility: {
            point: {
                valueSuffix: '%'
            }
        },
        plotOptions: {
            pie: {
                allowPointSelect: true,
                cursor: 'pointer',
                dataLabels: {
                    enabled: true,
                    format: '<b>{point.name}</b>: {point.percentage:.1f} %'
                }
            }
        },
        series: [{
            name: 'Utenti',
            colorByPoint: true,
            data: getDataUsersPerService(props.items)
        }]
    }

And this is the component:

return (
        <HighchartsReact
            highcharts={Highcharts}
            options={currentOptions}
            immutable={true}
            callback={props.callback}
        />
    );

Answer 1

The warning has been added since Highcharts v10.1.0 (2022-04-29)

Changelog: https://www.highcharts.com/blog/changelog/

To disable accessibility, set:

  accessibility: {
    enabled: false
  }

---

Live demo: http://jsfiddle.net/BlackLabel/mvnjskqr/

API Reference: https://api.highcharts.com/highcharts/accessibility.enabled

Answer 2

I don't advise that you disable accessibility for your charts, it will make them inaccessible to users with disabilities that rely on a keyboard and voice over software like NVDA, JAWS, VoiceOver etc.

An alternative way to get rid of this warning is to simply import the Accessibility module.

import Highcharts from "highcharts";
import HighchartsReact from "highcharts-react-official";
import { useEffect, useState } from "react";

require("highcharts/modules/accessibility")(Highcharts);

Ref: https://github.com/highcharts/highcharts-react#how-to-add-a-module

Ref: https://github.com/highcharts/highcharts-react/issues/141