How to get 'Commands' button working in Office Addins?

Question

How to get 'Commands' button working in Office Addins?

I have issue that any function I use for button does not work + I don't know how to debug Office Commands.

Excel Version 1904 (build 11527.20004)

When I use F12 debugger and attach to the IE process for my addin (task pane), then when I click the button I'll get unhandled exception and prompt to attach debugger, If I do so with my VS 2017, I will get this:

Unhandled exception at line 18, column 27179 in https://appsforoffice.microsoft.com/lib/1.1/hosted/office.js 0x800a01b6 - JavaScript runtime error: Object doesn't support property or method 'filter' occurred

What I did: - manifest seems correct (validation passed), it has all the nodes, buttons are visible in the ribbon. - after enabling loopback exemption (I run it on my localhost together with IIS server) reference to the DesktopFunctionFile seems fine, fiddler shows it is retrieved correctly - for the "ExecuteFunction" I used multiple functions like - Show Custom Dialog (nothing happens) - Write some data into the sheet (nothing happens) - any used console.log does not show anywhere (I was expecting to see it in the Runtime log). - I use the event.completed();

I only see "RibbonTest is working on Test" at the bottom of Excel when clicked on "Test" button. "RibbonTest" is name of my addin.

I used this sample as a base for my 'FunctionFile' html (just head part): https://github.com/OfficeDev/Office-Add-in-Dialog-API-Simple-Example/blob/2304d66438323239eb81e61b734bd8b231cc4615/SimpleDialogSampleWeb/FunctionFile.html

<head> 
   <script src="https://appsforoffice.microsoft.com/lib/1.1/hosted/office.js" type="text/javascript"></script>
    <script>
        var clickEvent;
        // The initialize function must be defined each time a new page is loaded
        (function () {
            Office.initialize = function (reason) {
               // If you need to initialize something you can do so here.
            };
        })();
        // Wrap the writeToDoc in showNotification because showNotification is called
        // in DialogHelper.js but must be defined differently when the dialog is called
        // from a task pane instead of a custom menu command.
        function showNotification(event)
        {
            clickEvent = event;
            writeToDoc();
            //Required, call event.completed to let the platform know you are done processing.
            clickEvent.completed();
        }

        function writeToDoc()
        {
            console.log("WriteToDoc.");
            Excel.run(function (context) {
                var sheet = context.workbook.worksheets.getActiveWorksheet();
                var range = sheet.getRange("B2");
                range.values = [[ 5 ]];
                return context.sync();
            });
        }
    </script>
</head>

Does anyone know how to debug the 'Commands' in Office Addins? Any tip for getting this running is more than welcome! Thanks.

javascript

office-js

asked on Stack Overflow Apr 4, 2019 by

4tt1 • edited Apr 5, 2019 by

4tt1

1 Answer

To debug the JavaScript of an Add-in Command, you need to debug it with Office Online.

answered on Stack Overflow Apr 5, 2019 by

Rick Kirkham

User contributions licensed under CC BY-SA 3.0