Office.js displayDialogAsync error when displayInIframe: false

Question

I'm trying to display, in an outlook web add-in, a dialog from a taskpane using the displayDialogAsync function. At first, I used displayInIframe: true and everything was working wonderfully, but for some reason I needed it to display in its own page.

So I changed the options to displayInIframe: false, and that causes a prompt to open. When it opens and I click Allow, I get a JSON.parser error.

Uncaught SyntaxError: Unexpected token d in JSON at position 0 at JSON.parse (<anonymous>) at O (outlook-web-16.01.js:20:204476) at HTMLInputElement.Y.f.onclick (outlook-web-16.01.js:20:196995)

It's comming from this line: var windowName = JSON.parse(window.name);

I tried turning the prompt off using promptBeforeOpen: false, but as it says in the docs, "When this option is set to false, Office on the web will not prompt the user to allow the add-in open a dialog, and the Office dialog will not open."

I was wondering if I was missing something, or if you can't actually open a dialog outside of an iframe in a taskpane?

Here is my code:

const dialogUrl = "https://office365.localhost.com/test.html";
Office.context.ui.displayDialogAsync(
                       dialogUrl, 
                       { 
                            displayInIframe: false,
                            height: 80,
                            width: 80
                        }, 
                       (result) => {
                            //Code
                        
                       }
                });