Office Add-ins
Community Call
February 13, 2019
8:00 AM PST
• https://aka.ms/officeaddinscommunitycall
• Next call: Wednesday, March 13, 2019
• What’s new
• Meet the product teams behind Office Add-ins
• Technical deep dives
• Q&A
About the community call
Call agenda
• Office Add-ins overview
• Call for feedback (SSO)
• Call for feedback (Dev resources)
• Deep dive: Edge WebView control
• Customer insights: Lance Austin
• Q&A
Presenters
Kim Brandl
Sr. Dev Writer
Doug Mahugh
Sr. Dev Writer Software Architect & Developer
BXB Digital at Brambles
Lance AustinSudheer Maremanda
Sr. Program Manager
Office Add-ins
Overview
Doug Mahugh, Sr. Dev Writer
Add-inAdd-in Add-in
Add-in
Web App Manifest fileAdd-in
Add-in
Web APIs,
Azure services,
cloud storage,
analytics
Office.js
aka.ms/office-add-ins-docs
Single sign-on (SSO)
for Office Add-ins
• Nitesh Golchha is the new PM
• Looking to understand customer
needs around SSO
Provide your input!
1. Complete this form:
https://aka.ms/office-add-ins-sso
2. Reach out to Nitesh:
nigolc@microsoft.com
Developer tools and
resources
Let us hear from you!
* What tools and resources are most valuable?
* What tools and resources are missing?
https://aka.ms/ODPcommunitysurvey
Edge WebView control
for Office Add-ins
Sudheer Maremanda, Sr. Program Manager
We heard
your feedback
Edge WebView
for Office Add-ins platform
Modern Edge WebView powers the runtime for
Office Add-ins
Context
Office Add-ins are built using HTML / JS and the platform uses the web
control available on the OS as the runtime for the add-in.
See here for more information on browser versions supported and platform
requirements for running Office add-ins
Platform Web control used
Win32 IE / Trident
Mac WebKit 2
iOS WebKit 2
Android Chromium
Online Browser [Edge, Chrome, Firefox, Safari]
Edge
WebView
Edge WebView control is the modern web control
available on Windows 10
- Performance, standards compliant
- Supports full set of HTML 5 features including
media, recording, location
- Support for ECMAScript 2015+
Starting with Windows 10 version 19XX
and Office 16.0.11326.20000, Edge
WebView control will be rolled out as the
default control on Win32 for Office add-
ins.
Impact of this rollout
• Starting with Office version 16.0.11326.20000, Edge control will be the default
control where available
• On Windows 18XX and lower builds we will continue to use IE / Trident as the
default web control
• This means – you may have to make a few changes to make your add-in work on
both the IE/Trident as well as the Edge WebView control
• This change does not impact:
• Versions of Office lower than 16.0.11326.20000. We will continue to use IE /
Trident as the web control there
• Non-Windows Office versions, such as Office on Mac, iOS, Android, and Office
Online
Call to Action
• Test your add-in[s] with the new Edge control and give us feedback
• Make any changes necessary to your add-in to support both IE/Trident and
Edge WebView
• Report issues on GitHub under OfficeDev/Office-js
• It’s your responsibility to make changes [that may be needed] to your add-in to support Edge
WebView
• Only report issues that you cannot address using standard web development practices [Eg:
Crashes, Scroll issues etc]
To test your add-in
• Get the latest preview versions of Office and Windows
• Min Office version 16.0.11326.20000
• Min Windows version 19XX
• Enable the following feature flight in Office
• Microsoft.Office.OEP.Win32WebView = true
• Restart the Office app
• Note: For debugging use Edge Dev Tools [see details]
Timeline
Now
Available in Insider / Preview builds
• Office, version 16.0.11326.20000
• Windows version 19XX
End of Feb
Rollout of Edge control with Office’s Feb fork behind a
feature flight
End of March
General Availability of this feature with March fork
[which should be publicly available in mid April]
You must be a member of Office Insiders and Windows Insiders to get access to these builds.
Known Issues
[current]
- Error occurred while trying to reach your add-in from
https://localhost
• When loading an Office add-in from https://localhost or when using Fiddler, you
may see an error stating that a problem occurred while trying to reach your add-
in.
• To fix this, follow either of these steps to add a local loopback exemption to
“Desktop App Web Viewer”:
• Open a command prompt as Administrator and run the following
command: CheckNetIsolation LoopbackExempt -a -
n="microsoft.win32webviewhost_cw5n1h2txyewy"
• Using Fiddler: Select Tools > Win8 Loopback Exemptions and add an
exemption to “Desktop App Web Viewer.”
- All certificates need to be in computer store.
- https://github.com/OfficeDev/generator-office/blob/master/src/docs/ssl.md
- Navigating to sub-domains of source location is broken
- Add list of all subdomains to AppDomains in manifest
Customer Insights: An Office JS journey
How we chose the Office Add-in model,
and how we’ve been successful with it.
Lance Austin
LanceEa LanceAustinDEV
Software Architect & Developer
BXB Digital at Brambles
22
Dedicated to driving digital transformation of
supply-chain logistics
• Operating in 60 countries primarily through
the CHEP and IFCO brands
• Employs 14,000 people
• Owns 590+ million assets, through a network
of 850 service centers
Brambles BXB Digital
Harnesses the scale, expertise and insights of
Brambles to illuminate, re-imagine and transform
global supply chains.
• Silicon Valley-based technology company,
dedicated to digital supply chain transformation
• Combined expertise of 80+ technology and supply
chain professionals across the U.S., Europe and
India
Brambles, a global leader in supply chain logistics solutions, has deepened its commitment to
innovation by establishing BXB Digital. BXB Digital combines physical assets with digital
technology to deliver end-to-end visibility and collaboration solutions for the supply chain.
Brambles and BXB Digital
WHO WE ARE
23
HOW WE DO IT
24
• Make BRIX a part of the users' daily routine
• Reduce context switching
• Allow users to work with large sets of data
Why build an add-in?
25
Key Components
Our Office Add-in Journey
Learn about the Office
Add-ins platform &
educate stakeholders
Learn the APIs &
Prototype
Engage with Microsoft
Use capabilities of the
web platform
26
• What is office-js and the Office Add-in platform?
• How does it compare to VSTO?
• What are some limitations or challenges?
• Is cross platform support important?
• What skillset do I need to support this development model?
• What does Microsoft recommend?
Learn & Educate
Make sure your stakeholders know!
Tip Check out the docs - https://docs.microsoft.com/en-us/office/dev/add-ins/
27
Learn API’s & Prototype
Tip Make sure prototype matches real-world scenario
My first prototype
28
Checkout Script Lab
Learning & Prototyping the easy way!
29
• UserVoice request
o Reviewed API Designs
o Discussed feature requests
• Github Issues
o Code refactoring tips
o Focus on performance
o New performance best practices page
in docs
Engage with Microsoft
Tip Provide detailed information in issues and Script Lab Gist
30
• Web Workers – multi-threading in JavaScript
• Web Sockets – low level bi-directional TCP connection
• IndexedDB – local document storage
• AppCache/Service Worker* - caching application for fast reloads
• WebGL – machine learning and mathematical computations on the GPU
Use the Web Platform
*Use progressive enhancements since this isn’t supported in IE11
31
Demo
Engage with us!
Are you interested in...
* Presenting during an upcoming call?
* Providing feedback about the docs?
https://aka.ms/office-add-ins-engage
Q&A (post questions in chat window)
Learn
Engage
Developer resources
What Where
Office 365 Developer Program https://aka.ms/officedevprogram
Script Lab https://aka.ms/getscriptlab
Office Add-ins documentation https://aka.ms/office-add-ins-docs
Excel JS API Open spec https://aka.ms/excel-js-open-spec
Custom Functions https://aka.ms/customfunctions
What Where
Stack Overflow (questions) https://stackoverflow.com
office-js
outlook-web-addins
GitHub (issues) https://github.com/OfficeDev/office-js
UserVoice (feature requests) https://officespdev.uservoice.com
Send a Smile or Frown Inside Office
• Recording will be available soon on Office Developer YouTube
• https://aka.ms/OfficeDevYouTube
• Next call: Wednesday March 13th, 2019
• Submit your questions: https://aka.ms/officeaddinsform
• Add to your calendar: https://aka.ms/officeaddinscommunitycall
Thank you
Office Add ins community call-February 2019

Office Add ins community call-February 2019

  • 1.
  • 2.
    • https://aka.ms/officeaddinscommunitycall • Nextcall: Wednesday, March 13, 2019 • What’s new • Meet the product teams behind Office Add-ins • Technical deep dives • Q&A About the community call
  • 3.
    Call agenda • OfficeAdd-ins overview • Call for feedback (SSO) • Call for feedback (Dev resources) • Deep dive: Edge WebView control • Customer insights: Lance Austin • Q&A
  • 4.
    Presenters Kim Brandl Sr. DevWriter Doug Mahugh Sr. Dev Writer Software Architect & Developer BXB Digital at Brambles Lance AustinSudheer Maremanda Sr. Program Manager
  • 5.
  • 6.
  • 7.
    Add-in Web APIs, Azure services, cloudstorage, analytics Office.js
  • 8.
  • 9.
    Single sign-on (SSO) forOffice Add-ins • Nitesh Golchha is the new PM • Looking to understand customer needs around SSO Provide your input! 1. Complete this form: https://aka.ms/office-add-ins-sso 2. Reach out to Nitesh: nigolc@microsoft.com
  • 10.
    Developer tools and resources Letus hear from you! * What tools and resources are most valuable? * What tools and resources are missing? https://aka.ms/ODPcommunitysurvey
  • 11.
    Edge WebView control forOffice Add-ins Sudheer Maremanda, Sr. Program Manager
  • 12.
  • 14.
    Edge WebView for OfficeAdd-ins platform Modern Edge WebView powers the runtime for Office Add-ins
  • 15.
    Context Office Add-ins arebuilt using HTML / JS and the platform uses the web control available on the OS as the runtime for the add-in. See here for more information on browser versions supported and platform requirements for running Office add-ins Platform Web control used Win32 IE / Trident Mac WebKit 2 iOS WebKit 2 Android Chromium Online Browser [Edge, Chrome, Firefox, Safari]
  • 16.
    Edge WebView Edge WebView controlis the modern web control available on Windows 10 - Performance, standards compliant - Supports full set of HTML 5 features including media, recording, location - Support for ECMAScript 2015+ Starting with Windows 10 version 19XX and Office 16.0.11326.20000, Edge WebView control will be rolled out as the default control on Win32 for Office add- ins.
  • 17.
    Impact of thisrollout • Starting with Office version 16.0.11326.20000, Edge control will be the default control where available • On Windows 18XX and lower builds we will continue to use IE / Trident as the default web control • This means – you may have to make a few changes to make your add-in work on both the IE/Trident as well as the Edge WebView control • This change does not impact: • Versions of Office lower than 16.0.11326.20000. We will continue to use IE / Trident as the web control there • Non-Windows Office versions, such as Office on Mac, iOS, Android, and Office Online
  • 18.
    Call to Action •Test your add-in[s] with the new Edge control and give us feedback • Make any changes necessary to your add-in to support both IE/Trident and Edge WebView • Report issues on GitHub under OfficeDev/Office-js • It’s your responsibility to make changes [that may be needed] to your add-in to support Edge WebView • Only report issues that you cannot address using standard web development practices [Eg: Crashes, Scroll issues etc] To test your add-in • Get the latest preview versions of Office and Windows • Min Office version 16.0.11326.20000 • Min Windows version 19XX • Enable the following feature flight in Office • Microsoft.Office.OEP.Win32WebView = true • Restart the Office app • Note: For debugging use Edge Dev Tools [see details]
  • 19.
    Timeline Now Available in Insider/ Preview builds • Office, version 16.0.11326.20000 • Windows version 19XX End of Feb Rollout of Edge control with Office’s Feb fork behind a feature flight End of March General Availability of this feature with March fork [which should be publicly available in mid April] You must be a member of Office Insiders and Windows Insiders to get access to these builds.
  • 20.
    Known Issues [current] - Erroroccurred while trying to reach your add-in from https://localhost • When loading an Office add-in from https://localhost or when using Fiddler, you may see an error stating that a problem occurred while trying to reach your add- in. • To fix this, follow either of these steps to add a local loopback exemption to “Desktop App Web Viewer”: • Open a command prompt as Administrator and run the following command: CheckNetIsolation LoopbackExempt -a - n="microsoft.win32webviewhost_cw5n1h2txyewy" • Using Fiddler: Select Tools > Win8 Loopback Exemptions and add an exemption to “Desktop App Web Viewer.” - All certificates need to be in computer store. - https://github.com/OfficeDev/generator-office/blob/master/src/docs/ssl.md - Navigating to sub-domains of source location is broken - Add list of all subdomains to AppDomains in manifest
  • 21.
    Customer Insights: AnOffice JS journey How we chose the Office Add-in model, and how we’ve been successful with it. Lance Austin LanceEa LanceAustinDEV Software Architect & Developer BXB Digital at Brambles
  • 22.
    22 Dedicated to drivingdigital transformation of supply-chain logistics • Operating in 60 countries primarily through the CHEP and IFCO brands • Employs 14,000 people • Owns 590+ million assets, through a network of 850 service centers Brambles BXB Digital Harnesses the scale, expertise and insights of Brambles to illuminate, re-imagine and transform global supply chains. • Silicon Valley-based technology company, dedicated to digital supply chain transformation • Combined expertise of 80+ technology and supply chain professionals across the U.S., Europe and India Brambles, a global leader in supply chain logistics solutions, has deepened its commitment to innovation by establishing BXB Digital. BXB Digital combines physical assets with digital technology to deliver end-to-end visibility and collaboration solutions for the supply chain. Brambles and BXB Digital WHO WE ARE
  • 23.
  • 24.
    24 • Make BRIXa part of the users' daily routine • Reduce context switching • Allow users to work with large sets of data Why build an add-in?
  • 25.
    25 Key Components Our OfficeAdd-in Journey Learn about the Office Add-ins platform & educate stakeholders Learn the APIs & Prototype Engage with Microsoft Use capabilities of the web platform
  • 26.
    26 • What isoffice-js and the Office Add-in platform? • How does it compare to VSTO? • What are some limitations or challenges? • Is cross platform support important? • What skillset do I need to support this development model? • What does Microsoft recommend? Learn & Educate Make sure your stakeholders know! Tip Check out the docs - https://docs.microsoft.com/en-us/office/dev/add-ins/
  • 27.
    27 Learn API’s &Prototype Tip Make sure prototype matches real-world scenario My first prototype
  • 28.
    28 Checkout Script Lab Learning& Prototyping the easy way!
  • 29.
    29 • UserVoice request oReviewed API Designs o Discussed feature requests • Github Issues o Code refactoring tips o Focus on performance o New performance best practices page in docs Engage with Microsoft Tip Provide detailed information in issues and Script Lab Gist
  • 30.
    30 • Web Workers– multi-threading in JavaScript • Web Sockets – low level bi-directional TCP connection • IndexedDB – local document storage • AppCache/Service Worker* - caching application for fast reloads • WebGL – machine learning and mathematical computations on the GPU Use the Web Platform *Use progressive enhancements since this isn’t supported in IE11
  • 31.
  • 32.
    Engage with us! Areyou interested in... * Presenting during an upcoming call? * Providing feedback about the docs? https://aka.ms/office-add-ins-engage
  • 33.
    Q&A (post questionsin chat window)
  • 34.
    Learn Engage Developer resources What Where Office365 Developer Program https://aka.ms/officedevprogram Script Lab https://aka.ms/getscriptlab Office Add-ins documentation https://aka.ms/office-add-ins-docs Excel JS API Open spec https://aka.ms/excel-js-open-spec Custom Functions https://aka.ms/customfunctions What Where Stack Overflow (questions) https://stackoverflow.com office-js outlook-web-addins GitHub (issues) https://github.com/OfficeDev/office-js UserVoice (feature requests) https://officespdev.uservoice.com Send a Smile or Frown Inside Office
  • 35.
    • Recording willbe available soon on Office Developer YouTube • https://aka.ms/OfficeDevYouTube • Next call: Wednesday March 13th, 2019 • Submit your questions: https://aka.ms/officeaddinsform • Add to your calendar: https://aka.ms/officeaddinscommunitycall Thank you

Editor's Notes

  • #22 Lance – background: 8 years in IT in Telecom & Supply Chain industry 5 years developing solutions in .Net and Microsoft Solutions 3 years in Enterprise Architecture 3 years Software Architecture and Development
  • #25 Tell story about how it came about: Still within IT and on loan to BXB Digital Current boss mentioned wanting to hire a .net developer I raised my hand which proceeded to us discussing the excel add-in
  • #28 Was able to share with stakeholders and convince them that we should go down this path We were able to see that the event API’s were not mature at that time My prototype wasn’t realistic, so it gave us a false sense of success
  • #31 Touch on Microsoft’s performance improvements of Writing data (oct- nov) Touch on our internal refactoring and leveraging the Web Platform to improve performance