Google One Tap doesn't work on mobile Chrome

Question

I've implemented the Google one tap signin for web using the documentation here, and it works fine on desktop Chrome. However, it doesn't show up at all on iOS Chrome (verison 87) even though I'm signed into Google and the domain is whitelisted.

How do I fix this?

function initialize_google()
{
    google.accounts.id.initialize({
      client_id: "255011972792-vfp8t4dc4js9perda7aq3f2s6ckjr4p8.apps.googleusercontent.com",
      callback: function(credentials) { console.log(credentials) },
      context: 'signin',
      prompt_parent_id: "g_id_onload"
    });
}

function loadScript(url, callback)
{
    console.log('in loadScript with url:' + url);
    // Adding the script tag to the head as suggested before
    var head = document.getElementsByTagName('head')[0];
    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = url;

    // Then bind the event to the callback function.
    // There are several events for cross browser compatibility.
    script.onreadystatechange = callback;
    script.onload = callback;

    // Fire the loading
    head.appendChild(script);
}

loadScript("https://accounts.google.com/gsi/client", initialize_google);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h1>Demo</h1>
<div id='g_id_onload'></div>