I use the following code to reveal the dialog. In MacOS Word 365 desktop, the dialog is revealed and works as documented:
let dialog;
function openDialog(url, successUrl) {
Office.onReady((info) => {
if (info.host === Office.HostType.Word) {
console.log(info);
Office.context.ui.displayDialogAsync(
url,
{ height: 50, width: 30, displayInIframe: false }, // size of the dialog box
(res) => {
console.log(JSON.stringify(res));
if (res.status === Office.AsyncResultStatus.Succeeded) {
console.log("Display dialog separate window");
dialog = res.value; // set the dialog variable declared earlier
dialog.addEventHandler(
Office.EventType.DialogMessageReceived,
(arg) => {
dialog.close();
const { message } = arg; // we want the string "true"
if (message === "true") {
window.location.replace(successUrl);
}
}
);
}
}
);
}
});
}
When using the same code with the same manifest.xml (sideloaded into office for the web for both Chrome and Edge), instead of the prompt (that checks for popup-blockers) appearing in the main window.... it appears in the taskpane:
And on clicking on allow, a brief dialog box appears but vanishes immediately. The following logs appear in the console (per the code above:
{"value":{},"status":"succeeded"}
Display dialog separate window
As mentioned, the same code above already works in MacOS 365 but fails in office for the web.
EDIT 1: The dialog properly shows up as a separate window within the Mac Word client and the functions related to the dialog opening and closing work per the documentation.
EDIT 2: Narrowed down the issue to the <script>link-to-office-js</script> within the dialog url causing the vanishing the dialog. See minimal scriptlab implementation and issue raised in Github