VERY frustrating experience!
After at least a good 100 variations, based on many examples, I let my intuition push me (after seeing a hint of a possible race condition) to try a forced-delay on the focus assignment and ... Voilà! SUCCESS !!!
It didn't seem necessary, but for the sake of discipline, I made the change from
<script src="test.js"></script>
to
<script src="test.js" type="text/javascript" ></script>
The "fix" was inserting one of the following code segments at the end of the JavaScript file (depends on your preference as to method, they both work):
setTimeout(
function open(event){
var inputBox = document.getElementById("popup_input_text") ;
inputBox.focus() ;
inputBox.scrollIntoView() ;
},
// this value controls the delay before popup is displayed
300
) ;
or
setTimeout(
function open(event){
var inputBox = document.querySelector("#popup_input_text") ;
inputBox.focus() ;
inputBox.scrollIntoView() ;
},
// this value controls the delay before popup is displayed
300
) ;
I guess that confirms the existence of that "race" condition as to the element not being created when the auto-focus assignment was being attempted ... but ... it still doesn't explain why the "autofocus" property in the element did NOT have the expected effect!