Dialog viewport is cut off when width is small in RTL language

[SharonCKC]

Your Environment

• Platform [PC desktop, Mac, iOS, Office on the web]: PC desktop
• Host [Excel, Word, PowerPoint, etc.]: Excel

Expected behavior

The content of the dialog should occupy the entire width of the dialog.

Current behavior

There is a space on the left in the dialog.

Steps to reproduce

1. Change the language of Excel on Windows to Hebrew or Arabic.
2. Open some content in a dialog with width option set to 35, using the Dialog API.

Provide additional details

Script Lab example:

name: Basic API call (TypeScript) description: Performs a basic Excel API call using TypeScript. host: EXCEL api_set: {} script: content: | $("#run").click(() => tryCatch(run));

async function run() {
  await Excel.run(async (context) => {
    Office.context.ui.displayDialogAsync(
      location.href,
      { width: 35, height: 50, promptBeforeOpen: false },
      (asyncResult) => {}
    );
  });
}

/** Default helper for invoking an action and handling errors. */
async function tryCatch(callback) {
  try {
    await callback();
  } catch (error) {
    // Note: In a production add-in, you'd want to notify the user through your add-in's UI.
    console.error(error);
  }
}

language: typescript template: content: "<section class=\"ms-font-m\">\n\t<p class=\"ms-font-m\">This sample demonstrates basic Excel API calls.

\n\n\n<section class=\"samples ms-font-m\">\n\t

Try it out

\n\t<button id=\"run\" class=\"ms-Button\">\n <span class=\"ms-Button-label\">Open dialog\n \n" language: html style: content: |- section.samples { margin-top: 20px; }

section.samples .ms-Button, section.setup .ms-Button {
    display: block;
    margin-bottom: 5px;
    margin-left: 20px;
    min-width: 80px;
}

language: css libraries: | https://appsforoffice.microsoft.com/lib/1/hosted/office.js @types/office-js

office-ui-fabric-js@1.4.0/dist/css/fabric.min.css office-ui-fabric-js@1.4.0/dist/css/fabric.components.min.css

core-js@2.4.1/client/core.min.js @types/core-js

jquery@3.1.1 @types/jquery@3.3.1

[ghost]

Thank you for letting us know about this issue. We will take a look shortly. Thanks.

[SiruiSun-MSFT]

Hi @SharonCKC , Sorry for the late response. I tried the steps you give and can repro the issue. We open a new bug(#7795590) to track this issue. Will update here if there have any progress. Thanks for reporting this issue!

[SiruiSun-MSFT]

Hi @SharonCKC, Recently, we have a related fix that has been rolled out to Prod. According to our validation, this issue has been resolved. Could you please help us verify it from your side? Looking forward to your feedback! Thanks for your waiting here!

[SharonCKC]

Hi @SiruiSun-MSFT, thank you for following up. On version 16.0.17328, we are still able to see the problem. Could you please let us know which Excel version the fix was rolled out to?

[SiruiSun-MSFT]

@SharonCKC, Thanks for your feedback! Our test environment is under Version2404(Build 17531.20080), which looks like a few versions ahead of yours. Could you update your version and try again?

[shanshanzheng-dev]

Hi @SharonCKC, hope you have a good day. Are you still repro this issue? If not, we will close this issue. Thanks.

[SharonCKC]

Hello @shanshanzheng-dev, we are currently at version 16.0.17425.20236, and we can still repro the issue. We'll re-test and let you know when we receive the next Office version update.

[shanshanzheng-dev]

Hi @SharonCKC are you still hit error? If not, we'll close this issue, if yes, please let us know if you need some help, Thanks.

[SharonCKC]

@shanshanzheng-dev We can still see the extra left space bug in version 16.0.17531.20190, so this issue is not resolved.

[shanshanzheng-dev]

Hi @SharonCKC Thanks for confirming. Could you try to update a new Excel Version, seem I can't repro this issue on my version. Dialog:

[SharonCKC]

@shanshanzheng-dev We are currently at 17531.20190. We will let you know when the next Excel version arrives for us.

[SharonCKC]

Hello @shanshanzheng-dev, we have version 17726.20206 and unfortunately we confirmed that this issue is not fixed. We still see a large empty margin to the left. Please see below screenshot in Hebrew:

[shanshanzheng-dev]

Hi @SiruiSun-MSFT could you please take a look? Thanks.

[SiruiSun-MSFT]

Hi @SharonCKC, thanks for your patience! We tried several methods to repro this issue. And finally we could repro it by dragging the dialog's border to compress the dialog. Seems this issue has something related to the DPI or scaling operations. Will keep investigation and go back to you when we get any progress. Thanks again!