O meu Raio circulo não esta mudando

E o meu condigo o raio não aumenta " if(evento.shiftkey){ raioCirculo=30; }else{ raioCirculo=10; }" , o a mudança de cor não fica no azul, fica no vermelho e no verde em todos os navegadores, no google chrome não funciona por exemplo, so no navegador Microsoft edge a função "mudarcor" funciona perfeitamente.

<meta charset="UTF-8">

<canvas width="600" height="400"></canvas>

<script>
       var tela= document.querySelector("canvas");
       var pincel= tela.getContext("2d");

       pincel.fillStyle="grey";
       pincel.fillRect(0, 0, 600, 400);


   var cores=  ["blue,", "red", "green"];
   var corAtual = 0;
   var raioCirculo=10;

function exibeCirculo(evento){
    var x = evento.pageX - tela.offsetLeft;
    var y = evento.pageY - tela.offsetTop;

     if(evento.shiftkey){
     raioCirculo=30;
 }else{
     raioCirculo=10;
 }

     pincel.fillStyle = cores[corAtual];
     pincel.beginPath();
     pincel.arc(x, y, raioCirculo, 0, 2*3.14);
     pincel.fill();
      console.log(x + "," + y);
}


  tela.onclick = exibeCirculo;

function mudaCor() {

corAtual++;


   if  (corAtual>cores.length){
         corAtual=0;
     }

 while(corAtual>2){
      if(corAtual != 1){
         corAtual=0;
         break;
      }

      if (corAtual == 1){   
        break;
      }
  }
        alert('Funcionou!');
        return false;
    }

    tela.oncontextmenu = mudaCor;






</script>

`