While attempting to understand es6 module nuances, this resource specifically states that in the following example the global event will fail to trigger the listener, and suggests that an “export” is required. However, when tested, the handler does respond to the event.
Also, my understanding is that due to the module’s context, the event shouldn’t be accessible by the module.
What might I be misunderstanding?
main.js
<!DOCTYPE html>
<html>
<body>
<button id="myButton">Click me</button>
<script src="module.js" type="module"></script>
</body>
</html>
module.js
const button = document.getElementById('myButton');
button.addEventListener('click', () => {
console.log('Button clicked!');
});