如何提取SAP UI5應用的技術資訊

i042416發表於2020-09-13

Suppose I need to find out the implementation of button “Create” in Customer Engagement Initiative (CEI):


如何提取SAP UI5應用的技術資訊


We could observe that once button is clicked, a pop up appears:


如何提取SAP UI5應用的技術資訊


And I have to find out how is this implemented.

Step1 Launch the application via Chrome.

Click F12 to open Chrome developer tool, and click “Inspect Element” button, and put the mouse onto the Create button,


如何提取SAP UI5應用的技術資訊


and click it. Then the html source code of this button is automatically located. However in “Event Listeners” in the right part, still I could not find information I want:


如何提取SAP UI5應用的技術資訊


Step2 Go to tab “Sources”, enable Event Listener Breakpoints with type = Mouse.click.


如何提取SAP UI5應用的技術資訊


Then switch application to debug mode by clicking “Pause” button:


如何提取SAP UI5應用的技術資訊


Then click the Create button, and expand the “Call Stack” tab:


如何提取SAP UI5應用的技術資訊


In callstack hierarchy you could see lots of framework stuff ( sap-ui-core.js ), and the highlighted entry below is just what I am looking for.

Double click on it, and the JavaScript code to open the popup window is automatically displayed. It is implemented in js view CUAN_INI_OW_WSI.view.js:228.


如何提取SAP UI5應用的技術資訊


In CEI, you could also find the corresponding deployed js view in ABAP backend, using tcode SE80 to open the BSP application.


如何提取SAP UI5應用的技術資訊


or we can also find CUAN_INI_OW_WSI.view.js manually in Sources tab:


如何提取SAP UI5應用的技術資訊


要獲取更多Jerry的原創文章,請關注公眾號"汪子熙":

如何提取SAP UI5應用的技術資訊


來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/24475491/viewspace-2719117/,如需轉載,請註明出處,否則將追究法律責任。

相關文章