Var tamanho

Olá Samantha, tudo bem ? Na minha visão o código está bom. Eu só me atentaria em alguns detalhes na parte da indentação, a única coisa que eu faria diferente era retirar essa parte da linha desenhaQuadrado(150, y, tamanho, 'white'); para fora do for. No meu entendimento como você não utiliza o x nessa parte do seu for não vejo necessidade de colocar no for, pois a cada "passada" no for ele está desenhando no mesmo lugar e colocando para fora do for ele irá desenhar apenas uma vez.

<canvas width="200" height="300"></canvas>

<script>

    function desenhaQuadrado(x, y, tamanho, cor) {

        var tela = document.querySelector('canvas');
        var pincel = tela.getContext('2d');

        pincel.fillStyle = cor;
        pincel.fillRect(x, y, tamanho, tamanho);
        pincel.strokeStyle = 'black';
        pincel.strokeRect(x, y, tamanho, tamanho);

    }
    function desenhaTexto(texto, x , y) {
        var tela = document.querySelector('canvas');
        var pincel = tela.getContext('2d');

        pincel.font='20px Georgia';
        pincel.fillStyle='black';
        pincel.fillText(texto, x, y);    
    }

    desenhaTexto("Qual é a fração?", 0, 20);

    var y = 30;
    var tamanho = 50;

    for(var x = 0; x < 150; x = x + 50) {
        desenhaQuadrado(x, y, tamanho, 'green');
    }
        desenhaQuadrado(150, y, tamanho, 'white');

</script>

Espero ter ajudado em algo :)