Ayuda, al hacer click derecho me cambia a verde pero no en rojo

Esto te sucede porque cada vez que haces click derecho se ejecuta la función Alterar color, ésta internamente tiene un ciclo for que recorre el arreglo de colores, pero el ciclo for se esta ejecutando por completo y recorre todo el arreglo de colores, es decir se esta reescribiendo de la siguiente manera:

cuando i = 0; entonces pincel.fillStyle aplica blue,

cuando i = 1; entonces pincel.fillStyle aplica red y por ultimo,

cuando i = 2; entonces pincel.fillStyle aplica green y ese es el color que finalmente vemos por que alli termina el ciclo.

Modifique un poco el codigo que tenias, y me funciono asi:

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

<script>
    var pantalla = document.querySelector("canvas");
    var pincel = pantalla.getContext("2d");
    pincel.fillStyle = "grey";
    pincel.fillRect(0,0,600,400);

    var i = 0;                                                                            
    var colores = ["blue","red","green"];

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

        pincel.fillStyle = colores[i];                    // va cambiando de color según el valor de i, inicia con el color "blue"  porque i esta inicializada a cero
        pincel.beginPath();
        pincel.arc(x,y,10,0,2*3.14);
        pincel.fill();
        console.log(x + "," + y);
    }


    function alterarColor(){

        i = i + 1;
        if (i == colores.length) {   //Cuando sea i = 3 entonces se cumple la condición y se inicializa a cero nuevamente.
            i = 0;
        }

    }

    pantalla.onclick = dibujarCirculo;
    pantalla.oncontextmenu = alterarColor;

</script>