search

OfficeDev / office-js

A repo and NPM package for Office.js, corresponding to a copy of what gets published to the official "evergreen" Office.js CDN, at https://appsforoffice.microsoft.com/lib/1/hosted/office.js.
https://learn.microsoft.com/javascript/api/overview
Other
685 stars 95 forks source link

Control xsi:type="Menu" does not work in Excel. #1989

Open HiranPeri opened 3 years ago

HiranPeri commented 3 years ago

We used the documentation as reference to create a menu (Dropdown buttons) in excel sheet. If we comment out menu control then the add-in loads fine. But if we don't comment out and expect the menu to load then entire add-in fails.

Menu (dropdown button) controls

Issue

Here is sample manifest which we created using visual studio and then tried adding menu item in the manifest. `<?xml version="1.0" encoding="UTF-8"?>

<OfficeApp xmlns="http://schemas.microsoft.com/office/appforoffice/1.1" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:bt="http://schemas.microsoft.com/office/officeappbasictypes/1.0" xmlns:ov="http://schemas.microsoft.com/office/taskpaneappversionoverrides" xsi:type="TaskPaneApp">

<!-- Begin Basic Settings: Add-in metadata, used for all versions of Office unless override provided. -->

<!-- IMPORTANT! Id must be unique for your add-in, if you reuse this manifest ensure that you change this id to a new GUID. -->
<Id>23f29ba5-dcc8-4acc-89e7-582d5368ccc8</Id>

<!--Version. Updates from the store only get triggered if there is a version change. -->
<Version>1.0.0.0</Version>
<ProviderName>[Provider name]</ProviderName>
<DefaultLocale>en-US</DefaultLocale>
<!-- The display name of your add-in. Used on the store and various places of the Office UI such as the add-ins dialog. -->
<DisplayName DefaultValue="WingX" />
<Description DefaultValue="WingX"/>
<!-- Icon for your add-in. Used on installation screens and the add-ins dialog. -->
<IconUrl DefaultValue="~remoteAppUrl/Images/Button32x32.png" />

<SupportUrl DefaultValue="http://www.contoso.com" />
<!-- Domains that will be allowed when navigating. For example, if you use ShowTaskpane and then have an href link, navigation will only be allowed if the domain is on this list. -->
<AppDomains>
  <AppDomain>AppDomain1</AppDomain>
  <AppDomain>AppDomain2</AppDomain>
  <AppDomain>AppDomain3</AppDomain>
</AppDomains>
<!--End Basic Settings. -->

<!--Begin TaskPane Mode integration. This section is used if there are no VersionOverrides or if the Office client version does not support add-in commands. -->
<Hosts>
  <Host Name="Workbook" />
</Hosts>
<DefaultSettings>
  <SourceLocation DefaultValue="~remoteAppUrl/Home.html" />
</DefaultSettings>
<!-- End TaskPane Mode integration.  -->

<Permissions>ReadWriteDocument</Permissions>

<!-- Begin Add-in Commands Mode integration. -->
<VersionOverrides xmlns="http://schemas.microsoft.com/office/taskpaneappversionoverrides" xsi:type="VersionOverridesV1_0">

  <!-- The Hosts node is required. -->
  <Hosts>
    <!-- Each host can have a different set of commands. -->
    <!-- Excel host is Workbook, Word host is Document, and PowerPoint host is Presentation. -->
    <!-- Make sure the hosts you override match the hosts declared in the top section of the manifest. -->
    <Host xsi:type="Workbook">
      <!-- Form factor. Currently only DesktopFormFactor is supported. -->
      <DesktopFormFactor>
        <!--"This code enables a customizable message to be displayed when the add-in is loaded successfully upon individual install."-->
        <GetStarted>
          <!-- Title of the Getting Started callout. The resid attribute points to a ShortString resource -->
          <Title resid="Contoso.GetStarted.Title"/>

          <!-- Description of the Getting Started callout. resid points to a LongString resource -->
          <Description resid="Contoso.GetStarted.Description"/>

          <!-- Points to a URL resource which details how the add-in should be used. -->
          <LearnMoreUrl resid="Contoso.GetStarted.LearnMoreUrl"/>
        </GetStarted>
        <!-- Function file is a HTML page that includes the JavaScript where functions for ExecuteAction will be called. 
        Think of the FunctionFile as the code behind ExecuteFunction. -->
        <FunctionFile resid="Contoso.DesktopFunctionFile.Url" />

        <!-- PrimaryCommandSurface is the main Office Ribbon. -->
        <ExtensionPoint xsi:type="PrimaryCommandSurface">
          <!-- Use OfficeTab to extend an existing Tab. Use CustomTab to create a new tab. -->
          <CustomTab id="TabHome">
            <!-- Ensure you provide a unique id for the group. Recommendation for any IDs is to namespace using your company name. -->
            <Group id="Contoso.Group1">
              <!-- Label for your group. resid must point to a ShortString resource. -->
              <Label resid="Contoso.Group1Label" />
              <!-- Icons. Required sizes 16,32,80, optional 20, 24, 40, 48, 64. Strongly recommended to provide all sizes for great UX. -->
              <!-- Use PNG icons. All URLs on the resources section must use HTTPS. -->
              <Icon>
                <bt:Image size="16" resid="Contoso.tpicon_16x16" />
                <bt:Image size="32" resid="Contoso.tpicon_32x32" />
                <bt:Image size="80" resid="Contoso.tpicon_80x80" />
              </Icon>

              <!-- Control. It can be of type "Button" or "Menu". -->
              <Control xsi:type="Button" id="Contoso.TaskpaneButton">
                <Label resid="Contoso.TaskpaneButton.Label" />
                <Supertip>
                  <!-- ToolTip title. resid must point to a ShortString resource. -->
                  <Title resid="Contoso.TaskpaneButton.Label" />
                  <!-- ToolTip description. resid must point to a LongString resource. -->
                  <Description resid="Contoso.TaskpaneButton.Tooltip" />
                </Supertip>
                <Icon>
                  <bt:Image size="16" resid="Contoso.tpicon_16x16" />
                  <bt:Image size="32" resid="Contoso.tpicon_32x32" />
                  <bt:Image size="80" resid="Contoso.tpicon_80x80" />
                </Icon>

                <!-- This is what happens when the command is triggered (E.g. click on the Ribbon). Supported actions are ExecuteFunction or ShowTaskpane. -->
                <Action xsi:type="ShowTaskpane">
                  <TaskpaneId>ButtonId1</TaskpaneId>
                  <!-- Provide a URL resource id for the location that will be displayed on the task pane. -->
                  <SourceLocation resid="Contoso.Taskpane.Url" />
                </Action>
              </Control>
            </Group>
            <Group id="Contoso.Group1Id1">

              <!--Label for your group. resid must point to a ShortString resource -->
              <Label resid="residLabel4" />
              <!--Icons. Required sizes 16,31,80, optional 20, 24, 40, 48, 64. Strongly recommended to provide all sizes for great UX -->
              <!--Use PNG icons and remember that all URLs on the resources section must use HTTPS -->
              <Icon>
                <bt:Image size="16" resid="icon1_16x16" />
                <bt:Image size="32" resid="icon1_32x32" />
                <bt:Image size="80" resid="icon1_80x80" />
              </Icon>
              <Control xsi:type="Menu" id="TestMenu2">
                <Label resid="residLabel3" />
                <!--<Tooltip resid="residToolTip" />-->
                <Supertip>
                  <Title resid="residLabel3" />
                  <Description resid="residLabel3" />
                </Supertip>
                <Icon>
                  <bt:Image size="16" resid="icon1_16x16" />
                  <bt:Image size="32" resid="icon1_16x16" />
                  <bt:Image size="80" resid="icon1_16x16" />
                </Icon>
                <Items>
                  <Item id="showGallery20">
                    <Label resid="residLabel3"/>
                    <Supertip>
                      <Title resid="residLabel3" />
                      <Description resid="residLabel3" />
                    </Supertip>
                    <Icon>
                      <bt:Image size="16" resid="icon1_16x16" />
                      <bt:Image size="32" resid="icon1_16x16" />
                      <bt:Image size="80" resid="icon1_16x16" />
                    </Icon>
                    <Action xsi:type="ShowTaskpane">
                      <TaskpaneId>ButtonId1</TaskpaneId>
                      <!-- Provide a URL resource id for the location that will be displayed on the task pane. -->
                      <SourceLocation resid="Contoso.Taskpane.Url" />
                    </Action>
                  </Item>
                </Items>
              </Control>
            </Group>
            <Label resid="Contoso.CustomTabName" />
          </CustomTab>
        </ExtensionPoint>
      </DesktopFormFactor>
    </Host>
  </Hosts>

  <!-- You can use resources across hosts and form factors. -->
  <Resources>
    <bt:Images>
      <bt:Image id="Contoso.tpicon_16x16" DefaultValue="~remoteAppUrl/Images/Button16x16.png" />
      <bt:Image id="Contoso.tpicon_32x32" DefaultValue="~remoteAppUrl/Images/Button32x32.png" />
      <bt:Image id="Contoso.tpicon_80x80" DefaultValue="~remoteAppUrl/Images/Button80x80.png" />
      <bt:Image id="icon1_16x16" DefaultValue="https://i.imgur.com/xV3upTT.png">
        <bt:Override Locale="ja-jp" Value="https://i.imgur.com/xV3upTT.png" />
      </bt:Image>
      <bt:Image id="icon1_32x32" DefaultValue="https://i.imgur.com/kBw0iKX.png">
        <bt:Override Locale="ja-jp" Value="https://i.imgur.com/kBw0iKX.png" />
      </bt:Image>
      <bt:Image id="icon1_80x80" DefaultValue="https://i.imgur.com/xV3upTT.png">
        <bt:Override Locale="ja-jp" Value="https://i.imgur.com/xV3upTT.png" />
      </bt:Image>
      <bt:Image id="icon2_32x32" DefaultValue="https://i.imgur.com/LltG56v.png">
      </bt:Image>
      <bt:Image id="icon3_32x32" DefaultValue="https://i.imgur.com/SeiInaW.png">
      </bt:Image>
      <bt:Image id="Contoso.TaskpaneButton.Icon" DefaultValue="https://i.imgur.com/SeiInaW.png">
      </bt:Image>
    </bt:Images>
    <bt:Urls>
      <bt:Url id="Contoso.DesktopFunctionFile.Url" DefaultValue="~remoteAppUrl/Functions/FunctionFile.html" />
      <bt:Url id="Contoso.Taskpane.Url" DefaultValue="~remoteAppUrl/Home.html" />
      <bt:Url id="Contoso.GetStarted.LearnMoreUrl" DefaultValue="https://go.microsoft.com/fwlink/?LinkId=276812" />
      <bt:Url id="residDesktopFuncUrl" DefaultValue="https://odsample.azurewebsites.net/Pages/Home.aspx?11">
        <bt:Override Locale="ja-jp" Value="https://odsample.azurewebsites.net/Pages/Home.aspx?11" />
      </bt:Url>
      <bt:Url id="residUnitConverterUrl" DefaultValue="https://odsample.azurewebsites.net/Pages/Home.aspx?33">
      </bt:Url>
      <!--LearnMore URL currently not used -->
      <bt:Url id="Contoso.GetStarted.LearnMoreUrl" DefaultValue="https://odsample.azurewebsites.net/Pages/GetStarted.html">
      </bt:Url>
    </bt:Urls>
    <!-- ShortStrings max characters==125. -->
    <bt:ShortStrings>
      <bt:String id="Contoso.TaskpaneButton.Label" DefaultValue="Show Taskpane" />
      <bt:String id="Contoso.Group1Label" DefaultValue="Commands Group" />
      <bt:String id="Contoso.GetStarted.Title" DefaultValue="Get started with your sample add-in!" />
      <bt:String id="Contoso.CustomTabName" DefaultValue="WingX" />
      <bt:String id="residLabel" DefaultValue="Get Data">
        <bt:Override Locale="ja-jp" Value="JA-JP Multiple Buttons" />
      </bt:String>
      <bt:String id="residLabel2" DefaultValue="Save Data">
        <bt:Override Locale="ja-jp" Value="JA-JP Multiple Buttons" />
      </bt:String>
      <bt:String id="residLabel3" DefaultValue="Compare Data">
        <bt:Override Locale="ja-jp" Value="JA-JP Multiple Buttons" />
      </bt:String>
      <bt:String id="residLabel4" DefaultValue="OData Integration">
        <bt:Override Locale="ja-jp" Value="JA-JP Multiple Buttons" />
      </bt:String>
      <bt:String id="residLabel5" DefaultValue="Another Command">
        <bt:Override Locale="ja-jp" Value="JA-JP Multiple Buttons" />
      </bt:String>
      <bt:String id="Contoso.GetStarted.Title" DefaultValue="OData Sample Loaded Successfully">
        <bt:Override Locale="ja-jp" Value="JA-JP Get Started Title" />
      </bt:String>
      <bt:String id="CustomTab.Wingx.Label" DefaultValue="Wingx" />
      <bt:String id="CustomTab.Wingx.Group1.Label" DefaultValue="Wingx Group1" />
      <bt:String id="CustomTab.Wingx.Group2.Label" DefaultValue="Wingx Group2" />
      <bt:String id="Contoso.Item1.Label" DefaultValue="Wingx Menu Item 1" />
      <bt:String id="Contoso.Item2.Label" DefaultValue="Wingx Menu Item 2" />
    </bt:ShortStrings>
    <!-- LongStrings max characters==250. -->
    <bt:LongStrings>
      <bt:String id="Contoso.TaskpaneButton.Tooltip" DefaultValue="Click to Show a Taskpane" />
      <bt:String id="Contoso.GetStarted.Description" DefaultValue="Your sample add-in loaded succesfully. Go to the HOME tab and click the 'Show Taskpane' button to get started." />
      <!-- LongStrings max characters==250 -->
      <bt:String id="residToolTip" DefaultValue="Multiple Buttons Tooltip">
        <bt:Override Locale="ja-jp" Value="JA-JP Multiple Buttons Tooltip" />
      </bt:String>
      <bt:String id="Contoso.GetStarted.Description" DefaultValue="Get going by opening the DATA tab on the Ribbon then click the ODATA INTEGRATION>GET DATA button to try this Add-in">
        <bt:Override Locale="ja-jp" Value="JA-JP Get Started Title" />
      </bt:String>
    </bt:LongStrings>
  </Resources>
</VersionOverrides>
<!-- End Add-in Commands Mode integration. -->

`

Excel version: Version 2001 (Build 12430.20184)

HiranPeri commented 3 years ago

Update - I tried the same control on word manifest and it shows a menu like there but not in excel.

AlexJerabek commented 3 years ago

Thanks for the feedback @HiranPeri.

@Rick-Kirkham, could you please take a look?

Rick-Kirkham commented 3 years ago

@HiranPeri Please clarify what you mean by "entire add-in fails". What exactly goes wrong. What steps lead up to the failure. Is there an error message?

hirandesai commented 3 years ago

@Rick-Kirkham - This is the error I see - image

i.e. The add-in does not load in Excel at all. No errors are displayed in visual studio.

hirandesai commented 3 years ago

To provide more information, about what I did:

  1. Create new project in visual studio with project template Excel Add-In Web
  2. Run project (F5), you can see the task pane add-in in excel.
  3. Stop the project
  4. Add menu control (and required resource items) (the menu control was copied from documentation link give above)
  5. Run the add-in. Excel won't load the add-in.
  6. Comment the newly added menu control and run. The old add-in gets loaded i.e. the problem is with menu control support for excel.
Rick-Kirkham commented 3 years ago

This looks like a bug in Excel. I'm transferring this issue to a different repo.

lumine2008 commented 3 years ago

This looks like a UX issue, so let me looping @lliu113.

lliu113 commented 3 years ago

@hirandesai - thanks for the extra context! Are you able to side-load your manifest, instead of launching it through visual studio? The easiest way to do this in Office Online, here is more info. Are you hitting a similar error?

ElizabethSamuel-MSFT commented 2 years ago

@hirandesai Checking on your status. Thanks.

hirandesai commented 2 years ago

We moved on with a different implementation since this was not working. Sorry, I cannot help you now to check whether this will work or not!

ElizabethSamuel-MSFT commented 2 years ago

@hirandesai Thanks for letting us know.

HugoAlbertoNieto commented 1 year ago

@hirandesai @lliu113 I'm having this exact same issue. Are there any news on this? The addin won't load if I use Control xsi:type="Menu" in Excel. As soon as I comment the code of that control, the addin loads correctly.

This is the error I get on both, the online version and desktop version of Excel:

image

image

I get the same error when I try to sideload the manifest manually using this link.

penglongzhaochina commented 1 year ago

Hi ,@jargil, could you please take a look when you have time?