Using the below example. The const element test_el is null because the DOM content isn't loaded yet. So test() raises an error.
Wrapping the const definition in a onload event doesn't seem to work as its now now in the same scope as the function.
Whats the correct method of achieveing this - I know I can add the const within the function but it needs to be reused over multiple functions (not in this example)
main.js
import {test} from "../import.js"
window.addEventListner("load", ()=>{
test()
})
import.js
const test_el = document.getElementById("test_div")
export function test(){
console.log(test_el.innerText)
}
// you can call
// all the tests that are dependent of `test_el` from one parent function
// after getting value of `test_el`
export function runTests() {
const test_el = document.getElementById("test_div");
if(test_el) {
firstTest(test_el)
secondTest(test_el)
} else {
throw new Error('Element not found.')
}
}
function firstTest(element){
assert(element.innerText.equal('someText'))
}
function secondTest(element){
assert(element.classList.includes('someClass'))
}