SOLVED

Include external javascript in Command Set extension

Copper Contributor

I need to add new menu item to my document library in SP Online which would call methods from external javascript.


I have created new item in command bar (with help of MS tutorial) using SPfx and it is working.

Now, I need to call a method from external javascript, and I don't know how to do that.

I have included that script in config.json:


"externals": {
"jquery": {
"path": "https://code.jquery.com/jquery-3.6.0.min.js",
"globalName": "jquery"
},
"testScript": {
"path": "https://testPath/dist/index.js",
"globalName": "testScript"
}
}

 

and included it in my ts file with:

var _testScript = require('testScript');


But, I can't use it in code for my new button action:

@override
public onExecute(event: IListViewCommandSetExecuteEventParameters): void {
switch (event.itemId) {
case 'COMMAND_1':
console.log(_testScript); // HERE I GET EMPTY OBJECT
break;
default:
throw new Error('Unknown command');
}
}

And that custom script has methods that I need to call:

window.GetAA = {
doAction1: doAction1,
doAction2: doAction2
};


I can call this methods when I open Console tab in browser.
Why can't I do that in code??

1 Reply
best response confirmed by MarioZagreb (Copper Contributor)
Solution
I will answer my own question:
According to this:
https://stackoverflow.com/questions/14118878/using-out-of-scope-functions-in-typescript

to access window object:
if (window.hasOwnProperty('GetAA')) {
window['GetAA'].doAction1;
}
1 best response

Accepted Solutions
best response confirmed by MarioZagreb (Copper Contributor)
Solution
I will answer my own question:
According to this:
https://stackoverflow.com/questions/14118878/using-out-of-scope-functions-in-typescript

to access window object:
if (window.hasOwnProperty('GetAA')) {
window['GetAA'].doAction1;
}

View solution in original post