I'm new to Office Add-ins so this might be a trivial mistake. For this Typescript React Add-in I have created a Context Menu Extension Point that on click is supposed to run a custom function getButton(), which for now just console.logs a simple string ("berry !"). However instead of doing that, upon click it opens up a small Developer Window and displays the body tag of the commands.html file. When I rightclick that window and look at the console of it, that's where I see my function print the test-string. I want that Developer Window not to open at all instead, and log the string inside taskpane console.
What am I doing wrong?
manifest.xml
<FunctionFile resid="Commands.Url" />
<!-- other stuff -->
<ExtensionPoint xsi:type="ContextMenu">
<OfficeMenu id="ContextMenuText">
<Control xsi:type="Menu" id="TestMenu2">
<Label resid="residLabel" />
<Supertip>
<Title resid="residLabel" />
<Description resid="residToolTip" />
</Supertip>
<Icon>
<bt:Image size="16" resid="Icon.16x16" />
<bt:Image size="32" resid="Icon.32x32" />
<bt:Image size="80" resid="Icon.80x80" />
</Icon>
<Items>
<Item id="showGallery2">
<Label resid="residLabel"/>
<Supertip>
<Title resid="residLabel" />
<Description resid="residToolTip" />
</Supertip>
<Icon>
<bt:Image size="16" resid="Icon.16x16" />
<bt:Image size="32" resid="Icon.32x32" />
<bt:Image size="80" resid="Icon.80x80" />
</Icon>
<Action xsi:type="ExecuteFunction">
<FunctionName>getButton</FunctionName>
</Action>
</Item>
</Items>
</Control>
</OfficeMenu>
</ExtensionPoint>
<!-- other stuff -->
<bt:Urls>
<bt:Url id="Commands.Url" DefaultValue="https://localhost:3000/commands.html" />
<bt:Url id="Taskpane.Url" DefaultValue="https://localhost:3000/taskpane.html" />
</bt:Urls>
commands.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<!-- Office JavaScript API -->
<script type="text/javascript" src=".1/hosted/office.js"></script>
<script>
Office.onReady( () => {
Office.actions.associate("getButton", getButton);
});
function getButton(event) {
console.log("berry !");
eventpleted();
}
</script>
</head>
<body>
Commands HTML File body.
</body>
</html>
What happens when I call the function: Developer Window pops up with the content of the commands.html body tag
I'm new to Office Add-ins so this might be a trivial mistake. For this Typescript React Add-in I have created a Context Menu Extension Point that on click is supposed to run a custom function getButton(), which for now just console.logs a simple string ("berry !"). However instead of doing that, upon click it opens up a small Developer Window and displays the body tag of the commands.html file. When I rightclick that window and look at the console of it, that's where I see my function print the test-string. I want that Developer Window not to open at all instead, and log the string inside taskpane console.
What am I doing wrong?
manifest.xml
<FunctionFile resid="Commands.Url" />
<!-- other stuff -->
<ExtensionPoint xsi:type="ContextMenu">
<OfficeMenu id="ContextMenuText">
<Control xsi:type="Menu" id="TestMenu2">
<Label resid="residLabel" />
<Supertip>
<Title resid="residLabel" />
<Description resid="residToolTip" />
</Supertip>
<Icon>
<bt:Image size="16" resid="Icon.16x16" />
<bt:Image size="32" resid="Icon.32x32" />
<bt:Image size="80" resid="Icon.80x80" />
</Icon>
<Items>
<Item id="showGallery2">
<Label resid="residLabel"/>
<Supertip>
<Title resid="residLabel" />
<Description resid="residToolTip" />
</Supertip>
<Icon>
<bt:Image size="16" resid="Icon.16x16" />
<bt:Image size="32" resid="Icon.32x32" />
<bt:Image size="80" resid="Icon.80x80" />
</Icon>
<Action xsi:type="ExecuteFunction">
<FunctionName>getButton</FunctionName>
</Action>
</Item>
</Items>
</Control>
</OfficeMenu>
</ExtensionPoint>
<!-- other stuff -->
<bt:Urls>
<bt:Url id="Commands.Url" DefaultValue="https://localhost:3000/commands.html" />
<bt:Url id="Taskpane.Url" DefaultValue="https://localhost:3000/taskpane.html" />
</bt:Urls>
commands.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<!-- Office JavaScript API -->
<script type="text/javascript" src="https://appsforoffice.microsoft/lib/1.1/hosted/office.js"></script>
<script>
Office.onReady( () => {
Office.actions.associate("getButton", getButton);
});
function getButton(event) {
console.log("berry !");
eventpleted();
}
</script>
</head>
<body>
Commands HTML File body.
</body>
</html>
What happens when I call the function: Developer Window pops up with the content of the commands.html body tag
Share Improve this question edited Feb 4 at 22:44 Ken White 126k15 gold badges236 silver badges464 bronze badges asked Feb 4 at 20:43 AlfonsAlfons 152 bronze badges1 Answer
Reset to default 0- The
<body>tag of commands.html must not have anything in it. - Unless you are using a shared runtime, the command runs in its own runtime process, so the console actions will not appear in the console of the task pane's runtime.