Safari iframe hasStorageAccess, but outputs a different localStorage from it's non-iframed url

Question

I have an iframe which I'm attempting to integrate the Storage Access API on https://developer.mozilla.org/en-US/docs/Web/API/Storage_Access_API

The html for the iframe is as follows:

<iframe 
  src="https://dev.mysite.io/auth/iframe.html" 
  sandbox="allow-storage-access-by-user-activation allow-scripts allow-same-origin" 
  frameborder="0"
></iframe>

Within my iframe is the following script code:

if ("hasStorageAccess" in document) {
    console.log("Checking Access API")
    document.hasStorageAccess().then((granted) => {
        if (granted) {
            console.log(localStorage);
        } else {
            // request access code omitted
            console.log("Requires storage access request");
        }
    })
} else {
    console.log("Storage Access API not available")
}

When this script runs, it shows that access is granted, but outputs an empty localStorage.

If I follow the iframe url https://dev.mysite.io/auth/iframe.html and check localStorage, it contains all the proper items.

---

Why is the local storage different between my (await hasStorageAccess()) === true iframe, and a tab of the exact same url?