When I try to create some dragOver, dragLeave or drop event in p5 js the same error is displayed in the console:
Uncaught (in promise) TypeError: Cannot read properties of null (reading 'drop')
at setup (sketch.js:62:14)
at _setup (p5.min.js:3:431165)
at _start (p5.min.js:3:430064)
at new _ (p5.min.js:3:433993)
at p5.min.js:3:422096
This is the relevant extract of the code from sketch js:
var dropzone;
function setup() {
dropzone = select('#dropezone');
dropzone.dragOver(highlight);
dropzone.dragLeave(unhighlight);
dropzone.drop(unhighlight,gotfile);
drop(highlight,unhighlight);
}
function highlight()
{
dropzone.style('background-color','#ccc');
}
function unhighlight()
{
dropzone.style('background-color','#fff');
}
any of these drag or drop events display the same error
This is the relevant extract from html :
<html>
<head>
<script src="lib/p5.min.js"></script>
<script src="lib/p5.dom.js"></script>
<script src="sketch.js"></script>
<style>
#dropezone {
padding: 24px;
border-style: dashed;
font-size: 36pt;
width: 50%;
}
</style>
</head>
I´ve tried to use p5.js instead of p5.min.js - doesn´t help. I use Brackets sprint 14 build 1.14.2-17770 (release-1.14.2 f71f00acc) build timestamp: Tue Mar 31 2020 00:41:05 GMT-0700 and I work in MacOs Monterey 12.1 if this matter. I have the project in a local folder. What I am doing wrong? What can help?