[Bug]: issue with Script load

TravelTechCode commented 2 months ago

OData Version

OData V4

Draft

No

Scenario

Fiori Elements

Environment

BAS

UI5 Spreadsheet Component

v1.2.0

What happened?

Failed to load component error in deployed version of the app. I am also using the latest version of "ui5-task-btp-manifest": "^0.2.2"., This app is working locally.

Relevant log output

Log-dbg.js?eval:497 2024-08-14 16:00:07.816699 failed to load JavaScript resource: cc/spreadsheetimporter/v1_2_0/Component.js -  sap.ui.ModuleSystem
log @ Log-dbg.js?eval:497
Log.error @ Log-dbg.js?eval:247
Logger.error @ Log-dbg.js?eval:683
onerror @ ui5loader-dbg.js:1486
error
loadScript @ ui5loader-dbg.js:1495
onerror @ ui5loader-dbg.js:1482
error
loadScript @ ui5loader-dbg.js:1495
requireModule @ ui5loader-dbg.js:1718
requireAll @ ui5loader-dbg.js:1888
fnRequire @ ui5loader-dbg.js:2159
eval @ Component-dbg.js?eval:3705
eval @ Component-dbg.js?eval:3703
Promise.then
loadComponent @ Component-dbg.js?eval:3698
Component.load @ Component-dbg.js?eval:2924
eval @ Manifest-dbg.js?eval:584
eval @ Manifest-dbg.js?eval:579
Promise.then
_loadDependencies @ Manifest-dbg.js?eval:577
loadDependenciesAndIncludes @ Manifest-dbg.js?eval:747
eval @ Component-dbg.js?eval:2791
Promise.then
loadDependenciesAndIncludes @ Component-dbg.js?eval:2790
eval @ Component-dbg.js?eval:2794Understand this error
Log-dbg.js?eval:497 2024-08-14 16:00:07.817900 [FUTURE FATAL] Failed to load component for container container - ModuleError: failed to load 'cc/spreadsheetimporter/v1_2_0/Component.js' from thirdparty/customcontrol/spreadsheetimporter/v1_2_0/Component.js: script load error  
 ModuleError: failed to load 'cc/spreadsheetimporter/v1_2_0/Component.js' from thirdparty/customcontrol/spreadsheetimporter/v1_2_0/Component.js: script load error
    at makeModuleError (https://magdev.launchpad.cfapps.us10.hana.ondemand.com/577b0129-9ad3-4de3-8c5a-d088230ad054.combscilatamexternalmaterialmapping.combscilatamexternalmaterialmapping-0.0.1/resources/sap-ui-core-dbg.js:1192:17)
    at Module.failWith (https://magdev.launchpad.cfapps.us10.hana.ondemand.com/577b0129-9ad3-4de3-8c5a-d088230ad054.combscilatamexternalmaterialmapping.combscilatamexternalmaterialmapping-0.0.1/resources/sap-ui-core-dbg.js:960:16)
    at HTMLScriptElement.onerror (https://magdev.launchpad.cfapps.us10.hana.ondemand.com/577b0129-9ad3-4de3-8c5a-d088230ad054.combscilatamexternalmaterialmapping.combscilatamexternalmaterialmapping-0.0.1/resources/sap-ui-core-dbg.js:1489:12)
Caused by: Error: script load error
    at HTMLScriptElement.onerror (https://magdev.launchpad.cfapps.us10.hana.ondemand.com/577b0129-9ad3-4de3-8c5a-d088230ad054.combscilatamexternalmaterialmapping.combscilatamexternalmaterialmapping-0.0.1/resources/sap-ui-core-dbg.js:1489:55)Caused by: Error: script load error
    at HTMLScriptElement.onerror (ui5loader-dbg.js:1487:1)

Spreadsheet Component Init

this.editFlow.getView().setBusyIndicatorDelay(0);
                this.editFlow.getView().setBusy(true);
                this.spreadsheetUpload = await this.editFlow.getView()
                    .getController()
                    .getAppComponent()
                    .createComponent({
                        usage: "spreadsheetimporter",
                        async: true,
                        componentData: {
                            context: this,
                            columns: ["SAP_MATNR", "EXT_MATNR", "Distributor_code"],
                            spreadsheetFileName: "External Material Mapping Template.xlsx",
                            mandatoryFields: ["SAP_MATNR", "EXT_MATNR", "Distributor_code"],
                            batchSize: 100,
                            //createActiveEntity: true,
                            i18nModel: this.getModel("i18n"),
                            //  useTableSelector: true
                        },
                    });
                this.spreadsheetUpload.openSpreadsheetUploadDialog();
                this.editFlow.getView().setBusy(false);
            }
        });
    }
);

Manifest

{
  "_version": "1.59.0",
  "sap.app": {
    "id": "com.bsci.latam.externalmaterialmapping",
    "type": "application",
    "i18n": "i18n/i18n.properties",
    "applicationVersion": {
      "version": "0.0.1"
    },
    "title": "{{appTitle}}",
    "description": "{{appDescription}}",
    "resources": "resources.json",
    "sourceTemplate": {
      "id": "@sap/generator-fiori:fpm",
      "version": "1.14.0",
      "toolsId": "59f67acd-5e32-4722-8f54-22bad5e91646"
    },
    "dataSources": {
      "mainService": {
        "uri": "/SalesEnablement/",
        "type": "OData",
        "settings": {
          "annotations": [
            "annotation"
          ],
          "localUri": "localService/metadata.xml",
          "odataVersion": "4.0"
        }
      },
      "annotation": {
        "type": "ODataAnnotation",
        "uri": "annotations/annotation.xml",
        "settings": {
          "localUri": "annotations/annotation.xml"
        }
      }
    },
    "crossNavigation": {
      "inbounds": {
        "externalmaterialmapping-upload": {
          "semanticObject": "externalmaterialmapping",
          "action": "upload",
          "title": "{{flpTitle}}",
          "signature": {
            "parameters": {},
            "additionalParameters": "allowed"
          }
        }
      }
    }
  },
  "sap.ui": {
    "technology": "UI5",
    "icons": {
      "icon": "",
      "favIcon": "",
      "phone": "",
      "phone@2": "",
      "tablet": "",
      "tablet@2": ""
    },
    "deviceTypes": {
      "desktop": true,
      "tablet": true,
      "phone": true
    }
  },
  "sap.ui5": {
    "flexEnabled": false,
    "dependencies": {
      "minUI5Version": "1.125.1",
      "libs": {
        "sap.m": {},
        "sap.ui.core": {},
        "sap.ushell": {},
        "sap.fe.templates": {}
      },
      "components": {
        "cc.spreadsheetimporter.v1_2_0": {}
      }
    },
    "contentDensities": {
      "compact": true,
      "cozy": true
    },
    "models": {
      "i18n": {
        "type": "sap.ui.model.resource.ResourceModel",
        "settings": {
          "bundleName": "com.bsci.latam.externalmaterialmapping.i18n.i18n"
        }
      },
      "": {
        "dataSource": "mainService",
        "preload": true,
        "settings": {
          "operationMode": "Server",
          "autoExpandSelect": true,
          "earlyRequests": true
        }
      },
      "@i18n": {
        "type": "sap.ui.model.resource.ResourceModel",
        "uri": "i18n/i18n.properties"
      }
    },
    "resources": {
      "css": []
    },
    "resourceRoots": {
      "cc.spreadsheetimporter.v1_2_0": "./thirdparty/customcontrol/spreadsheetimporter/v1_2_0"
    },
    "componentUsages": {
      "spreadsheetimporter": {
        "name": "cc.spreadsheetimporter.v1_2_0"
      }
    },
    "routing": {
      "config": {},
      "routes": [
        {
          "name": "MaterialMappingEhanaMain",
          "pattern": ":?query:",
          "target": "MaterialMappingEhanaMain"
        }
      ],
      "targets": {
        "MaterialMappingEhanaMain": {
          "type": "Component",
          "id": "MaterialMappingEhanaMain",
          "name": "sap.fe.core.fpm",
          "options": {
            "settings": {
              "viewName": "com.bsci.latam.externalmaterialmapping.ext.main.Main",
              "contextPath": "/MaterialMappingEhana"
            }
          }
        }
      }
    }
  },
  "sap.cloud": {
    "public": true,
    "service": "combscilatamexternalmaterialmapping"
  }
}

marianfoo commented 2 months ago

I see no error here. Did you check the deployed version if all the ressources are deployed and caches are deleted?

TravelTechCode commented 2 months ago

Yeah, The deployed file is of the version that of the local file here is the error when i start the app from the fiori launchpad.

Ui5ComponentLoader-dbg.js:84 Uncaught (in promise) ModuleError: failed to load 'cc/spreadsheetimporter/v1_2_0/Component.js' from ../577b0129-9ad3-4de3-8c5a-d088230ad054.combscilatamexternalmaterialmapping.combscilatamexternalmaterialmapping/~140824101543+0000~/thirdparty/customcontrol/spreadsheetimporter/v1_2_0/Component.js: 404

marianfoo commented 2 months ago

Yeah, it does not find the component, i dont know whats going on with that error alone

TravelTechCode commented 2 months ago

also in the sources i dont see this /thirdparty/customcontrol/spreadsheetimporter/v1_2_0 directory ..

marianfoo commented 2 months ago

check where you use the namespace anywhere like in the yaml file to build? There could be the namespace as well Just always search for the namespace globally in your project, not just manifest

TravelTechCode commented 2 months ago

Yes i have a namespace for the project "sap.cloud": { "public": true, "service": "combscilatamexternalmaterialmapping" }

in the ui5.yaml file also

metadata: name: com.bsci.latam.externalmaterialmapping

the service name is derived from it "com.bsci.latam" is namespace and "externalmaterialmapping" is the service name any adjustment i need to make??

marianfoo commented 2 months ago

i dont know how i can help you

TravelTechCode commented 2 months ago

I meant that do you think the namespace causing any issues here??

marianfoo commented 2 months ago

has nothing to do with my component, maybe with the deployment, but i dont know whats going wrong here

TravelTechCode commented 2 months ago

is central deployment of the spreadsheetimporter mandatory ??

TravelTechCode commented 2 months ago

Hi @marianfoo found the issue was with the ui5-task-zipper config. i see that the version also needs to be added here. earlier it wasnt the case if i am not mistaken.. builder: customTasks:

name: ui5-task-zipper afterTask: generateComponentPreload configuration: archiveName: uimodule includeDependencies:
- ui5-cc-spreadsheetimporter-v1-2-0 the app is loading now.., :)

yousseftoumi commented 1 month ago

Hello @marianfoo, I'm facing the same issue but in my case I am using the spreadsheet importer as a ui5 application and not as a ressource. In my application I have four entities where I use the spreadsheet importer

It is working just fine in all four of them locally but in the deployed version of the app it is only working in 3 of them

And it gets stuck on loading and shows me this error in first entity Products

Do you have any idea why it doesn't work in just that entity ?Please I need to solve this asap

spreadsheetimporter / ui5-cc-spreadsheetimporter