<div id="root"></div>

function App() {
  const [value, setValue] = React.useState("");

  return (
    <>
    select: 
      <select id="name" onChange={(e) => setValue(e.target.value)}>
        <option value="" selected disabled>名前</option>
        <option value="山田">山田</option>
        <option value="佐藤">佐藤</option>
        <option value="鈴木">鈴木</option>
      </select>

      <div>state : {value}</div>

      <a href='javascript:(function(){var a=document.getElementById("name");Object.getOwnPropertyDescriptor(window.HTMLSelectElement.prototype,"value").set.call(a,"\u5c71\u7530");a.dispatchEvent(new Event("change",{bubbles:!0}))})();'>
        Bookmarklet
      </a>
    </>
  );
}

const root = ReactDOM.createRoot(document.getElementById("root"));
root.render(<App />);