Can't sideload Office Word Add-In in Web

[antonia-rose]

Prerequisites

Please answer the following questions before submitting an issue. YOU MAY DELETE THE PREREQUISITES SECTION.

• [ ] I am running the latest version of Node and the tools
• [x] I checked the documentation and found no answer
• [x] I checked to make sure that this issue has not already been filed

Expected behavior

After running office-addin-debugging start manifest.xml web I should be able to install my local Add-In for Word in a Web-Browser. This worked since 2020.

Current behavior

After running office-addin-debugging start manifest.xml web I try to add my local Add-In in the web-mode of office in a browser. I got an error that my manifest isn't valid.

I ran npm run validate and got 5 errors because I use https://localhost:3000 for running my Add-In:

Error # 1:
The manifest source location URLs should not be localhost: The manifest source location URLs should not be localhost.

Error # 2:
Invalid Manifest Resource Urls: The manifest Resource URLs are invalid.
  - Details: Urls should be secured, non-localhost and valid, Found invalid Urls : https://localhost:3000/commands.html, https://localhost:3000/taskpane.html,

Error # 3:
Invalid Manifest AppDomain Urls: The manifest AppDomain URLs are invalid.
  - Details: Urls should be secured, non-localhost and valid, Found invalid Urls : http://localhost:3003,

Error # 4:
Localhost Manifest High Resolution Icon URL: The manifest high resolution Icon URL should not be localhost.
  - Details: https://localhost:3000/assets/mentor-64.png

Error # 5:
Localhost Manifest Icon URL: The manifest icon URL should not be localhost.
  - Details: https://localhost:3000/assets/mentor-32.png

This worked before. What Am I doing wrong, or what can I do, to test my Add-In in Office in browser?

[millerds]

Can you share a copy of your manifest?

The current version of the validate command has two modes . . . devx and Default (prod . . . specifically the store validation) . . . which allows you to check the development version without getting URL errors in the developer case. The developer case should be the default.

[antonia-rose]

Of course, this is the manifest.xml I use for local development:

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<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">
  <Id>5da41e3b-280f-4b88-8698-6af1951fc5b3</Id>
  <Version>1.4.2</Version>
  <ProviderName>BI</ProviderName>
  <DefaultLocale>de-DE</DefaultLocale>
  <DisplayName DefaultValue="App local"/>
  <Description DefaultValue="Das Plugin, jetzt auch für Word!"/>
  <IconUrl DefaultValue="https://localhost:3000/assets/mentor-32.png"/>
  <HighResolutionIconUrl DefaultValue="https://localhost:3000/assets/mentor-64.png"/>
  <SupportUrl DefaultValue="https://mentor.duden.de/"/>
  <AppDomains>
    <AppDomain>http://localhost:3003</AppDomain>
    <AppDomain>https://euc-word-edit.officeapps.live.com</AppDomain>
    <AppDomain>https://duden.de</AppDomain>
    <AppDomain>https://www.duden.de</AppDomain>
  </AppDomains>
  <Hosts>
    <Host Name="Document"/>
  </Hosts>
    <Requirements>
        <Sets DefaultMinVersion="1.3">
            <Set Name="WordApi" MinVersion="1.3"/>
        </Sets>
    </Requirements>
  <DefaultSettings>
    <SourceLocation DefaultValue="https://localhost:3000/taskpane.html"/>
  </DefaultSettings>
  <Permissions>ReadWriteDocument</Permissions>
  <VersionOverrides xmlns="http://schemas.microsoft.com/office/taskpaneappversionoverrides" xsi:type="VersionOverridesV1_0">
    <Hosts>
      <Host xsi:type="Document">
        <DesktopFormFactor>
          <GetStarted>
            <Title resid="GetStarted.Title"/>
            <Description resid="GetStarted.Description"/>
            <LearnMoreUrl resid="GetStarted.LearnMoreUrl"/>
          </GetStarted>
          <FunctionFile resid="Commands.Url"/>
          <ExtensionPoint xsi:type="PrimaryCommandSurface">
            <OfficeTab id="TabHome">
              <Group id="CommandsGroup">
                <Label resid="CommandsGroup.Label"/>
                <Icon>
                  <bt:Image size="16" resid="Icon.16x16"/>
                  <bt:Image size="32" resid="Icon.32x32"/>
                  <bt:Image size="80" resid="Icon.80x80"/>
                </Icon>
                <Control xsi:type="Button" id="TaskpaneButton">
                  <Label resid="TaskpaneButton.Label"/>
                  <Supertip>
                    <Title resid="TaskpaneButton.Label"/>
                    <Description resid="TaskpaneButton.Tooltip"/>
                  </Supertip>
                  <Icon>
                    <bt:Image size="16" resid="Icon.16x16"/>
                    <bt:Image size="32" resid="Icon.32x32"/>
                    <bt:Image size="80" resid="Icon.80x80"/>
                  </Icon>
                  <Action xsi:type="ShowTaskpane">
                    <TaskpaneId>ButtonId1</TaskpaneId>
                    <SourceLocation resid="Taskpane.Url"/>
                  </Action>
                </Control>
              </Group>
            </OfficeTab>
          </ExtensionPoint>
        </DesktopFormFactor>
      </Host>
    </Hosts>
    <Resources>
      <bt:Images>
        <bt:Image id="Icon.16x16" DefaultValue="https://localhost:3000/assets/mentor-16.png"/>
        <bt:Image id="Icon.32x32" DefaultValue="https://localhost:3000/assets/mentor-32.png"/>
        <bt:Image id="Icon.80x80" DefaultValue="https://localhost:3000/assets/mentor-64.png"/>
      </bt:Images>
      <bt:Urls>
        <bt:Url id="GetStarted.LearnMoreUrl" DefaultValue="https://go.microsoft.com/fwlink/?LinkId=276812"/>
        <bt:Url id="Commands.Url" DefaultValue="https://localhost:3000/commands.html"/>
        <bt:Url id="Taskpane.Url" DefaultValue="https://localhost:3000/taskpane.html"/>
      </bt:Urls>
      <bt:ShortStrings>
        <bt:String id="GetStarted.Title" DefaultValue="App wurde erfolgreich installiert."/>
        <bt:String id="CommandsGroup.Label" DefaultValue="Textprüfung"/>
        <bt:String id="TaskpaneButton.Label" DefaultValue="App local starten"/>
      </bt:ShortStrings>
      <bt:LongStrings>
        <bt:String id="GetStarted.Description" DefaultValue='Zum Öffnen klicken Sie bitte auf "Start" und dann "App starten".'/>
        <bt:String id="TaskpaneButton.Tooltip" DefaultValue="Klicken, um App Lokal zu öffnen."/>
      </bt:LongStrings>
    </Resources>
  </VersionOverrides>
</OfficeApp>

I am starting the web-version with webpack-dev-server --mode development and office-addin-debugging start manifest.xml web.

webpack-dev-server is installed in version 3.11.0 and office-addin-debugging in version 3.0.40

[antonia-rose]

Just a small update on this: I updated office-addin-debugging and office-addin-manifest to the latest package version and updated my start command with the --document option.

Now the document is opened in my current browser and I get a general error message:

(Translation: An error occured. Restart | exit)

When I choose Restart the website reloads but no add-in is loaded. I also get a lot of "Blocked by client" requests in the console.

[antonia-rose]

We fixed this issue. After creating a test Add-In with Yeoman that worked, we upgraded all packages including React, webpack and office-addin-packages.

Also the web-version now needs a --document parameter with a document url.