APS (Forge) Viewer in Sharepoint - Error loading Autodesk Viewer library - autodesk-forge

Question

I am trying to integrate APS Viewer (formerly Forge Viewer) in a Sharepoint webpart using Sharepoint Framework. There is a post in the blog explaining how to do it: https://aps.autodesk.com/blog/sharepoint-online-integration.
I have adapted the code provided, however, I always end up with this error when loading the Viewer. The error occurs when calling Autodesk.Viewing.Initializer function to initialize the viewer. This call fails because
"ReferenceError: Autodesk is not defined"
yet the library is imported correctly. Anyone knows how can I solve this?
These are the steps we did:
Create a webpart with Sharepoint Framework. No Framework template is selected.
Add custom js script with functions to load the viewer.
Import Autodesk js library for Viewer with SPComponentLoader and load custom js script in render() function of our Sharepoint webpart.
SPComponentLoader.loadScript("https://developer.api.autodesk.com/modelderivative/v2/viewers/7.*/viewer3D.min.js");
SPComponentLoader.loadScript("./js/ForgeTree.js");
const viewer: any = require("./ForgeViewer.js");
Call custom function launchViewer from custom js script that calls Autodesk.Viewing.Initializer method. This step fails.
export function launchViewer(urn, viewableId, accessToken) {
console.log('launchViewer')
var options = {
env: 'AutodeskProduction',
getAccessToken: callback => {
callback(accessToken, 3600);
},
// api: 'derivativeV2' + (atob(urn.replace('_', '/')).indexOf('emea') > -1 ? '_EU' : '') // handle OSS US and EU regions
api: 'derivativeV2' + (Buffer.from((urn.replace('_', '/')).indexOf('emea') > -1 ? '_EU' : ''), 'base64') // handle OSS US and EU regions
};
if (viewer === undefined) {
Autodesk.Viewing.Initializer(options, () => {
viewer = new Autodesk.Viewing.GuiViewer3D(document.getElementById('forgeViewer'), { extensions: [ 'Autodesk.DocumentBrowser'] });
viewer.start();
var documentId = 'urn:' + urn;
Autodesk.Viewing.Document.load(documentId, onDocumentLoadSuccess, onDocumentLoadFailure);
})
} else {
var documentId = 'urn:' + urn;
Autodesk.Viewing.Document.load(documentId, onDocumentLoadSuccess, onDocumentLoadFailure);
}
}

Answer 1

I think you should simply wait for the SPComponentLoader.loadScript() to finish (use await or then()) as it returns a Promise<TModule>
https://learn.microsoft.com/en-us/javascript/api/sp-loader/spcomponentloader?view=sp-typescript-latest##microsoft-sp-loader-spcomponentloader-loadscript-member(1)
I probably got away with not doing that in my code because the authentication is taking place after that call, which gives extra time for loadScript to finish