Angular component not loading under Outlook 2016 for Mac

Question

I am working on create a Outlook Add-in using Angular. For a sample i added task pane button to open up a side panel in outlook. After index page loading its open another component.

Problem is angular component not loading in Outlook 2016 mac, but it works Firefox, Chrome, Safari browsers.

How would you recommend carrying out such a problem?

Note : I have tested outlook on mac with Vorlon. Office.intialize not loading and got folllowing console messages.

Attempting to configure 'userAgent' with descriptor '{}' on object '[object Navigator]' and got error, giving up: TypeError: Attempting to change the getter of an unconfigurable property.
Attempting to configure 'appVersion' with descriptor '{}' on object '[object Navigator]' and got error, giving up: TypeError: Attempting to change the getter of an unconfigurable property.
Attempting to configure 'appName' with descriptor '{}' on object '[object Navigator]' and got error, giving up: TypeError: Attempting to change the getter of an unconfigurable property.
Attempting to configure 'product' with descriptor '{}' on object '[object Navigator]' and got error, giving up: TypeError: Attempting to change the getter of an unconfigurable property.
Attempting to configure 'vendor' with descriptor '{}' on object '[object Navigator]' and got error, giving up: TypeError: Attempting to change the getter of an unconfigurable property.

And also I published the addin and checked F12 to console messages in Outlook on windows. getting an error message "SCRIPT5022: Office.js has not been fully loaded yet. Please try again later or make sure to add your initialization code on the Office.initialize function."

This is my main.ts file

import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './app/app.module';
import { environment } from './environments/environment';

if (environment.production) {
  enableProdMode();
}

declare let Office:any;

Office.initialize = (reason: any) => {
  console.log('SampleAddin: initalizing office.js...');

  // bootstrap
  platformBrowserDynamic().bootstrapModule(AppModule)
    .then((success: any) => {
      console.log('SampleAddin: bootstrap success', success);
    })
    .catch((error: any) => {
      console.log('SampleAddin: bootstrap error', error);
    });
};

@MarcLaFleur-MSFTnot getting any error it just loaded index page, not rendered the angular component in outlook Mac — Sandun Tharaka
– Sandun Tharaka, Commented Aug 25, 2017 at 16:29
Have you set up Vorlon so you can see the console messages? Debugging with Vorlon.JS — Marc LaFleur
– Marc LaFleur, Commented Aug 25, 2017 at 16:32
Thanks, I tried, but i think dint test Vorlon with https. I will try. Do you have experience on Angular 2 add-in in mac? Is it works fine? — Sandun Tharaka
– Sandun Tharaka, Commented Aug 25, 2017 at 16:51
Many add-ins use Angular. Add-ins do require HTTPS, you cannot use them (even in dev) over HTTP. — Marc LaFleur
– Marc LaFleur, Commented Aug 26, 2017 at 0:24

Marc LaFleur · Accepted Answer · 2017-08-26 00:31:03Z

1

Without an error/warning, it is difficult to identify what might be going on. I'd recommend looking at the following resources:

Tips for creating Office Add-ins with Angular
Debug Office Add-ins on iPad and Mac
OfficeDev/script-lab (OSS Word/Ppt/Excel Add-in using Angular)

answered Aug 26, 2017 at 0:31

Marc LaFleur

33.4k4 gold badges41 silver badges71 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Sandun Tharaka Over a year ago

Thanks for your suggestions. I have edited question with console log messages in outlook on mac. These log messages only shows in outlook mac.

Sandun Tharaka Over a year ago

I got error saying Office.js has not been fully loaded yet. Please try again later or make sure to add your initialization code on the Office.initialize function. I have updated question with main.ts file.

Collectives™ on Stack Overflow

Angular component not loading under Outlook 2016 for Mac

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related