Colisão da bola com a raquete não funciona corretamente

Além da bola voltar pelo mesmo caminho que fez, ela aparentemente não colide com a raquete, não sei se o problema é o meu código, então vou deixar ele aqui em baixo. ("index.html" e "p5.collide2d.js" estão arrumadas, sem nenhuma alteração que não foi mostrada na aula.)

// variaveis da bola
let xBola = 300;
let yBola = 200;
let diametro = 19;
let raio = diametro / 2;

// variaveis da vel. bola
let velocidadeXBola = 5;
let velocidadeYBola = 5;

//variaveis da raquete
let xRaquete = 5;
let yRaquete = 150;
let larguraRaquete = 9;
let alturaRaquete = 135;

let colidiu = false;

function setup() {
  createCanvas(600, 400);
}

function draw() {
  background(0);
  mostraBola();
  movimentoBola();
  colisãoBola();
  mostraRaquete();
  movimentoDaRaquete();
  //colisãoDaRaquete();
  colisãoMinhaRaqueteBiblioteca();
}

function mostraBola() {
  circle(xBola - 6, yBola, diametro);
}

function movimentoBola() {
  xBola += velocidadeXBola;
  yBola += velocidadeYBola;
}

function colisãoBola() {
  if (xBola + raio > width || xBola - raio < 0) {
    velocidadeXBola *= -1;
  }
  if (yBola + raio > height || yBola - raio < 0) {
    velocidadeYBola *= -1;
  }
}

function mostraRaquete() {
  rect(xRaquete, yRaquete, larguraRaquete, alturaRaquete);
}

function movimentoDaRaquete() {
  if (keyIsDown(UP_ARROW)) {
    yRaquete -= 5;
  }
  if (keyIsDown(DOWN_ARROW)) {
    yRaquete += 5;
  }
}

function colisãoDaRaquete() {
  if (
    xBola - raio < xRaquete + larguraRaquete &&
    yBola - raio < yRaquete + alturaRaquete &&
    yBola - raio > yRaquete
  ) {
    velocidadeXBola *= -1;
  }
}

function colisãoMinhaRaqueteBiblioteca() {
  colidiu = collideRectCircle(
    xRaquete,
    yRaquete,
    larguraRaquete,
    alturaRaquete,
    xBola,
    yBola,
    raio
  );
  if (colidiu) {
    velocidadeYBola *= -1;
  }
}