HTML5 Canvas no funciona en un archivo JavaScript externo

He escrito este código en JavaScript y funciona perfectamente bien cuando lo incluyo en mi página index.html:

<canvas id="bannerCanvas" width="960" height="200">
    Your browser does not support the canvas element.
</canvas>

<script type="text/javascript">

   var canvas = document.getElementById("bannerCanvas");
   var context = canvas.getContext("2d");
     context.beginPath();
     context.moveTo(25,25);
     context.lineTo(355,55);
     context.lineTo(355,125);
     context.lineTo(25,125);
     context.moveTo(465,25);
     context.fill();
};  
</script>

... sin embargo, cuando lo coloco en un archivo JavaScript externo, ¡no funcionará! En el encabezado de la página de índice, he declarado esto:

 <script type="text/javascript" src="JavaScript/functionality.js">
 </script>

Y guardo este archivo de funcionalidad en el directorio de JavaScript, he intentado hacer otras funciones de JS en este archivo para verificar que la página de índice y el JS están conectados y están ... La respuesta probablemente me está mirando a la cara, pero Por alguna razón no puedo verlo!

Cualquier ayuda es muy apreciada, gracias.

EDITAR: He estado usando Firebug y no me está dando ningún error. Cuando uso el código en la página de índice, estoy viendo la forma que quiero, pero al usar el archivo JS externo, solo estoy viendo un gran rectángulo negro.

Respuestas a la pregunta(4)

Su respuesta a la pregunta