Web Audio API Pitch - Firefox vs Chrome

[Heretic86]

I am playing around with the Web Audio API now.

I set up a test application to play back an audio file.  One of my desired options (at least currently) is to shift the pitch.  An easy way to do this is to adjust the playbackRate property.  So, it seems to work fine in Chrome and Firefox.  Great, lets make it awesomer!  Is that a word?  I call to preservePitch elsewhere in the code.

I threw in the following code for a Canvas Spectrum Analyzer, which works great:

    function graphAnimator(){
      requestAnimationFrame(graphAnimator);
      let fbc_array = new Uint8Array(analyzer.frequencyBinCount);
      analyzer.getByteFrequencyData(fbc_array);
      ctx.clearRect(0, 0, graph.width, graph.height);
      ctx.fillStyle = "#00FFAA";
      for (let i = 0; i < 100; i++){
        let x = i * 3;
        let h = -(fbc_array[i * 8] / 12);
        ctx.fillRect(x, 20, 2, h);
      }
    }
    
    function setupGraph(){
      graph.width = 222;
      graph.height = 20;
      ctx = graph.getContext('2d');
      aCtx = new window.AudioContext();
      analyzer = aCtx.createAnalyser();
      audio_source = aCtx.createMediaElementSource(audio);
      audio_source.connect(analyzer);
      analyzer.connect(aCtx.destination);
      graphAnimator();
    }

Now, once I do this, and I grab my slider and play with it (ok, that sounded better in my head just now) to adjust the Playback Rate, it works in Chrome but not in Firefox?

Honestly I love the Spectrum Analyzer Canvas more than the rest of what I have so I am open to scrapping that stuff because I would rather be able to adjust the Pitch without having to adjust the Playback Rate.  Ive seen a few scripts out there that can do that, but Im pretty well clueless on how to get them set up!  Essentially, a Slider (Range) and adjust the Pitch without messing with the Playback Rate.  I really want to dump the Playback rate and strictly ONLY adjust a Pitch.

Any suggestions / samples to adjust the Pitch of a MP3 / Ogg / Oga file without needing to revert to adjusting the Playback Rate consistently on every browser?  (Well... except Internut Exploder)...

Edited April 15, 2021 by Heretic86

[Heretic86]

How do I implement both Analyzer and set playbackRate in Firefox which works in Chrome?

[Heretic86]

Really?  No one?

Is this perhaps a bug in Firefox itself?