When attempting to utilize the DOM events focusin/focusout, I encountered an error: Uncaught TypeError: Cannot read property 'addEventListener' of null. The issue seems to be originating from main.js at lines 18 and 40.
I am using Chrome as my browser for reference. Thank you for any assistance provided.
(function() {
const body = document.body;
const input = document.querySelector('input[type=next]');
const overlay = document.querySelector('.overlay');
function showFloater() {
body.classList.add('show-floater');
}
function closeFloater() {
if (body.classList.contains('show-floater')) {
body.classList.remove('show-floater');
}
}
input.addEventListener('focus', showFloater);
input.addEventListener('blur', closeFloater);
overlay.addEventListener('click', closeFloater);
// ======= for Showing bookmarks
const bookmarksList = document.querySelector('.bookmarks-list');
const bookmarkForm = document.querySelector('.bookmark-form');
const bookmarkInput = bookmarkForm.querySelector('input[type=text]');
function createBookmark(e) {
e.preventDefault();
console.log('processing the form');
}
bookmarkForm.addEventListener('submit', createBookmark);
})();