title: React hooks object update gets strange behaviour on Safari browser
body: <p>React hooks object update gets strange behaviour on Safari browser(only on Safari browser)</p>
  
  <pre><code>const [state, setState] = React.useState({
    show_welcome: true,
    show_inline: false,
    restriction: false,
    request_dp: false,
    prevent_rtl: false,
    lang: "ta"
  });
  </code></pre>
  
  <p><strong>setState</strong></p>
  
  <pre><code>const handleToggle = ({ target }) =&gt; {
    setState(s =&gt; ({ ...s, [target.name]: !s[target.name] }));
  };
  </code></pre>
  
  <p>Is there anything break the order of object for Safari browser </p>
  
  <p><a href="https://i.stack.imgur.com/lemU8.gif" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/lemU8.gif" alt="React hooks object update gets strange behaviour on Safari browser"></a></p>
  
  <p><a href="https://codesandbox.io/s/infallible-keldysh-uolgt?fontsize=14&amp;theme=dark&amp;view=preview" rel="nofollow noreferrer"><img src="https://codesandbox.io/static/img/play-codesandbox.svg" alt="Edit infallible-keldysh-uolgt"></a></p>