Can not add async event handler Office.EventType.RecipientsChanged - Outlook, Office.js, React, TypeScript

up vote
0
down vote

favorite

I am extending my outlook add-in functionality which archives a specific type of email. This requires a comparison of recipients fields from email compose against a App state this.state.

I would like to add an event handler Office.EventType.RecipientsChanged, but this returns an error.

Console error

I created another event handler in the App component (mailbox.addHandlerAsync) and works perfectly. I am attaching a code of both below:

`componentDidMount() {`



// This code works perfectly !



    if (this._isConfigured() && Office.context.mailbox.item.itemType === Office.MailboxEnums.ItemType.Message) {

      if (Office.context.mailbox.item !== undefined) {

        Office.context.mailbox.addHandlerAsync(

          Office.EventType.ItemChanged,

          () => this._parseItem(),

        );

// This handler gives me an error.



        Office.context.mailbox.item.addHandlerAsync(

          Office.EventType.RecipientsChanged,

          () => this._parseItem(), (AsyncResult) => this._handleError(AsyncResult)

          );



// I am using setInterval to cough a change in recipients (cc, bcc, to) email compose form.



        setInterval(this._checkrecipientsOnCompose.bind(this), 5000);

      this._parseItem();

    } else {

      return;

    }}}`



Error:



[Screen Shoot of console error ][1]



  [1]: https://i.stack.imgur.com/5GVZE.png

Add-in package.json:

`{

    "name": "s_outlook",

    "description": "",

    "author": "",

    "version": "1.0.0",

    "scripts": {

        "clean": "rimraf dist && rimraf .awcache",

        "lint": "tslint --project tsconfig.json",

        "start": "webpack-dev-server --inline --config config/webpack.dev.js --progress",

        "sideload": "office-toolbox sideload -m manifest.xml -a Outlook",

        "build": "npm run clean && webpack --config config/webpack.prod.js --colors --progress --bail",

        "validate": "office-toolbox validate -m manifest.xml"

    },

    "dependencies": {

        "@microsoft/office-js-helpers": "^1.0.1",

        "core-js": "^2.5.3",

        "moment": "2.18.1",

        "office-ui-fabric-react": "^5.51.0",

        "react": "^16.6.3",

        "react-dom": "^16.6.3",

        "sugarcrm-js-rest-consumer": "^1.0.3"

    },

    "devDependencies": {

        "@types/office-js": "^0.0.130",

        "@types/react": "^16.7.6",

        "@types/react-dom": "^16.0.4",

        "@types/react-hot-loader": "^3.0.6",

        "@types/webpack": "2.2.12",

        "@types/webpack-dev-server": "1.12.6",

        "autoprefixer": "6.7.7",

        "copy-webpack-plugin": "4.0.1",

        "css-loader": "0.27.3",

        "extract-text-webpack-plugin": "2.1.0",

        "file-loader": "0.10.1",

        "html-webpack-plugin": "2.28.0",

        "less": "^3.0.1",

        "less-loader": "^4.0.5",

        "office-toolbox": "^0.1.0",

        "postcss-loader": "1.3.3",

        "react-hot-loader": "^3.1.3",

        "rimraf": "2.6.1",

        "style-loader": "0.16.0",

        "ts-loader": "^3.5.0",

        "tslint": "^5.9.1",

        "typescript": "^2.7.2",

        "webpack": "^3.11.0",

        "webpack-dev-server": "^2.11.1",

        "webpack-merge": "^4.1.1"

    }

}`

Manifest xml:

`

<?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:mailappor="http://schemas.microsoft.com/office/mailappversionoverrides/1.0"

          xsi:type="MailApp">



  <!-- 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></Id>



  <!--Version. Updates from the store only get triggered if there is a version change. -->

  <Version>1.0.0.0</Version>

  <ProviderName>xxx</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="S outlook" />

  <Description DefaultValue="Outlook Add-in for"/>



  <!-- Icon for your add-in. Used on installation screens and the add-ins dialog. -->

  <IconUrl DefaultValue="https://localhost:3000/assets/icon-80.png" />

  <HighResolutionIconUrl DefaultValue="https://localhost:3000/assets/logo-filled.png"/>



  <!--If you plan to submit this add-in to the Office Store, uncomment the SupportUrl element below-->

  <SupportUrl DefaultValue="https://s.co.uk" />



  <!-- 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>https://candy.ddev.local:3000</AppDomain>

    <AppDomain>AppDomain2</AppDomain>

    <AppDomain>AppDomain3</AppDomain>

  </AppDomains>

  <!--End Basic Settings. -->



  <Hosts>

    <Host Name="Mailbox" />

  </Hosts>

  <Requirements>

    <Sets>

      <Set Name="Mailbox" MinVersion="1.1" />

    </Sets>

  </Requirements>

  <FormSettings>

    <Form xsi:type="ItemRead">

      <DesktopSettings>

        <SourceLocation DefaultValue="https://localhost:3000/index.html"/>

        <RequestedHeight>350</RequestedHeight>

      </DesktopSettings>

    </Form>

    <Form xsi:type="ItemEdit">

      <DesktopSettings>

        <SourceLocation DefaultValue="https://localhost:3000/index.html"/>

      </DesktopSettings>

    </Form>

  </FormSettings>



  <Permissions>ReadWriteMailbox</Permissions>



  <Rule xsi:type="RuleCollection" Mode="Or">

    <Rule xsi:type="ItemIs" ItemType="Message" FormType="Edit" />

    <Rule xsi:type="ItemIs" ItemType="Message" FormType="Read" />

  </Rule>

  <DisableEntityHighlighting>false</DisableEntityHighlighting>

  <VersionOverrides xmlns="http://schemas.microsoft.com/office/mailappversionoverrides" xsi:type="VersionOverridesV1_0">

    <Requirements>

      <bt:Sets DefaultMinVersion="1.3">

        <bt:Set Name="Mailbox" />

      </bt:Sets>

    </Requirements>

    <Hosts>

      <Host xsi:type="MailHost">



       <DesktopFormFactor>

          <!-- Location of the Functions that UI-less buttons can trigger (ExecuteFunction Actions). -->

        <FunctionFile resid="functionFile" />

          <!-- Message Read -->

          <ExtensionPoint xsi:type="MessageReadCommandSurface">

            <!-- Use the default tab of the ExtensionPoint or create your own with <CustomTab id="myTab"> -->

            <OfficeTab id="TabDefault">

              <!-- Up to 6 Groups added per Tab -->

              <Group id="msgReadGroup">

                <Label resid="groupLabel" />

                <!-- Launch the add-in : task pane button -->

                <Control xsi:type="Button" id="msgReadOpenPaneButton">

                  <Label resid="paneReadButtonLabel" />

                  <Supertip>

                    <Title resid="paneReadSuperTipTitle" />

                    <Description resid="paneReadSuperTipDescription" />

                  </Supertip>

                  <Icon>

                    <bt:Image size="16" resid="icon16" />

                    <bt:Image size="32" resid="icon32" />

                    <bt:Image size="80" resid="icon80" />

                  </Icon>

                  <Action xsi:type="ShowTaskpane">

                    <SourceLocation resid="messageReadTaskPaneUrl" />

                  </Action>

                </Control>

                <!-- Go to http://aka.ms/ButtonCommands to learn how to add more Controls: ExecuteFunction and Menu -->

              </Group>

            </OfficeTab>

          </ExtensionPoint>

          <!-- Go to http://aka.ms/ExtensionPointsCommands to learn how to add more Extension Points: MessageRead, AppointmentOrganizer, AppointmentAttendee -->

        </DesktopFormFactor>

      </Host>

    </Hosts>

    <Resources>

      <bt:Images>

        <bt:Image id="icon16" DefaultValue="https://localhost:3000/assets/icon-16.png"/>

        <bt:Image id="icon32" DefaultValue="https://localhost:3000/assets/icon-32.png"/>

        <bt:Image id="icon80" DefaultValue="https://localhost:3000/assets/icon-80.png"/>

      </bt:Images>

      <bt:Urls>

        <bt:Url id="functionFile" DefaultValue="https://localhost:3000/function-file/function-file.html"/>

        <bt:Url id="messageReadTaskPaneUrl" DefaultValue="https://localhost:3000/index.html"/>

      </bt:Urls>

      <bt:ShortStrings>

          <bt:String id="groupLabel" DefaultValue="My S CRM Group"/>

          <bt:String id="customTabLabel"  DefaultValue="My S CRM Tab"/>

          <bt:String id="paneReadButtonLabel" DefaultValue="S CRM"/>

          <bt:String id="paneReadSuperTipTitle" DefaultValue="S CRM"/>

          <bt:String id="paneComposeButtonLabel" DefaultValue="S CRM"/>

      </bt:ShortStrings>

      <bt:LongStrings>

        <bt:String id="paneReadSuperTipDescription" DefaultValue="Opens a pane displaying all available properties. This is an example of a button that opens a task pane."/>

      </bt:LongStrings>

    </Resources>

    <VersionOverrides xmlns="http://schemas.microsoft.com/office/mailappversionoverrides/1.1" xsi:type="VersionOverridesV1_1">

      <Requirements>

        <bt:Sets DefaultMinVersion="1.7">

          <bt:Set Name="Mailbox" />

        </bt:Sets>

      </Requirements>

      <Hosts>

        <Host xsi:type="MailHost">

          <DesktopFormFactor>

            <!-- Location of the Functions that UI-less buttons can trigger (ExecuteFunction Actions). -->

            <FunctionFile resid="residUILessFunctionFileUrl" />

            <!-- The functionfile and function name to call on message send.  -->

            <!-- In this particular case the function validateBody will be called within the JavaScript code referenced in residUILessFunctionFileUrl. -->

            <ExtensionPoint xsi:type="Events">

              <!-- information about this extension point -->

              <Event Type="ItemSend" FunctionExecution="synchronous" FunctionName="itemSendHandler" />

            </ExtensionPoint>

            <!-- Message Compose -->

            <ExtensionPoint xsi:type="MessageComposeCommandSurface">

              <OfficeTab id="TabDefault">

                <Group id="msgComposeGroup">

                  <Label resid="groupLabel" />

                  <Control xsi:type="Button" id="msgComposeOpenPaneButton">

                    <Label resid="paneComposeButtonLabel" />

                    <Supertip>

                        <Title resid="paneReadSuperTipTitle" />

                        <Description resid="paneReadSuperTipDescription" />

                    </Supertip>

                    <Icon>

                      <bt:Image size="16" resid="icon16" />

                      <bt:Image size="32" resid="icon32" />

                      <bt:Image size="80" resid="icon80" />

                    </Icon>

                    <Action xsi:type="ShowTaskpane">

                      <SourceLocation resid="MessageComposeCommandSurface" />

                      <SupportsPinning>true</SupportsPinning>

                    </Action>

                  </Control>

                </Group>

              </OfficeTab>

            </ExtensionPoint>

            <!-- Message Read -->

            <ExtensionPoint xsi:type="MessageReadCommandSurface">

              <!-- Use the default tab of the ExtensionPoint or create your own with <CustomTab id="myTab"> -->

              <OfficeTab id="TabDefault">

                <!-- Up to 6 Groups added per Tab -->

                <Group id="msgReadGroup">

                  <Label resid="groupLabel" />

                  <!-- Launch the add-in : task pane button -->

                  <Control xsi:type="Button" id="msgReadOpenPaneButton">

                    <Label resid="paneReadButtonLabel" />

                    <Supertip>

                      <Title resid="paneReadSuperTipTitle" />

                      <Description resid="paneReadSuperTipDescription" />

                    </Supertip>

                    <Icon>

                      <bt:Image size="16" resid="icon16" />

                      <bt:Image size="32" resid="icon32" />

                      <bt:Image size="80" resid="icon80" />

                    </Icon>

                    <Action xsi:type="ShowTaskpane">

                      <SourceLocation resid="messageReadTaskPaneUrl" />

                      <SupportsPinning>true</SupportsPinning>

                    </Action>

                  </Control>

                  <!-- Go to http://aka.ms/ButtonCommands to learn how to add more Controls: ExecuteFunction and Menu -->

                </Group>

              </OfficeTab>

            </ExtensionPoint>

            <!-- Go to http://aka.ms/ExtensionPointsCommands to learn how to add more Extension Points: MessageRead, AppointmentOrganizer, AppointmentAttendee -->

          </DesktopFormFactor>

        </Host>

      </Hosts>

      <Resources>

        <bt:Images>

          <bt:Image id="icon16" DefaultValue="https://localhost:3000/assets/icon-16.png"/>

          <bt:Image id="icon32" DefaultValue="https://localhost:3000/assets/icon-32.png"/>

          <bt:Image id="icon80" DefaultValue="https://localhost:3000/assets/icon-80.png"/>

        </bt:Images>

        <bt:Urls>

          <bt:Url id="residUILessFunctionFileUrl" DefaultValue="https://localhost:3000/function-file/function-file.html"/>

          <bt:Url id="messageReadTaskPaneUrl" DefaultValue="https://localhost:3000/index.html"/>

          <bt:Url id="MessageComposeCommandSurface" DefaultValue="https://localhost:3000/index.html"/>

        </bt:Urls>

        <bt:ShortStrings>

          <bt:String id="groupLabel" DefaultValue="My S CRM Group"/>

          <bt:String id="customTabLabel"  DefaultValue="My S CRM Tab"/>

          <bt:String id="paneReadButtonLabel" DefaultValue="S CRM"/>

          <bt:String id="paneReadSuperTipTitle" DefaultValue="S CRM"/>

          <bt:String id="paneComposeButtonLabel" DefaultValue="S CRM"/>

        </bt:ShortStrings>

        <bt:LongStrings>

          <bt:String id="paneReadSuperTipDescription" DefaultValue="Opens a pane displaying all available properties. This is an example of a button that opens a task pane."/>

        </bt:LongStrings>

      </Resources>

    </VersionOverrides>

  </VersionOverrides>

</OfficeApp>

'

Is this a problem with API version ?

reactjs typescript outlook event-handling

share|improve this question

asked 2 days ago

micail

11

add a comment | 

up vote
0
down vote

favorite

I am extending my outlook add-in functionality which archives a specific type of email. This requires a comparison of recipients fields from email compose against a App state this.state.

I would like to add an event handler Office.EventType.RecipientsChanged, but this returns an error.

Console error

I created another event handler in the App component (mailbox.addHandlerAsync) and works perfectly. I am attaching a code of both below:

`componentDidMount() {`



// This code works perfectly !



    if (this._isConfigured() && Office.context.mailbox.item.itemType === Office.MailboxEnums.ItemType.Message) {

      if (Office.context.mailbox.item !== undefined) {

        Office.context.mailbox.addHandlerAsync(

          Office.EventType.ItemChanged,

          () => this._parseItem(),

        );

// This handler gives me an error.



        Office.context.mailbox.item.addHandlerAsync(

          Office.EventType.RecipientsChanged,

          () => this._parseItem(), (AsyncResult) => this._handleError(AsyncResult)

          );



// I am using setInterval to cough a change in recipients (cc, bcc, to) email compose form.



        setInterval(this._checkrecipientsOnCompose.bind(this), 5000);

      this._parseItem();

    } else {

      return;

    }}}`



Error:



[Screen Shoot of console error ][1]



  [1]: https://i.stack.imgur.com/5GVZE.png

Add-in package.json:

`{

    "name": "s_outlook",

    "description": "",

    "author": "",

    "version": "1.0.0",

    "scripts": {

        "clean": "rimraf dist && rimraf .awcache",

        "lint": "tslint --project tsconfig.json",

        "start": "webpack-dev-server --inline --config config/webpack.dev.js --progress",

        "sideload": "office-toolbox sideload -m manifest.xml -a Outlook",

        "build": "npm run clean && webpack --config config/webpack.prod.js --colors --progress --bail",

        "validate": "office-toolbox validate -m manifest.xml"

    },

    "dependencies": {

        "@microsoft/office-js-helpers": "^1.0.1",

        "core-js": "^2.5.3",

        "moment": "2.18.1",

        "office-ui-fabric-react": "^5.51.0",

        "react": "^16.6.3",

        "react-dom": "^16.6.3",

        "sugarcrm-js-rest-consumer": "^1.0.3"

    },

    "devDependencies": {

        "@types/office-js": "^0.0.130",

        "@types/react": "^16.7.6",

        "@types/react-dom": "^16.0.4",

        "@types/react-hot-loader": "^3.0.6",

        "@types/webpack": "2.2.12",

        "@types/webpack-dev-server": "1.12.6",

        "autoprefixer": "6.7.7",

        "copy-webpack-plugin": "4.0.1",

        "css-loader": "0.27.3",

        "extract-text-webpack-plugin": "2.1.0",

        "file-loader": "0.10.1",

        "html-webpack-plugin": "2.28.0",

        "less": "^3.0.1",

        "less-loader": "^4.0.5",

        "office-toolbox": "^0.1.0",

        "postcss-loader": "1.3.3",

        "react-hot-loader": "^3.1.3",

        "rimraf": "2.6.1",

        "style-loader": "0.16.0",

        "ts-loader": "^3.5.0",

        "tslint": "^5.9.1",

        "typescript": "^2.7.2",

        "webpack": "^3.11.0",

        "webpack-dev-server": "^2.11.1",

        "webpack-merge": "^4.1.1"

    }

}`

Manifest xml:

`

<?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:mailappor="http://schemas.microsoft.com/office/mailappversionoverrides/1.0"

          xsi:type="MailApp">



  <!-- 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></Id>



  <!--Version. Updates from the store only get triggered if there is a version change. -->

  <Version>1.0.0.0</Version>

  <ProviderName>xxx</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="S outlook" />

  <Description DefaultValue="Outlook Add-in for"/>



  <!-- Icon for your add-in. Used on installation screens and the add-ins dialog. -->

  <IconUrl DefaultValue="https://localhost:3000/assets/icon-80.png" />

  <HighResolutionIconUrl DefaultValue="https://localhost:3000/assets/logo-filled.png"/>



  <!--If you plan to submit this add-in to the Office Store, uncomment the SupportUrl element below-->

  <SupportUrl DefaultValue="https://s.co.uk" />



  <!-- 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>https://candy.ddev.local:3000</AppDomain>

    <AppDomain>AppDomain2</AppDomain>

    <AppDomain>AppDomain3</AppDomain>

  </AppDomains>

  <!--End Basic Settings. -->



  <Hosts>

    <Host Name="Mailbox" />

  </Hosts>

  <Requirements>

    <Sets>

      <Set Name="Mailbox" MinVersion="1.1" />

    </Sets>

  </Requirements>

  <FormSettings>

    <Form xsi:type="ItemRead">

      <DesktopSettings>

        <SourceLocation DefaultValue="https://localhost:3000/index.html"/>

        <RequestedHeight>350</RequestedHeight>

      </DesktopSettings>

    </Form>

    <Form xsi:type="ItemEdit">

      <DesktopSettings>

        <SourceLocation DefaultValue="https://localhost:3000/index.html"/>

      </DesktopSettings>

    </Form>

  </FormSettings>



  <Permissions>ReadWriteMailbox</Permissions>



  <Rule xsi:type="RuleCollection" Mode="Or">

    <Rule xsi:type="ItemIs" ItemType="Message" FormType="Edit" />

    <Rule xsi:type="ItemIs" ItemType="Message" FormType="Read" />

  </Rule>

  <DisableEntityHighlighting>false</DisableEntityHighlighting>

  <VersionOverrides xmlns="http://schemas.microsoft.com/office/mailappversionoverrides" xsi:type="VersionOverridesV1_0">

    <Requirements>

      <bt:Sets DefaultMinVersion="1.3">

        <bt:Set Name="Mailbox" />

      </bt:Sets>

    </Requirements>

    <Hosts>

      <Host xsi:type="MailHost">



       <DesktopFormFactor>

          <!-- Location of the Functions that UI-less buttons can trigger (ExecuteFunction Actions). -->

        <FunctionFile resid="functionFile" />

          <!-- Message Read -->

          <ExtensionPoint xsi:type="MessageReadCommandSurface">

            <!-- Use the default tab of the ExtensionPoint or create your own with <CustomTab id="myTab"> -->

            <OfficeTab id="TabDefault">

              <!-- Up to 6 Groups added per Tab -->

              <Group id="msgReadGroup">

                <Label resid="groupLabel" />

                <!-- Launch the add-in : task pane button -->

                <Control xsi:type="Button" id="msgReadOpenPaneButton">

                  <Label resid="paneReadButtonLabel" />

                  <Supertip>

                    <Title resid="paneReadSuperTipTitle" />

                    <Description resid="paneReadSuperTipDescription" />

                  </Supertip>

                  <Icon>

                    <bt:Image size="16" resid="icon16" />

                    <bt:Image size="32" resid="icon32" />

                    <bt:Image size="80" resid="icon80" />

                  </Icon>

                  <Action xsi:type="ShowTaskpane">

                    <SourceLocation resid="messageReadTaskPaneUrl" />

                  </Action>

                </Control>

                <!-- Go to http://aka.ms/ButtonCommands to learn how to add more Controls: ExecuteFunction and Menu -->

              </Group>

            </OfficeTab>

          </ExtensionPoint>

          <!-- Go to http://aka.ms/ExtensionPointsCommands to learn how to add more Extension Points: MessageRead, AppointmentOrganizer, AppointmentAttendee -->

        </DesktopFormFactor>

      </Host>

    </Hosts>

    <Resources>

      <bt:Images>

        <bt:Image id="icon16" DefaultValue="https://localhost:3000/assets/icon-16.png"/>

        <bt:Image id="icon32" DefaultValue="https://localhost:3000/assets/icon-32.png"/>

        <bt:Image id="icon80" DefaultValue="https://localhost:3000/assets/icon-80.png"/>

      </bt:Images>

      <bt:Urls>

        <bt:Url id="functionFile" DefaultValue="https://localhost:3000/function-file/function-file.html"/>

        <bt:Url id="messageReadTaskPaneUrl" DefaultValue="https://localhost:3000/index.html"/>

      </bt:Urls>

      <bt:ShortStrings>

          <bt:String id="groupLabel" DefaultValue="My S CRM Group"/>

          <bt:String id="customTabLabel"  DefaultValue="My S CRM Tab"/>

          <bt:String id="paneReadButtonLabel" DefaultValue="S CRM"/>

          <bt:String id="paneReadSuperTipTitle" DefaultValue="S CRM"/>

          <bt:String id="paneComposeButtonLabel" DefaultValue="S CRM"/>

      </bt:ShortStrings>

      <bt:LongStrings>

        <bt:String id="paneReadSuperTipDescription" DefaultValue="Opens a pane displaying all available properties. This is an example of a button that opens a task pane."/>

      </bt:LongStrings>

    </Resources>

    <VersionOverrides xmlns="http://schemas.microsoft.com/office/mailappversionoverrides/1.1" xsi:type="VersionOverridesV1_1">

      <Requirements>

        <bt:Sets DefaultMinVersion="1.7">

          <bt:Set Name="Mailbox" />

        </bt:Sets>

      </Requirements>

      <Hosts>

        <Host xsi:type="MailHost">

          <DesktopFormFactor>

            <!-- Location of the Functions that UI-less buttons can trigger (ExecuteFunction Actions). -->

            <FunctionFile resid="residUILessFunctionFileUrl" />

            <!-- The functionfile and function name to call on message send.  -->

            <!-- In this particular case the function validateBody will be called within the JavaScript code referenced in residUILessFunctionFileUrl. -->

            <ExtensionPoint xsi:type="Events">

              <!-- information about this extension point -->

              <Event Type="ItemSend" FunctionExecution="synchronous" FunctionName="itemSendHandler" />

            </ExtensionPoint>

            <!-- Message Compose -->

            <ExtensionPoint xsi:type="MessageComposeCommandSurface">

              <OfficeTab id="TabDefault">

                <Group id="msgComposeGroup">

                  <Label resid="groupLabel" />

                  <Control xsi:type="Button" id="msgComposeOpenPaneButton">

                    <Label resid="paneComposeButtonLabel" />

                    <Supertip>

                        <Title resid="paneReadSuperTipTitle" />

                        <Description resid="paneReadSuperTipDescription" />

                    </Supertip>

                    <Icon>

                      <bt:Image size="16" resid="icon16" />

                      <bt:Image size="32" resid="icon32" />

                      <bt:Image size="80" resid="icon80" />

                    </Icon>

                    <Action xsi:type="ShowTaskpane">

                      <SourceLocation resid="MessageComposeCommandSurface" />

                      <SupportsPinning>true</SupportsPinning>

                    </Action>

                  </Control>

                </Group>

              </OfficeTab>

            </ExtensionPoint>

            <!-- Message Read -->

            <ExtensionPoint xsi:type="MessageReadCommandSurface">

              <!-- Use the default tab of the ExtensionPoint or create your own with <CustomTab id="myTab"> -->

              <OfficeTab id="TabDefault">

                <!-- Up to 6 Groups added per Tab -->

                <Group id="msgReadGroup">

                  <Label resid="groupLabel" />

                  <!-- Launch the add-in : task pane button -->

                  <Control xsi:type="Button" id="msgReadOpenPaneButton">

                    <Label resid="paneReadButtonLabel" />

                    <Supertip>

                      <Title resid="paneReadSuperTipTitle" />

                      <Description resid="paneReadSuperTipDescription" />

                    </Supertip>

                    <Icon>

                      <bt:Image size="16" resid="icon16" />

                      <bt:Image size="32" resid="icon32" />

                      <bt:Image size="80" resid="icon80" />

                    </Icon>

                    <Action xsi:type="ShowTaskpane">

                      <SourceLocation resid="messageReadTaskPaneUrl" />

                      <SupportsPinning>true</SupportsPinning>

                    </Action>

                  </Control>

                  <!-- Go to http://aka.ms/ButtonCommands to learn how to add more Controls: ExecuteFunction and Menu -->

                </Group>

              </OfficeTab>

            </ExtensionPoint>

            <!-- Go to http://aka.ms/ExtensionPointsCommands to learn how to add more Extension Points: MessageRead, AppointmentOrganizer, AppointmentAttendee -->

          </DesktopFormFactor>

        </Host>

      </Hosts>

      <Resources>

        <bt:Images>

          <bt:Image id="icon16" DefaultValue="https://localhost:3000/assets/icon-16.png"/>

          <bt:Image id="icon32" DefaultValue="https://localhost:3000/assets/icon-32.png"/>

          <bt:Image id="icon80" DefaultValue="https://localhost:3000/assets/icon-80.png"/>

        </bt:Images>

        <bt:Urls>

          <bt:Url id="residUILessFunctionFileUrl" DefaultValue="https://localhost:3000/function-file/function-file.html"/>

          <bt:Url id="messageReadTaskPaneUrl" DefaultValue="https://localhost:3000/index.html"/>

          <bt:Url id="MessageComposeCommandSurface" DefaultValue="https://localhost:3000/index.html"/>

        </bt:Urls>

        <bt:ShortStrings>

          <bt:String id="groupLabel" DefaultValue="My S CRM Group"/>

          <bt:String id="customTabLabel"  DefaultValue="My S CRM Tab"/>

          <bt:String id="paneReadButtonLabel" DefaultValue="S CRM"/>

          <bt:String id="paneReadSuperTipTitle" DefaultValue="S CRM"/>

          <bt:String id="paneComposeButtonLabel" DefaultValue="S CRM"/>

        </bt:ShortStrings>

        <bt:LongStrings>

          <bt:String id="paneReadSuperTipDescription" DefaultValue="Opens a pane displaying all available properties. This is an example of a button that opens a task pane."/>

        </bt:LongStrings>

      </Resources>

    </VersionOverrides>

  </VersionOverrides>

</OfficeApp>

'

Is this a problem with API version ?

reactjs typescript outlook event-handling

share|improve this question

asked 2 days ago

micail

11

add a comment | 

up vote
0
down vote

favorite

up vote
0
down vote

favorite

I am extending my outlook add-in functionality which archives a specific type of email. This requires a comparison of recipients fields from email compose against a App state this.state.

I would like to add an event handler Office.EventType.RecipientsChanged, but this returns an error.

Console error

I created another event handler in the App component (mailbox.addHandlerAsync) and works perfectly. I am attaching a code of both below:

`componentDidMount() {`



// This code works perfectly !



    if (this._isConfigured() && Office.context.mailbox.item.itemType === Office.MailboxEnums.ItemType.Message) {

      if (Office.context.mailbox.item !== undefined) {

        Office.context.mailbox.addHandlerAsync(

          Office.EventType.ItemChanged,

          () => this._parseItem(),

        );

// This handler gives me an error.



        Office.context.mailbox.item.addHandlerAsync(

          Office.EventType.RecipientsChanged,

          () => this._parseItem(), (AsyncResult) => this._handleError(AsyncResult)

          );



// I am using setInterval to cough a change in recipients (cc, bcc, to) email compose form.



        setInterval(this._checkrecipientsOnCompose.bind(this), 5000);

      this._parseItem();

    } else {

      return;

    }}}`



Error:



[Screen Shoot of console error ][1]



  [1]: https://i.stack.imgur.com/5GVZE.png

Add-in package.json:

`{

    "name": "s_outlook",

    "description": "",

    "author": "",

    "version": "1.0.0",

    "scripts": {

        "clean": "rimraf dist && rimraf .awcache",

        "lint": "tslint --project tsconfig.json",

        "start": "webpack-dev-server --inline --config config/webpack.dev.js --progress",

        "sideload": "office-toolbox sideload -m manifest.xml -a Outlook",

        "build": "npm run clean && webpack --config config/webpack.prod.js --colors --progress --bail",

        "validate": "office-toolbox validate -m manifest.xml"

    },

    "dependencies": {

        "@microsoft/office-js-helpers": "^1.0.1",

        "core-js": "^2.5.3",

        "moment": "2.18.1",

        "office-ui-fabric-react": "^5.51.0",

        "react": "^16.6.3",

        "react-dom": "^16.6.3",

        "sugarcrm-js-rest-consumer": "^1.0.3"

    },

    "devDependencies": {

        "@types/office-js": "^0.0.130",

        "@types/react": "^16.7.6",

        "@types/react-dom": "^16.0.4",

        "@types/react-hot-loader": "^3.0.6",

        "@types/webpack": "2.2.12",

        "@types/webpack-dev-server": "1.12.6",

        "autoprefixer": "6.7.7",

        "copy-webpack-plugin": "4.0.1",

        "css-loader": "0.27.3",

        "extract-text-webpack-plugin": "2.1.0",

        "file-loader": "0.10.1",

        "html-webpack-plugin": "2.28.0",

        "less": "^3.0.1",

        "less-loader": "^4.0.5",

        "office-toolbox": "^0.1.0",

        "postcss-loader": "1.3.3",

        "react-hot-loader": "^3.1.3",

        "rimraf": "2.6.1",

        "style-loader": "0.16.0",

        "ts-loader": "^3.5.0",

        "tslint": "^5.9.1",

        "typescript": "^2.7.2",

        "webpack": "^3.11.0",

        "webpack-dev-server": "^2.11.1",

        "webpack-merge": "^4.1.1"

    }

}`

Manifest xml:

`

<?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:mailappor="http://schemas.microsoft.com/office/mailappversionoverrides/1.0"

          xsi:type="MailApp">



  <!-- 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></Id>



  <!--Version. Updates from the store only get triggered if there is a version change. -->

  <Version>1.0.0.0</Version>

  <ProviderName>xxx</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="S outlook" />

  <Description DefaultValue="Outlook Add-in for"/>



  <!-- Icon for your add-in. Used on installation screens and the add-ins dialog. -->

  <IconUrl DefaultValue="https://localhost:3000/assets/icon-80.png" />

  <HighResolutionIconUrl DefaultValue="https://localhost:3000/assets/logo-filled.png"/>



  <!--If you plan to submit this add-in to the Office Store, uncomment the SupportUrl element below-->

  <SupportUrl DefaultValue="https://s.co.uk" />



  <!-- 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>https://candy.ddev.local:3000</AppDomain>

    <AppDomain>AppDomain2</AppDomain>

    <AppDomain>AppDomain3</AppDomain>

  </AppDomains>

  <!--End Basic Settings. -->



  <Hosts>

    <Host Name="Mailbox" />

  </Hosts>

  <Requirements>

    <Sets>

      <Set Name="Mailbox" MinVersion="1.1" />

    </Sets>

  </Requirements>

  <FormSettings>

    <Form xsi:type="ItemRead">

      <DesktopSettings>

        <SourceLocation DefaultValue="https://localhost:3000/index.html"/>

        <RequestedHeight>350</RequestedHeight>

      </DesktopSettings>

    </Form>

    <Form xsi:type="ItemEdit">

      <DesktopSettings>

        <SourceLocation DefaultValue="https://localhost:3000/index.html"/>

      </DesktopSettings>

    </Form>

  </FormSettings>



  <Permissions>ReadWriteMailbox</Permissions>



  <Rule xsi:type="RuleCollection" Mode="Or">

    <Rule xsi:type="ItemIs" ItemType="Message" FormType="Edit" />

    <Rule xsi:type="ItemIs" ItemType="Message" FormType="Read" />

  </Rule>

  <DisableEntityHighlighting>false</DisableEntityHighlighting>

  <VersionOverrides xmlns="http://schemas.microsoft.com/office/mailappversionoverrides" xsi:type="VersionOverridesV1_0">

    <Requirements>

      <bt:Sets DefaultMinVersion="1.3">

        <bt:Set Name="Mailbox" />

      </bt:Sets>

    </Requirements>

    <Hosts>

      <Host xsi:type="MailHost">



       <DesktopFormFactor>

          <!-- Location of the Functions that UI-less buttons can trigger (ExecuteFunction Actions). -->

        <FunctionFile resid="functionFile" />

          <!-- Message Read -->

          <ExtensionPoint xsi:type="MessageReadCommandSurface">

            <!-- Use the default tab of the ExtensionPoint or create your own with <CustomTab id="myTab"> -->

            <OfficeTab id="TabDefault">

              <!-- Up to 6 Groups added per Tab -->

              <Group id="msgReadGroup">

                <Label resid="groupLabel" />

                <!-- Launch the add-in : task pane button -->

                <Control xsi:type="Button" id="msgReadOpenPaneButton">

                  <Label resid="paneReadButtonLabel" />

                  <Supertip>

                    <Title resid="paneReadSuperTipTitle" />

                    <Description resid="paneReadSuperTipDescription" />

                  </Supertip>

                  <Icon>

                    <bt:Image size="16" resid="icon16" />

                    <bt:Image size="32" resid="icon32" />

                    <bt:Image size="80" resid="icon80" />

                  </Icon>

                  <Action xsi:type="ShowTaskpane">

                    <SourceLocation resid="messageReadTaskPaneUrl" />

                  </Action>

                </Control>

                <!-- Go to http://aka.ms/ButtonCommands to learn how to add more Controls: ExecuteFunction and Menu -->

              </Group>

            </OfficeTab>

          </ExtensionPoint>

          <!-- Go to http://aka.ms/ExtensionPointsCommands to learn how to add more Extension Points: MessageRead, AppointmentOrganizer, AppointmentAttendee -->

        </DesktopFormFactor>

      </Host>

    </Hosts>

    <Resources>

      <bt:Images>

        <bt:Image id="icon16" DefaultValue="https://localhost:3000/assets/icon-16.png"/>

        <bt:Image id="icon32" DefaultValue="https://localhost:3000/assets/icon-32.png"/>

        <bt:Image id="icon80" DefaultValue="https://localhost:3000/assets/icon-80.png"/>

      </bt:Images>

      <bt:Urls>

        <bt:Url id="functionFile" DefaultValue="https://localhost:3000/function-file/function-file.html"/>

        <bt:Url id="messageReadTaskPaneUrl" DefaultValue="https://localhost:3000/index.html"/>

      </bt:Urls>

      <bt:ShortStrings>

          <bt:String id="groupLabel" DefaultValue="My S CRM Group"/>

          <bt:String id="customTabLabel"  DefaultValue="My S CRM Tab"/>

          <bt:String id="paneReadButtonLabel" DefaultValue="S CRM"/>

          <bt:String id="paneReadSuperTipTitle" DefaultValue="S CRM"/>

          <bt:String id="paneComposeButtonLabel" DefaultValue="S CRM"/>

      </bt:ShortStrings>

      <bt:LongStrings>

        <bt:String id="paneReadSuperTipDescription" DefaultValue="Opens a pane displaying all available properties. This is an example of a button that opens a task pane."/>

      </bt:LongStrings>

    </Resources>

    <VersionOverrides xmlns="http://schemas.microsoft.com/office/mailappversionoverrides/1.1" xsi:type="VersionOverridesV1_1">

      <Requirements>

        <bt:Sets DefaultMinVersion="1.7">

          <bt:Set Name="Mailbox" />

        </bt:Sets>

      </Requirements>

      <Hosts>

        <Host xsi:type="MailHost">

          <DesktopFormFactor>

            <!-- Location of the Functions that UI-less buttons can trigger (ExecuteFunction Actions). -->

            <FunctionFile resid="residUILessFunctionFileUrl" />

            <!-- The functionfile and function name to call on message send.  -->

            <!-- In this particular case the function validateBody will be called within the JavaScript code referenced in residUILessFunctionFileUrl. -->

            <ExtensionPoint xsi:type="Events">

              <!-- information about this extension point -->

              <Event Type="ItemSend" FunctionExecution="synchronous" FunctionName="itemSendHandler" />

            </ExtensionPoint>

            <!-- Message Compose -->

            <ExtensionPoint xsi:type="MessageComposeCommandSurface">

              <OfficeTab id="TabDefault">

                <Group id="msgComposeGroup">

                  <Label resid="groupLabel" />

                  <Control xsi:type="Button" id="msgComposeOpenPaneButton">

                    <Label resid="paneComposeButtonLabel" />

                    <Supertip>

                        <Title resid="paneReadSuperTipTitle" />

                        <Description resid="paneReadSuperTipDescription" />

                    </Supertip>

                    <Icon>

                      <bt:Image size="16" resid="icon16" />

                      <bt:Image size="32" resid="icon32" />

                      <bt:Image size="80" resid="icon80" />

                    </Icon>

                    <Action xsi:type="ShowTaskpane">

                      <SourceLocation resid="MessageComposeCommandSurface" />

                      <SupportsPinning>true</SupportsPinning>

                    </Action>

                  </Control>

                </Group>

              </OfficeTab>

            </ExtensionPoint>

            <!-- Message Read -->

            <ExtensionPoint xsi:type="MessageReadCommandSurface">

              <!-- Use the default tab of the ExtensionPoint or create your own with <CustomTab id="myTab"> -->

              <OfficeTab id="TabDefault">

                <!-- Up to 6 Groups added per Tab -->

                <Group id="msgReadGroup">

                  <Label resid="groupLabel" />

                  <!-- Launch the add-in : task pane button -->

                  <Control xsi:type="Button" id="msgReadOpenPaneButton">

                    <Label resid="paneReadButtonLabel" />

                    <Supertip>

                      <Title resid="paneReadSuperTipTitle" />

                      <Description resid="paneReadSuperTipDescription" />

                    </Supertip>

                    <Icon>

                      <bt:Image size="16" resid="icon16" />

                      <bt:Image size="32" resid="icon32" />

                      <bt:Image size="80" resid="icon80" />

                    </Icon>

                    <Action xsi:type="ShowTaskpane">

                      <SourceLocation resid="messageReadTaskPaneUrl" />

                      <SupportsPinning>true</SupportsPinning>

                    </Action>

                  </Control>

                  <!-- Go to http://aka.ms/ButtonCommands to learn how to add more Controls: ExecuteFunction and Menu -->

                </Group>

              </OfficeTab>

            </ExtensionPoint>

            <!-- Go to http://aka.ms/ExtensionPointsCommands to learn how to add more Extension Points: MessageRead, AppointmentOrganizer, AppointmentAttendee -->

          </DesktopFormFactor>

        </Host>

      </Hosts>

      <Resources>

        <bt:Images>

          <bt:Image id="icon16" DefaultValue="https://localhost:3000/assets/icon-16.png"/>

          <bt:Image id="icon32" DefaultValue="https://localhost:3000/assets/icon-32.png"/>

          <bt:Image id="icon80" DefaultValue="https://localhost:3000/assets/icon-80.png"/>

        </bt:Images>

        <bt:Urls>

          <bt:Url id="residUILessFunctionFileUrl" DefaultValue="https://localhost:3000/function-file/function-file.html"/>

          <bt:Url id="messageReadTaskPaneUrl" DefaultValue="https://localhost:3000/index.html"/>

          <bt:Url id="MessageComposeCommandSurface" DefaultValue="https://localhost:3000/index.html"/>

        </bt:Urls>

        <bt:ShortStrings>

          <bt:String id="groupLabel" DefaultValue="My S CRM Group"/>

          <bt:String id="customTabLabel"  DefaultValue="My S CRM Tab"/>

          <bt:String id="paneReadButtonLabel" DefaultValue="S CRM"/>

          <bt:String id="paneReadSuperTipTitle" DefaultValue="S CRM"/>

          <bt:String id="paneComposeButtonLabel" DefaultValue="S CRM"/>

        </bt:ShortStrings>

        <bt:LongStrings>

          <bt:String id="paneReadSuperTipDescription" DefaultValue="Opens a pane displaying all available properties. This is an example of a button that opens a task pane."/>

        </bt:LongStrings>

      </Resources>

    </VersionOverrides>

  </VersionOverrides>

</OfficeApp>

'

Is this a problem with API version ?

reactjs typescript outlook event-handling

share|improve this question

asked 2 days ago

micail

11

I am extending my outlook add-in functionality which archives a specific type of email. This requires a comparison of recipients fields from email compose against a App state this.state.

I would like to add an event handler Office.EventType.RecipientsChanged, but this returns an error.

Console error

I created another event handler in the App component (mailbox.addHandlerAsync) and works perfectly. I am attaching a code of both below:

`componentDidMount() {`



// This code works perfectly !



    if (this._isConfigured() && Office.context.mailbox.item.itemType === Office.MailboxEnums.ItemType.Message) {

      if (Office.context.mailbox.item !== undefined) {

        Office.context.mailbox.addHandlerAsync(

          Office.EventType.ItemChanged,

          () => this._parseItem(),

        );

// This handler gives me an error.



        Office.context.mailbox.item.addHandlerAsync(

          Office.EventType.RecipientsChanged,

          () => this._parseItem(), (AsyncResult) => this._handleError(AsyncResult)

          );



// I am using setInterval to cough a change in recipients (cc, bcc, to) email compose form.



        setInterval(this._checkrecipientsOnCompose.bind(this), 5000);

      this._parseItem();

    } else {

      return;

    }}}`



Error:



[Screen Shoot of console error ][1]



  [1]: https://i.stack.imgur.com/5GVZE.png

Add-in package.json:

`{

    "name": "s_outlook",

    "description": "",

    "author": "",

    "version": "1.0.0",

    "scripts": {

        "clean": "rimraf dist && rimraf .awcache",

        "lint": "tslint --project tsconfig.json",

        "start": "webpack-dev-server --inline --config config/webpack.dev.js --progress",

        "sideload": "office-toolbox sideload -m manifest.xml -a Outlook",

        "build": "npm run clean && webpack --config config/webpack.prod.js --colors --progress --bail",

        "validate": "office-toolbox validate -m manifest.xml"

    },

    "dependencies": {

        "@microsoft/office-js-helpers": "^1.0.1",

        "core-js": "^2.5.3",

        "moment": "2.18.1",

        "office-ui-fabric-react": "^5.51.0",

        "react": "^16.6.3",

        "react-dom": "^16.6.3",

        "sugarcrm-js-rest-consumer": "^1.0.3"

    },

    "devDependencies": {

        "@types/office-js": "^0.0.130",

        "@types/react": "^16.7.6",

        "@types/react-dom": "^16.0.4",

        "@types/react-hot-loader": "^3.0.6",

        "@types/webpack": "2.2.12",

        "@types/webpack-dev-server": "1.12.6",

        "autoprefixer": "6.7.7",

        "copy-webpack-plugin": "4.0.1",

        "css-loader": "0.27.3",

        "extract-text-webpack-plugin": "2.1.0",

        "file-loader": "0.10.1",

        "html-webpack-plugin": "2.28.0",

        "less": "^3.0.1",

        "less-loader": "^4.0.5",

        "office-toolbox": "^0.1.0",

        "postcss-loader": "1.3.3",

        "react-hot-loader": "^3.1.3",

        "rimraf": "2.6.1",

        "style-loader": "0.16.0",

        "ts-loader": "^3.5.0",

        "tslint": "^5.9.1",

        "typescript": "^2.7.2",

        "webpack": "^3.11.0",

        "webpack-dev-server": "^2.11.1",

        "webpack-merge": "^4.1.1"

    }

}`

Manifest xml:

`

<?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:mailappor="http://schemas.microsoft.com/office/mailappversionoverrides/1.0"

          xsi:type="MailApp">



  <!-- 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></Id>



  <!--Version. Updates from the store only get triggered if there is a version change. -->

  <Version>1.0.0.0</Version>

  <ProviderName>xxx</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="S outlook" />

  <Description DefaultValue="Outlook Add-in for"/>



  <!-- Icon for your add-in. Used on installation screens and the add-ins dialog. -->

  <IconUrl DefaultValue="https://localhost:3000/assets/icon-80.png" />

  <HighResolutionIconUrl DefaultValue="https://localhost:3000/assets/logo-filled.png"/>



  <!--If you plan to submit this add-in to the Office Store, uncomment the SupportUrl element below-->

  <SupportUrl DefaultValue="https://s.co.uk" />



  <!-- 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>https://candy.ddev.local:3000</AppDomain>

    <AppDomain>AppDomain2</AppDomain>

    <AppDomain>AppDomain3</AppDomain>

  </AppDomains>

  <!--End Basic Settings. -->



  <Hosts>

    <Host Name="Mailbox" />

  </Hosts>

  <Requirements>

    <Sets>

      <Set Name="Mailbox" MinVersion="1.1" />

    </Sets>

  </Requirements>

  <FormSettings>

    <Form xsi:type="ItemRead">

      <DesktopSettings>

        <SourceLocation DefaultValue="https://localhost:3000/index.html"/>

        <RequestedHeight>350</RequestedHeight>

      </DesktopSettings>

    </Form>

    <Form xsi:type="ItemEdit">

      <DesktopSettings>

        <SourceLocation DefaultValue="https://localhost:3000/index.html"/>

      </DesktopSettings>

    </Form>

  </FormSettings>



  <Permissions>ReadWriteMailbox</Permissions>



  <Rule xsi:type="RuleCollection" Mode="Or">

    <Rule xsi:type="ItemIs" ItemType="Message" FormType="Edit" />

    <Rule xsi:type="ItemIs" ItemType="Message" FormType="Read" />

  </Rule>

  <DisableEntityHighlighting>false</DisableEntityHighlighting>

  <VersionOverrides xmlns="http://schemas.microsoft.com/office/mailappversionoverrides" xsi:type="VersionOverridesV1_0">

    <Requirements>

      <bt:Sets DefaultMinVersion="1.3">

        <bt:Set Name="Mailbox" />

      </bt:Sets>

    </Requirements>

    <Hosts>

      <Host xsi:type="MailHost">



       <DesktopFormFactor>

          <!-- Location of the Functions that UI-less buttons can trigger (ExecuteFunction Actions). -->

        <FunctionFile resid="functionFile" />

          <!-- Message Read -->

          <ExtensionPoint xsi:type="MessageReadCommandSurface">

            <!-- Use the default tab of the ExtensionPoint or create your own with <CustomTab id="myTab"> -->

            <OfficeTab id="TabDefault">

              <!-- Up to 6 Groups added per Tab -->

              <Group id="msgReadGroup">

                <Label resid="groupLabel" />

                <!-- Launch the add-in : task pane button -->

                <Control xsi:type="Button" id="msgReadOpenPaneButton">

                  <Label resid="paneReadButtonLabel" />

                  <Supertip>

                    <Title resid="paneReadSuperTipTitle" />

                    <Description resid="paneReadSuperTipDescription" />

                  </Supertip>

                  <Icon>

                    <bt:Image size="16" resid="icon16" />

                    <bt:Image size="32" resid="icon32" />

                    <bt:Image size="80" resid="icon80" />

                  </Icon>

                  <Action xsi:type="ShowTaskpane">

                    <SourceLocation resid="messageReadTaskPaneUrl" />

                  </Action>

                </Control>

                <!-- Go to http://aka.ms/ButtonCommands to learn how to add more Controls: ExecuteFunction and Menu -->

              </Group>

            </OfficeTab>

          </ExtensionPoint>

          <!-- Go to http://aka.ms/ExtensionPointsCommands to learn how to add more Extension Points: MessageRead, AppointmentOrganizer, AppointmentAttendee -->

        </DesktopFormFactor>

      </Host>

    </Hosts>

    <Resources>

      <bt:Images>

        <bt:Image id="icon16" DefaultValue="https://localhost:3000/assets/icon-16.png"/>

        <bt:Image id="icon32" DefaultValue="https://localhost:3000/assets/icon-32.png"/>

        <bt:Image id="icon80" DefaultValue="https://localhost:3000/assets/icon-80.png"/>

      </bt:Images>

      <bt:Urls>

        <bt:Url id="functionFile" DefaultValue="https://localhost:3000/function-file/function-file.html"/>

        <bt:Url id="messageReadTaskPaneUrl" DefaultValue="https://localhost:3000/index.html"/>

      </bt:Urls>

      <bt:ShortStrings>

          <bt:String id="groupLabel" DefaultValue="My S CRM Group"/>

          <bt:String id="customTabLabel"  DefaultValue="My S CRM Tab"/>

          <bt:String id="paneReadButtonLabel" DefaultValue="S CRM"/>

          <bt:String id="paneReadSuperTipTitle" DefaultValue="S CRM"/>

          <bt:String id="paneComposeButtonLabel" DefaultValue="S CRM"/>

      </bt:ShortStrings>

      <bt:LongStrings>

        <bt:String id="paneReadSuperTipDescription" DefaultValue="Opens a pane displaying all available properties. This is an example of a button that opens a task pane."/>

      </bt:LongStrings>

    </Resources>

    <VersionOverrides xmlns="http://schemas.microsoft.com/office/mailappversionoverrides/1.1" xsi:type="VersionOverridesV1_1">

      <Requirements>

        <bt:Sets DefaultMinVersion="1.7">

          <bt:Set Name="Mailbox" />

        </bt:Sets>

      </Requirements>

      <Hosts>

        <Host xsi:type="MailHost">

          <DesktopFormFactor>

            <!-- Location of the Functions that UI-less buttons can trigger (ExecuteFunction Actions). -->

            <FunctionFile resid="residUILessFunctionFileUrl" />

            <!-- The functionfile and function name to call on message send.  -->

            <!-- In this particular case the function validateBody will be called within the JavaScript code referenced in residUILessFunctionFileUrl. -->

            <ExtensionPoint xsi:type="Events">

              <!-- information about this extension point -->

              <Event Type="ItemSend" FunctionExecution="synchronous" FunctionName="itemSendHandler" />

            </ExtensionPoint>

            <!-- Message Compose -->

            <ExtensionPoint xsi:type="MessageComposeCommandSurface">

              <OfficeTab id="TabDefault">

                <Group id="msgComposeGroup">

                  <Label resid="groupLabel" />

                  <Control xsi:type="Button" id="msgComposeOpenPaneButton">

                    <Label resid="paneComposeButtonLabel" />

                    <Supertip>

                        <Title resid="paneReadSuperTipTitle" />

                        <Description resid="paneReadSuperTipDescription" />

                    </Supertip>

                    <Icon>

                      <bt:Image size="16" resid="icon16" />

                      <bt:Image size="32" resid="icon32" />

                      <bt:Image size="80" resid="icon80" />

                    </Icon>

                    <Action xsi:type="ShowTaskpane">

                      <SourceLocation resid="MessageComposeCommandSurface" />

                      <SupportsPinning>true</SupportsPinning>

                    </Action>

                  </Control>

                </Group>

              </OfficeTab>

            </ExtensionPoint>

            <!-- Message Read -->

            <ExtensionPoint xsi:type="MessageReadCommandSurface">

              <!-- Use the default tab of the ExtensionPoint or create your own with <CustomTab id="myTab"> -->

              <OfficeTab id="TabDefault">

                <!-- Up to 6 Groups added per Tab -->

                <Group id="msgReadGroup">

                  <Label resid="groupLabel" />

                  <!-- Launch the add-in : task pane button -->

                  <Control xsi:type="Button" id="msgReadOpenPaneButton">

                    <Label resid="paneReadButtonLabel" />

                    <Supertip>

                      <Title resid="paneReadSuperTipTitle" />

                      <Description resid="paneReadSuperTipDescription" />

                    </Supertip>

                    <Icon>

                      <bt:Image size="16" resid="icon16" />

                      <bt:Image size="32" resid="icon32" />

                      <bt:Image size="80" resid="icon80" />

                    </Icon>

                    <Action xsi:type="ShowTaskpane">

                      <SourceLocation resid="messageReadTaskPaneUrl" />

                      <SupportsPinning>true</SupportsPinning>

                    </Action>

                  </Control>

                  <!-- Go to http://aka.ms/ButtonCommands to learn how to add more Controls: ExecuteFunction and Menu -->

                </Group>

              </OfficeTab>

            </ExtensionPoint>

            <!-- Go to http://aka.ms/ExtensionPointsCommands to learn how to add more Extension Points: MessageRead, AppointmentOrganizer, AppointmentAttendee -->

          </DesktopFormFactor>

        </Host>

      </Hosts>

      <Resources>

        <bt:Images>

          <bt:Image id="icon16" DefaultValue="https://localhost:3000/assets/icon-16.png"/>

          <bt:Image id="icon32" DefaultValue="https://localhost:3000/assets/icon-32.png"/>

          <bt:Image id="icon80" DefaultValue="https://localhost:3000/assets/icon-80.png"/>

        </bt:Images>

        <bt:Urls>

          <bt:Url id="residUILessFunctionFileUrl" DefaultValue="https://localhost:3000/function-file/function-file.html"/>

          <bt:Url id="messageReadTaskPaneUrl" DefaultValue="https://localhost:3000/index.html"/>

          <bt:Url id="MessageComposeCommandSurface" DefaultValue="https://localhost:3000/index.html"/>

        </bt:Urls>

        <bt:ShortStrings>

          <bt:String id="groupLabel" DefaultValue="My S CRM Group"/>

          <bt:String id="customTabLabel"  DefaultValue="My S CRM Tab"/>

          <bt:String id="paneReadButtonLabel" DefaultValue="S CRM"/>

          <bt:String id="paneReadSuperTipTitle" DefaultValue="S CRM"/>

          <bt:String id="paneComposeButtonLabel" DefaultValue="S CRM"/>

        </bt:ShortStrings>

        <bt:LongStrings>

          <bt:String id="paneReadSuperTipDescription" DefaultValue="Opens a pane displaying all available properties. This is an example of a button that opens a task pane."/>

        </bt:LongStrings>

      </Resources>

    </VersionOverrides>

  </VersionOverrides>

</OfficeApp>

'

Is this a problem with API version ?

reactjs typescript outlook event-handling

reactjs typescript outlook event-handling

share|improve this question

asked 2 days ago

micail

11

share|improve this question

asked 2 days ago

micail

11

share|improve this question

share|improve this question

asked 2 days ago

micail

11

asked 2 days ago

micail

11

asked 2 days ago

micail

11

11

add a comment | 

add a comment | 

active

oldest

votes

Your Answer

StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});


}
});

 

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53373196%2fcan-not-add-async-event-handler-office-eventtype-recipientschanged-outlook-of%23new-answer', 'question_page');
}
);

Post as a guest

Name

Email

Required, but never shown

active

oldest

votes

active

oldest

votes

active

oldest

votes

active

oldest

votes

 

draft saved

draft discarded

 

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53373196%2fcan-not-add-async-event-handler-office-eventtype-recipientschanged-outlook-of%23new-answer', 'question_page');
}
);

Post as a guest

Name

Email

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

Name

Name

Email

Required, but never shown

Email

Required, but never shown

Email

Required, but never shown

Email

Required, but never shown

Name

Name

Email

Required, but never shown

Email

Required, but never shown

Email

Required, but never shown

Email

Required, but never shown

This page is only for reference, If you need detailed information, please check here