Skip to content

Commit 14b663e

Browse files
akrantzakrantz
authored
Support multiple hosts (#4)
I've updated the source code so that it can detect and run the appropriate code for each Office app host. The manifest contains support for all hosts except for Outlook. I had problems merging it in, and will try again later, or we will need to have a separate manifest.outlook.xml file. I've updated debugging support so that `npm start -- --app word` will work, as well as using the VS Code launch config `Word Desktop` (using Start Without Debugging because the integrated VSCode debugger cannot debug the taskpane webview). After launch, you instead use Edge DevTools or Visual Studio to debug. There is also a VSCode debug config for `Office Online (Edge)`. You can paste the share url of the Office document when prompted on F5 and use the integrated debugger to it running in Edge. * Add code for each host * add multiple hosts to manifest * Update sideload npm scripts to allow choosing which app * Update VSCode launch configs for Excel/PowerPoint/Word * add VSCode debug config for Chrome * add debugging doc * update office-addin-debugging package
1 parent 3da9eac commit 14b663e

File tree

6 files changed

+300
-19
lines changed

6 files changed

+300
-19
lines changed

‎.vscode/launch.json

Lines changed: 26 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,32 @@
99
"type": "node",
1010
"request": "launch",
1111
"runtimeExecutable": "npm",
12-
"runtimeArgs": ["run-script", "start", "desktop"]
12+
"runtimeArgs": ["run", "start", "desktop", "--", "--app", "excel"]
13+
},
14+
{
15+
"name": "PowerPoint Desktop",
16+
"type": "node",
17+
"request": "launch",
18+
"runtimeExecutable": "npm",
19+
"runtimeArgs": ["run", "start", "desktop", "--", "--app", "powerpoint"]
20+
},
21+
{
22+
"name": "Word Desktop",
23+
"type": "node",
24+
"request": "launch",
25+
"runtimeExecutable": "npm",
26+
"runtimeArgs": ["run", "start", "desktop", "--", "--app", "word"]
27+
},
28+
{
29+
"name": "Office Online (Chrome)",
30+
"type": "chrome",
31+
"request": "launch",
32+
// To debug your Add-in:
33+
// 1. When prompted, enter the url (share link) to an Office Online document.
34+
// 2. Sideload your Add-in. https://docs.microsoft.com/en-us/office/dev/add-ins/testing/sideload-office-add-ins-for-testing
35+
"url": "${input:officeOnlineDocumentUrl}",
36+
"webRoot": "${workspaceFolder}",
37+
"preLaunchTask": "Debug: Web"
1338
},
1439
{
1540
"name": "Office Online (Edge)",

‎Debugging.md

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
# Debugging
2+
3+
## Using Visual Studio Code
4+
5+
1. Open the folder in VS Code.
6+
2. Run the `Watch` task using `Terminal`, `Run Task`.
7+
3. Run the `Dev Server` task using `Terminal`, `Run Task`.
8+
9+
10+
### Office Online (Edge - Windows 10 / Chrome - Mac)
11+
1. Switch to the Debug view using `View`, `Debug` or press Ctrl+Shift+D.
12+
2. Choose the desired debug configuration:
13+
* `Office Online (Edge)`
14+
* `Office Online (Chrome)`
15+
3. Start debugging by pressing F5 or the green play icon.
16+
4. When prompted, paste the url for an Office document. You can obtain this by copying the link when sharing a document.
17+
5. Use `Insert`, `Add-ins` to upload the manifest file. [More info](https://docs.microsoft.com/en-us/office/dev/add-ins/testing/sideload-office-add-ins-for-testing_)
18+
* NOTE: You can also use the browser dev tools to debug.
19+
20+
21+
### Excel / PowerPoint / Word (Windows / Mac)
22+
1. Switch to the Debug view.
23+
2. Choose the desired debug configuration from the list:
24+
* `Excel Desktop`
25+
* `PowerPoint Desktop`
26+
* `Word Desktop`
27+
3. Choose `Start Without Debugging` from the `Debug` menu.
28+
NOTE: The integrated VSCode debugger cannot debug the Office Add-in running in the task pane.
29+
4. To debug, you need to use another debugger:
30+
* `Edge DevTools` (Windows 10)
31+
* `F12 DevTools` (Windows)
32+
* `Visual Studio` (Windows)
33+
* `Safari Inspector` (Mac)
34+
35+
36+
## From the command line
37+
38+
### Watch / Build
39+
* Use `npm run watch` to run build for development, and rebuild automatically when a source file is saved.
40+
* If you would rather build manually, use `npm run build-dev` to build for development.
41+
* To build for production, use `npm run build`.
42+
43+
### Dev Server
44+
* Use `npm run dev-server` to run the dev-server.
45+
46+
### Debugging (Desktop)
47+
* To start debugging, use `npm start desktop -- --app {app}` where `{app}` is `excel`, `powerpoint`, or `word`.
48+
* Be sure to build or run watch beforehand.
49+
* If the dev-server is not already running, it will run the dev-server in a separate window.
50+
* The add-in will be configured for debugging, and a document will be opened which loads the add-in.
51+
* Once you're done debugging, use `npm stop desktop -- --app {app}` so the add-in is no longer configured for debugging.
52+
53+
### Debugging (Office Online)
54+
* To start debugging, use `npm start web`.
55+
* Be sure to build or run watch beforehand.
56+
* If the dev-server is not already running, it will run the dev-server in a separate window.
57+
* Open the desired Office document in the browser.
58+
* Use `Insert`, `Add-ins` to upload the manifest file. [More info](https://docs.microsoft.com/en-us/office/dev/add-ins/testing/sideload-office-add-ins-for-testing_)
59+
* Use the browser dev tools to debug.

‎manifest.xml

Lines changed: 118 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,14 +13,131 @@
1313
<AppDomain>contoso.com</AppDomain>
1414
</AppDomains>
1515
<Hosts>
16+
<Host Name="Document"/>
17+
<Host Name="Notebook"/>
18+
<Host Name="Presentation"/>
1619
<Host Name="Workbook"/>
17-
</Hosts>
20+
</Hosts>
1821
<DefaultSettings>
1922
<SourceLocation DefaultValue="https://localhost:3000/taskpane.html"/>
2023
</DefaultSettings>
2124
<Permissions>ReadWriteDocument</Permissions>
2225
<VersionOverrides xmlns="http://schemas.microsoft.com/office/taskpaneappversionoverrides" xsi:type="VersionOverridesV1_0">
2326
<Hosts>
27+
<Host xsi:type="Document">
28+
<DesktopFormFactor>
29+
<GetStarted>
30+
<Title resid="Contoso.GetStarted.Title"/>
31+
<Description resid="Contoso.GetStarted.Description"/>
32+
<LearnMoreUrl resid="Contoso.GetStarted.LearnMoreUrl"/>
33+
</GetStarted>
34+
<FunctionFile resid="Contoso.Ribbon.Url" />
35+
<ExtensionPoint xsi:type="PrimaryCommandSurface">
36+
<OfficeTab id="TabHome">
37+
<Group id="Contoso.Group1">
38+
<Label resid="Contoso.Group1Label" />
39+
<Icon>
40+
<bt:Image size="16" resid="Contoso.tpicon_16x16" />
41+
<bt:Image size="32" resid="Contoso.tpicon_32x32" />
42+
<bt:Image size="80" resid="Contoso.tpicon_80x80" />
43+
</Icon>
44+
<Control xsi:type="Button" id="Contoso.TaskpaneButton">
45+
<Label resid="Contoso.TaskpaneButton.Label" />
46+
<Supertip>
47+
<Title resid="Contoso.TaskpaneButton.Label" />
48+
<Description resid="Contoso.TaskpaneButton.Tooltip" />
49+
</Supertip>
50+
<Icon>
51+
<bt:Image size="16" resid="Contoso.tpicon_16x16" />
52+
<bt:Image size="32" resid="Contoso.tpicon_32x32" />
53+
<bt:Image size="80" resid="Contoso.tpicon_80x80" />
54+
</Icon>
55+
<Action xsi:type="ShowTaskpane">
56+
<TaskpaneId>ButtonId1</TaskpaneId>
57+
<SourceLocation resid="Contoso.Taskpane.Url" />
58+
</Action>
59+
</Control>
60+
</Group>
61+
</OfficeTab>
62+
</ExtensionPoint>
63+
</DesktopFormFactor>
64+
</Host>
65+
<Host xsi:type="Notebook">
66+
<DesktopFormFactor>
67+
<GetStarted>
68+
<Title resid="Contoso.GetStarted.Title"/>
69+
<Description resid="Contoso.GetStarted.Description"/>
70+
<LearnMoreUrl resid="Contoso.GetStarted.LearnMoreUrl"/>
71+
</GetStarted>
72+
<FunctionFile resid="Contoso.Ribbon.Url" />
73+
<ExtensionPoint xsi:type="PrimaryCommandSurface">
74+
<OfficeTab id="TabHome">
75+
<Group id="Contoso.Group1">
76+
<Label resid="Contoso.Group1Label" />
77+
<Icon>
78+
<bt:Image size="16" resid="Contoso.tpicon_16x16" />
79+
<bt:Image size="32" resid="Contoso.tpicon_32x32" />
80+
<bt:Image size="80" resid="Contoso.tpicon_80x80" />
81+
</Icon>
82+
<Control xsi:type="Button" id="Contoso.TaskpaneButton">
83+
<Label resid="Contoso.TaskpaneButton.Label" />
84+
<Supertip>
85+
<Title resid="Contoso.TaskpaneButton.Label" />
86+
<Description resid="Contoso.TaskpaneButton.Tooltip" />
87+
</Supertip>
88+
<Icon>
89+
<bt:Image size="16" resid="Contoso.tpicon_16x16" />
90+
<bt:Image size="32" resid="Contoso.tpicon_32x32" />
91+
<bt:Image size="80" resid="Contoso.tpicon_80x80" />
92+
</Icon>
93+
<Action xsi:type="ShowTaskpane">
94+
<TaskpaneId>ButtonId1</TaskpaneId>
95+
<SourceLocation resid="Contoso.Taskpane.Url" />
96+
</Action>
97+
</Control>
98+
</Group>
99+
</OfficeTab>
100+
</ExtensionPoint>
101+
</DesktopFormFactor>
102+
</Host>
103+
<Host xsi:type="Presentation">
104+
<DesktopFormFactor>
105+
<GetStarted>
106+
<Title resid="Contoso.GetStarted.Title"/>
107+
<Description resid="Contoso.GetStarted.Description"/>
108+
<LearnMoreUrl resid="Contoso.GetStarted.LearnMoreUrl"/>
109+
</GetStarted>
110+
<FunctionFile resid="Contoso.Ribbon.Url" />
111+
<ExtensionPoint xsi:type="PrimaryCommandSurface">
112+
<OfficeTab id="TabHome">
113+
<Group id="Contoso.Group1">
114+
<Label resid="Contoso.Group1Label" />
115+
<Icon>
116+
<bt:Image size="16" resid="Contoso.tpicon_16x16" />
117+
<bt:Image size="32" resid="Contoso.tpicon_32x32" />
118+
<bt:Image size="80" resid="Contoso.tpicon_80x80" />
119+
</Icon>
120+
<Control xsi:type="Button" id="Contoso.TaskpaneButton">
121+
<Label resid="Contoso.TaskpaneButton.Label" />
122+
<Supertip>
123+
<Title resid="Contoso.TaskpaneButton.Label" />
124+
<Description resid="Contoso.TaskpaneButton.Tooltip" />
125+
</Supertip>
126+
<Icon>
127+
<bt:Image size="16" resid="Contoso.tpicon_16x16" />
128+
<bt:Image size="32" resid="Contoso.tpicon_32x32" />
129+
<bt:Image size="80" resid="Contoso.tpicon_80x80" />
130+
</Icon>
131+
<Action xsi:type="ShowTaskpane">
132+
<TaskpaneId>ButtonId1</TaskpaneId>
133+
<SourceLocation resid="Contoso.Taskpane.Url" />
134+
</Action>
135+
</Control>
136+
</Group>
137+
</OfficeTab>
138+
</ExtensionPoint>
139+
</DesktopFormFactor>
140+
</Host>
24141
<Host xsi:type="Workbook">
25142
<DesktopFormFactor>
26143
<GetStarted>

‎package-lock.json

Lines changed: 17 additions & 14 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,19 +7,26 @@
77
},
88
"license": "MIT",
99
"config": {
10+
"app-to-debug": "excel",
1011
"app-type-to-debug": "desktop",
1112
"dev-server-port": 3000
1213
},
1314
"scripts": {
1415
"build": "webpack -p --mode production",
1516
"build-dev": "webpack --mode development",
1617
"dev-server": "webpack-dev-server --mode development",
17-
"sideload": "office-toolbox sideload -m manifest.xml -a excel",
18+
"sideload": "echo Please specify which app using 'npm run sideload:app'.",
19+
"sideload:excel": "office-toolbox sideload -m manifest.xml -a excel",
20+
"sideload:powerpoint": "office-toolbox sideload -m manifest.xml -a powerpoint",
21+
"sideload:word": "office-toolbox sideload -m manifest.xml -a word",
1822
"start": "office-addin-debugging start manifest.xml",
1923
"start:desktop": "office-addin-debugging start manifest.xml desktop",
2024
"start:web": "office-addin-debugging start manifest.xml web",
2125
"stop": "office-addin-debugging stop manifest.xml",
22-
"unload": "office-toolbox remove -m manifest.xml -a excel",
26+
"unload": "echo Please specify which app using 'npm run unload:app'.",
27+
"unload:excel": "office-toolbox remove -m manifest.xml -a excel",
28+
"unload:powerpoint": "office-toolbox remove -m manifest.xml -a powerpoint",
29+
"unload:word": "office-toolbox remove -m manifest.xml -a word",
2330
"validate": "office-toolbox validate -m manifest.xml",
2431
"watch": "webpack --mode development --watch"
2532
},
@@ -42,7 +49,7 @@
4249
"fs": "0.0.1-security",
4350
"html-loader": "^0.5.5",
4451
"html-webpack-plugin": "^3.2.0",
45-
"office-addin-debugging": "^2.0.0",
52+
"office-addin-debugging": "^2.1.0",
4653
"office-toolbox": "^0.1.1",
4754
"source-map-loader": "^0.2.4",
4855
"ts-loader": "^5.3.1",

0 commit comments

Comments
 (0)