JSFiddle - React, Tailwind, and code Playground

HTML

<input type="text" id="search_string" value="Search..."/>

JavaScript

function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      func();
    };
  }
}

addLoadEvent(function() {
    document.getElementById("search_string").onfocus = search_field_focus;
});

function search_field_focus() {
	setCaretPosition("search_string", 0);
}

function setCaretPosition(elemId, caretPos) {
    var el = document.getElementById(elemId);

    el.value = el.value;
    
    if (el !== null) {

        if (el.createTextRange) {
            var range = el.createTextRange();
            range.move('character', caretPos);
            range.select();
            return true;
        }

        else {
           
            if (el.selectionStart || el.selectionStart === 0) {
                el.focus();
                el.setSelectionRange(caretPos, caretPos);
                return true;
            }

            else  {
                el.focus();
                return false;
            }
        }
    }
}