Why WebIde shows error for alert and console.log? - sapui5

I am using WebIde of SAPUI5 development.
If I write a console.log or alert it shows error of unexpected Alert and so on inside of the editor.
While the code works and I prefer to not see these errors inside of the editor.
How can I customize WebIde to not show these kind of errors.

While it is discouraged to use console.log and alert statements in your code because
[...] such messages are considered to be for debugging purposes and therefore not suitable to ship to the client [...]
http://eslint.org/docs/rules/no-console
and
[...] JavaScripts’ alert, confirm, and prompt functions are widely considered to be obtrusive as UI elements and should be replaced by a more appropriate custom UI implementation [...]
http://eslint.org/docs/rules/no-alert
you can have your Linter configured to bypass these checks (although I would not recommend to do so)
But keep in mind these checks are not specific to SAPUI5 or Web IDE, rather for every Javascript project!
Anyway, since Web IDE uses ESLint, to disable the check, add the following on top of the affected Javascript file:
/*eslint-disable no-console, no-alert */

Related

UI5 parameters: data-sap-ui-xx-waitfortheme and data-sap-ui-xx-componentpreload

The UI5 HTML-bootstrapper has two parameters which I don't really understand:
data-sap-ui-xx-componentpreload
data-sap-ui-xx-waitfortheme
I've checked the official documentation and didn't get some straightforward description.
My questions:
When should I use data-sap-ui-xx-componentpreload and what are its benefits?
When should I use data-sap-ui-xx-waitfortheme and what are its benefits?
⚠️ First things first ...
xx- options are experimental. They may be removed in future UI5 versions or their behavior may change in an incompatible way.
Option sap-ui-xx-componentPreload
By default, UI5 requests the app bundle Component-preload.js automatically when creating ComponentContainer (e.g. via data-sap-ui-oninit="module:sap/ui/core/ComponentSupport").
The bundle is generated by UI5 tooling for deployment so that users finally use the optimized version of the app. Therefore, avoid shipping the standalone app with data-sap-ui-xx-componentpreload in index.html! Otherwise, users will end up using unnecessarily the unminified, unbundled developer version of the app.
Options in index.html (data-sap-ui-*) don't affect typical Fiori launchpad (FLP) apps as FLP uses its own HTML page.
Using sap-ui-xx-componentPreload makes only sense for previewing, testing, or demo scenarios where there is no Node.js environment (unable to use UI5 tooling) so that 404-errors can be avoided. SAP Web IDE, for example, used to append the option sap-ui-xx-componentPreload=off in the URL so that the preview runs without the 404-error.
Values
async or sync by default depending on the sap-ui-preload / sap-ui-async settings.
off to load Component.js instead of Component-preload.js despite having a ComponentContainer.
Option sap-ui-xx-waitForTheme
The xx-waitForTheme option helps to avoid FOUC (Flash Of Unstyled Content) and, in some cases, to reduce sync XHRs. The option tells the app to postpone certain tasks until the theme has been loaded and applied.
Values (since UI5 1.63)
init waits for the theme → executes Core's init handler (attachInit(fn)) → renders the app.
Use this if some controls try to access theme-dependent parameters via sap/ui/core/theming/Parameters.get synchronously (deprecated) too soon.
rendering (formerly true until 1.62) executes Core's init handler first → waits for the theme → initializes the rendering.
If there is no value set, Core's init and initial rendering are executed immediately without waiting for the theme → FOUC.
For more options and information, see Configuration Options and URL Parameters and its parent topics.

UIATable operation GetCellValue throws error "Failed due to a lacking or broken API call inherited from UI Automation"

I am using the UI Automation add-in to automate and test an application that contains HTML objects in a Java window. I have the UIATable identified & saved in my object repository and the following methods work fine:
MsgBox UIAWindow("**").UIAObject("**").UIATable("**").RowCount 'Prints 3
MsgBox UIAWindow("**").UIAObject("**").UIATable("**").ColumnCount 'Prints 5
However, when I try to get cell value using any of the below methods:
MsgBox UIAWindow("**").UIAObject("**").UIATable("**").GetCellValue(1,1) 'Error
MsgBox UIAWindow("**").UIAObject("**").UIATable("**").GetCellData(1,1) 'Error
MsgBox UIAWindow("**").UIAObject("**").UIATable("**").GetCellName(1,1) 'Error
I get an error pop up with the following message:
The test run cannot continue due to an unrecoverable error.
<0x80070057> Failed due to a lacking or broken API call inherited from
UI Automation.
I am using UFT 14.02. What might be the possible reason for this error and is there something I can do to resolve this?
Have a look at the UFT 14 Product Availability Matrix. You want the section "UFT GUI Testing UI Automation Add-in".
JavaFX is supported but HTML is not supported by the UI Automation Framework in UFT.
That might be why some methods work and others do not. i.e. You can read the java table, but cannot validate the html content.
(I assume you are testing against a javaFX application? - you just say java)
It's worth saying that "Not Supported" doesn't mean it will not work, just that it's not been fully tested and certified by Microfocus.
Additionally, if you check the support pages it has a big note:
Note: The test objects and methods available are completely dependent on the properties and patterns implemented in your application. We recommend that you familiarize yourself with the properties of your application's objects - specifically the Control Type IDs and supported patterns to understand what test objects and methods you can use.
So the error might not be you, and might not be UFT. It might be a result of the delivery of the application under test.
Things you can try...
Try the actual java add-in - it is possible to use multiple add-ins concurrently - even if it's a work around for just one object.
Try the standard windows object identifiers.
Confirm the application is built to support Microsoft's UI Automation
Update to the latest UFT (UFT 15.01 at time of writing, now also called UFT One) to make sure your libraries are as up to date as possible
If all that fails let me know. UFT is very flexible around the GUI and depending on how you need to interact with the table there are some other solutions we can try.

Imprecise descriptions of bugs/exceptions when debugging EJS templates

EJS documentation at ejs.co says "It's easy to debug EJS errors: your errors are plain JavaScript exceptions, with template line-numbers included.".
However, when debugging the code with an bug in the template, I only get references to the functions inside my cza.js module that calls the ejs.renderFile and references to the "internal" errors within the EJS (ejs.js) itself. Reference to the bug within the .ejs template (ideally the line-number) is missing, in fact the template goes unmentioned.
So, the screenshot is of an the error within ejs.js, where EJS itself got stuck processing the bugged template, NOT the template itself, and so worthless:
So, how do I get the debugger to point out the bug in my template?
So, I have just found out that EJS does print out the code to terminal, unless a debugger does not step in to handle the exception before EJS can point out the bug.
In my scenario, I debug the app using node --inspect app.js, with debug auto-attach in VS Code enabled. The debugger then describes the exception as shown in the question screenshot.
How I found out the debugger was blocking EJS's output to terminal? I had a browser already requesting the app, when I launched it and the exception occured within the second before the debugger was attached.

In GWT, which javascript function run when you click on a button?

GWT auto generate the JavaScript code.
I could not understand the generated code event mechanism.
for instance, which function run when I click on a button?
I would love to see the javascript that GWT generates for button with explanations
For event handling, GWT attaches a EventListener (generally, your widget) as an expando property (called __listener) of the elements. The events are then all handled by a single dispatch method that looks at the __listener expando of the event's target and dispatches the event to it. Of course, the dispatch method does a bit more (event previewing, entry/finally scheduled commands, etc.)
This dance is (or at least was) required to avoid memory leaks in browsers (mainly IE). You can find more details in the GWT wiki: https://code.google.com/p/google-web-toolkit/wiki/DomEventsAndMemoryLeaks
When you develop in GWT, you don't care about JavaScript.
You should look at the Java code, and search for a function that handles the click event for your button.
When you compile the code Compiler will generate the autoamted Javascript functions ...And that too in compressed (thats depends on your compile type).
It is very hard to find the corresponding function and widget id because those are generated by compiler ..So its better to debug your gwt code is hosted mode ..
Even you want to read the generated code while compiling give the compilation type to
DETAILED, which improves on PRETTY with even more detail (such as very verbose variable names)
Still more details available here .
You should use GWT Compiler options STYLE whenever you need to understand the GWT's output js. GWT by default compresses and obfuscates the javascript output as it uses OBF as default value for STYLE.
To prevent compression and obfuscation you can use PRETTY or DETAILED as the parameter to STYLE argument.
NOTE: You should always use OBF mode for production as it ensures smallest bandwidth usage along with obfuscation.
Reference - https://developers.google.com/web-toolkit/doc/latest/DevGuideCompilingAndDebugging#DevGuideCompilerOptions

Dynamically loaded javascript doesn't show in sources panel?

For example, I have an ajax request and it returns <script src='buggy.js'></script>.
Problem is, it doesn't show up in sources or resources panel. That means I can't do all the cool stuffs like adding breakpoint and inspecting the elements as they run.
I could only see the source of the js file under the Network panel.
Is there anyway to make chrome add them to the sources panel?
Or how do you guys go about debugging dynamically added scripts?
Using Canary.
I was having the same problem, and I found a workaround that is better than the deliberate exception. It does still require changing the code as opposed to just setting a breakpoint inside the chrome dev tools.
I tried using the "//# sourceURL=dynamicScript.js" that was suggested as a workaround by the OP, but it still wasn't showing up for me unless it already existed in my tabs from a previous time when it produced an exception.
Coding a "debugger;" line forced it to break at that location. Then once it was in my tabs in the Sources panel, I could set breakpoints like normal and remove the "debugger;" line.
Please refer to https://developer.chrome.com/devtools/docs/javascript-debugging#breakpoints-dynamic-javascript
(Original link is broken-- archived link below)
http://web.archive.org/web/20141016164821/https://developer.chrome.com/devtools/docs/javascript-debugging#breakpoints-dynamic-javascript ("Breakpoints in Dynamic JavaScript").