I am not sure why I am getting this error: Uncaught ReferenceError: test is not defined. Can anybody please help me figure this out?

Here is my code for html first. I can't see where the problem is. I am not sure what the browsers (Edge and Chrome) are talking about. <canvas id="test"> Your browser does not support the canvas tag. </canvas>

<script>testCanvas(); </script>

Here is my code from my external JS file:

document.addEventListener('DOMContentLoaded',test, false); function testCanvas() { var canvas = document.getElementById("test"); var ctx = canvas.getContext("2d"); ctx.fillStyle = "#FBBE00"; ctx.fillRect(0, 0, 150, 75); }

I have searched high and low by do a lot of research on the internet and consulting my JS books but can't seem to figure out the problem. I even looked for similar problems here on Stack Overflow but they just refer to JQuery. I really need some guidance on this problem. Thank you in advance.