Can someone explain this JS behavior?
When inside of IIFE, a statement like
document.body.appendChild(s_host) wouldn’t work without a semi-colon
Having an error of Uncaught TypeError: document.body.appendChild(…) is not a function
And when I put a semi-colon after the statement but do not with my IIFE inside,
It will produce Uncaught TypeError: (intermediate value)(intermediate value)(intermediate value)(intermediate value)(intermediate value)(…) is not a function
The unexpected behavior
(() => {
const s_host = document.createElement("div")
const s_root = s_host.attachShadow({ mode: 'closed' })
document.body.appendChild(s_host)
// Uncaught TypeError: document.body.appendChild(...) is not a function
// Button for clear storage
(() => {
let storage = chrome.storage.local
const clear_button = document.createElement("button")
clear_button.setAttribute("style",
` position: fixed;
top: 0;
right: 0;
height: 20px;
width: 40px;
background-color: green;
border: 1px solid black;
`)
clear_button.addEventListener("click", () => {
storage.get(null, data => {
console.log("Storage before clearing: ")
console.log(data)
storage.clear(() => {
if(chrome.runtime.lastError){
console.error("Storage has not been cleared", chrome.runtime.lastError)
} else {
storage.get(null, data => console.log("Storage successfully cleared: ", data))
}
})
})
})
s_root.appendChild(clear_button)
})()
Uncaught TypeError: (intermediate value)(intermediate value)(intermediate value)(intermediate value)(intermediate value)(...) is not a function
Otherwise, it’s working well. I’m just curious and I think this is the right place to ask.