Yes, @curiousdustin, that is a suspicious timeout... it is strange because the sound actually plays once (cjss && cjss.playState != "playFailed") is true (you can hear it if the volume is set to 1) and needs to be stopped so the sound can be played when desired in the app code. But then it can't seem to be played again right away.

As a temporary fix we have set a delay for Safari with HTMLAudioPlugin to 300ms as default and provide a parameter for it in the registerSound(). If anyone comes up with a better solution, we are all ears. We considered moving the test to the play() as when the poll says it is ready, it does play... but think the delay in the initial complete event is better than a delay when the play is called for most situations.

In terms of error on stopping sound, we have added a test for null entries. Each of the polled sounds is being added to the _soundInstances for that source. So now the few null sound instances from polling are ignored.

Our test file is here https://zimjs.com/test/soundsafari2.html

Here are the changes - have a look and if all seems... okay... then we can look into updating the files here.

s.registerSound = function (src, id, data, basePath, defaultPlayProps, delay) {
	var loadItem = {src: src, id: id, data:data, defaultPlayProps:defaultPlayProps};
    
    // Polling for Safari due to HTMLAudioPlugin sound not playing with "Never Auto-Play"
    // see https://github.com/CreateJS/SoundJS/issues/326
    // Dan Zen - Feb 23, 2021
    if (delay==null && s.activePlugin.toString()=="[HTMLAudioPlugin]") {
        var ua = navigator.userAgent.toLowerCase(); 
        if (ua.indexOf('safari') != -1) { 
            if (ua.indexOf('chrome') == -1) {
                delay = 300; // safari
            }
        }
    }
    
	if (src instanceof Object && src.src) {
		basePath = id;
		loadItem = src;
	}
	loadItem = createjs.LoadItem.create(loadItem);
	loadItem.path = basePath;

	if (basePath != null && !(loadItem.src instanceof Object)) {loadItem.src = basePath + loadItem.src;}

	var loader = s._registerSound(loadItem);
	if(!loader) {return false;}

	if (!s._preloadHash[loadItem.src]) { s._preloadHash[loadItem.src] = [];}
	s._preloadHash[loadItem.src].push(loadItem);
	if (s._preloadHash[loadItem.src].length == 1) {
		// OJR note this will disallow reloading a sound if loading fails or the source changes
        
        // Dan Zen - HTMLAudioPlugin Safari - or delay set
        if (delay > 0) {    
            // poll here for Safari sound and call complete or error
            var tries = 0;
            var interval = 50;
            var num = (loadItem.loadTimeout||8000)/interval;
            // events expect a target.getItem() that has a src property of the sound
            var event = {target:{getItem:function(){return loadItem;}}};
        
            function testSound() {
                tries++;
                var cjss=createjs.Sound.play(loadItem.id, {volume:0});        
                if (cjss && cjss.playState != "playFailed") {
                    clearInterval(inter);
                    cjss.stop();
                    // the sound actually plays here if we let it... but want to dispatch event
                    // can't seem to replay the sound right away on dispatch
                    setTimeout(function () {                
                        s._handleLoadComplete(event);  
                    }, delay); // default 300 for Safari with HTMLAudioPlugin                                                                 
                } else {
                    if (tries > num) this._handleLoadError(event);
                }                    
            }
            var inter = setInterval(testSound,interval);
            testSound(); // also test right away     
                 
        } else { // original event code
            
            loader.on("complete", this._handleLoadComplete, this);
        	loader.on("error", this._handleLoadError, this);
            
        }			
		s.activePlugin.preload(loader);              
	} else {
		if (s._preloadHash[loadItem.src][0] == true) {return true;}
	}

	return loadItem;
};

and then the removeSound:

p.removeSound = function (src) {
	if (!this._soundInstances[src]) { return; }
	for (var i = this._soundInstances[src].length; i--; ) {
		var item = this._soundInstances[src][i];
		if (item) item.destroy(); // Dan Zen added conditional for null polled items stored - Mar 1 2021
	}
	delete(this._soundInstances[src]);
	delete(this._audioSources[src]);
	if(this._loaders[src]) { this._loaders[src].destroy(); }
	delete(this._loaders[src]);
};

@lannymcnie has there been any more thought given to this?

I have created a Pen at https://codepen.io/mpoo/pen/oNYEZPJ showing this issue.

In the meantime is there a workaround that I can use in non-Firefox (where transform is used instead of zoom) browsers?

If the tooltip add the class flipped it not show correctly. The problem is in the value in the transform in y axis, increasing it to -115% fix the bug.

&.flipped {
	transform: translate(-50%, -100%);
	.tip {
		transform: scale(1, 1);
		order: 1;
	}
}

Is there any workaround?