Sprite has black borders after setting scene material to transparent

Questions
,
1

I am trying to make a 360 tour using ThreeJS, and Im trying to add buttons that makes you move to the next scene.
Buttons are made using sprite and a png icon as the texture map.
I am also trying to create a transition animation as the scene changes with setting the opacity to 0 and then to 1 for the next scene.
But when enabling scene material transparency the sprite gets a black background.
The black backgrounds goes away when scene material transparency is set to false.
I have also tried to create a circular shape with html canvas but I get the same result.
Images to describe the problem:
Sprite with scene material transparency = true
Sprite with scene material transparency = false
Here is the relevant piece of code:

//Scene and camera
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera( 80, window.innerWidth / window.innerHeight, 0.1, 200 );

//Scene material
const geometry = new THREE.SphereGeometry( 15, 32, 16 );
const texture = new THREE.TextureLoader().load("src/360.jpg");
texture.wrapS = THREE.RepeatWrapping;
texture.repeat.x = -1;
const material = new THREE.MeshBasicMaterial( { map: texture, side: THREE.DoubleSide, transparent : false } );
material.opacity = 1;
const sphere = new THREE.Mesh( geometry, material );
scene.add( sphere );

//Renderer
const renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );

//Control
const controls = new THREE.OrbitControls(camera, renderer.domElement);
controls.rotateSpeed = 0.2;
controls.enableZoom = false;
camera.position.set(0.1,0,0);
controls.update();

//tooltip
const SpriteMap = new THREE.TextureLoader().load( 'src/sprite.png' );
const SpriteMaterial = new THREE.SpriteMaterial( { map: SpriteMap } );
const sprite = new THREE.Sprite( SpriteMaterial );
const position = new THREE.Vector3(3,0,0);
sprite.position.copy(position);
scene.add( sprite );

function animate() {
    requestAnimationFrame( animate );
    renderer.render( scene, camera );
}
animate();