Использование WaveSurfer.js v2 в компоненте React

Я пытаюсь использовать WaveSurfer.js (версия 2) с React. Я знаю, что для версии 1 была библиотека под названием response-wavesurfer, но я действительно хочу сделать это с помощью v2. Я уже сталкивался с этим без React. Итак, я только что сделал свой компонент.

Как вы можете видеть в приведенном ниже коде, все работает отлично, объект WaveSurfer создается правильно в componentDidMount(), но затем, внезапно, в методе load() возникает ошибка, которую я не могу правильно понять.

Эта ошибка выдается после load(), и после ошибки, она регистрируется в консоли "Вот и происходит!" и волновое свойство состояния, как и должно быть.

Это ошибка, о которой идет речь и само по себе это ничего не значит. Это просто ошибка без трассировки стека в обфусцированной функции в наложении response-error-overlay. Вторая ошибка, DOMException, напрямую вызвана первой, и каждый раз они объединяются.

Это строка оверлея реакции-ошибки, вызывающий ошибку напрямую в /node_modules/react-error-overlay/index.js:1582, но запутанный.

// ... various imports

class Track extends Component {
    wavref = null;

    constructor(props) {
        super(props);

        let id = this.props.id;

        this.state = {
            id: id,
            wave: null
        };
    }

    load() {
        console.info(this.state.wave, this.props.audio); // this.props.audio is the correct path, and should work correctly: "../../demo.wav".
        this.state.wave.load(this.props.audio);
        console.info("There it happens!", this.state.wave);
    }

    componentDidMount() {
        let generatedWave = WaveSurfer.create({
            container: ReactDOM.findDOMNode(this.waveref),
            waveColor: this.state.color,
            progressColor: this.state.progressColor,
            plugins: [
                RegionsPlugin.create({
                    dragSelection: {
                        slop: 5
                    }
                }),
                CursorPlugin.create({})
            ]
        });

        this.setState({
            wave: generatedWave,
        }, function() {
            this.load();
        });
    }

    render() {
        return(
            <div ref = {(waveref) => this.waveref = waveref}></div>
        );
    }
}

export default Track;

Очевидно, что метод load() не загружает / не отображает реальную волну на холсте WaveSurfer и выдает эту ошибку. Я не могу понять почему, потому что он должен просто нормально работать и отображать волну на холсте WaveSurfer.

Кто-нибудь из вас знает, в чем может быть ошибка?