JS Click/Focus question

HTML

<body>
    <span id="output"></span><br />
    <input type="textbox" id="input"></input>
    <label> box 2 </label>
</body>

JavaScript

var display = document.getElementById("output");
let input = document.getElementById("input");
let isOpen = false
let isClicked = false
const addText = text => display.innerHTML += text + "(" + isOpen + "), "
addText('init')

console.log(input)

input.onclick = event => {
	isClicked = true
	isOpen = !isOpen
	addText('Click')
	event.stopPropagation();
}

input.onfocus = () => {
	console.log('OnFocus', {isClicked, isOpen})
	if(!isClicked || !isOpen) {
  	isOpen = true
		addText('Focus')
  }
}

input.onblur = () => {
	console.log('OnBlur', {isClicked, isOpen})
	isOpen = false
  isClicked = false
	addText('Blur')
}