You immediately call main() in mandelbrot.js before the page is fully loaded.. You could be getting null references to DOM elements that have not been loaded/initialized yet by the browser. Note that canvas elements always return null in getElementById or querySelector calls before the onload/DOMContentLoaded events.
Keep in mind the browser is still parsing the html/scripts (never mind loading external files, like mandelbrot.js). Nothing has been presented to the user, even if you put the script at the bottom of the html.
fix:
wait till the page has fully loaded.
modify the onload event to start rendering (you are already doing it with focusOnSubmit)
or switch out your call to main with this:
document.addEventListener('DOMContentLoaded', main);
You immediately call main() in mandelbrot.js before the page is fully loaded.. You could be getting null references to DOM elements that have not been loaded/initialized yet by the browser. Note that canvas elements always return null in getElementById or querySelector calls before the onload/DOMContentLoaded events.
Keep in mind the browser is still parsing the html/scripts (never mind loading external files, like mandelbrot.js). Nothing has been presented to the user, even if you put the script at the bottom of the html.
fix:
wait till the page has fully loaded.
modify the onload event to start rendering (you are already doing it with focusOnSubmit) or switch out your call to main with this:
document.addEventListener('DOMContentLoaded', main);