SAPUI5 OPA Test - Message box - Error - testing

I am facing issues while pressing different buttons on message-boxes on JavaScript views of my SAPUI5 application. Other item seems to work fine like inserting text in text boxes, pressing buttons, selecting a row of table, etc.
I found out that every messagebox has a type/class like sapMDialogSuccess or sapMDialogError or sapMDialogWarning, etc. Do we have a similar type/class for OK, Cancel, Abort buttons (displayed on MessageBox)?
I am able to get exact text which appears on my MessageBox using:
ok(true, "This success message is displayed:- " +
sap.ui.test.Opa5.getJQuery()(".sapMDialogSuccess").
find(".sapMText").text());
But when I try following code to select (and then press) OK button, it does not work. Here is the code I am using:
//OK Button - Find & Press OK button
Then.waitFor({
pollingInterval: 5,
searchOpenDialogs: true,
controlType: "sap.m.Button",
check: function(aButton) {
if (aButton.text() === "OK") {
return !!sap.ui.test.Opa5.getJQuery()(".sapMDialogSuccess").length;
}
},
success: function() {
ok(true, "OK button found - SUCCESS");
},
errorMessage: "OK Button not found - ERROR"
});
Here is the error I am getting:
OK Button not found - ERROR
Callstack:
at Object.<anonymous> (http: //<<server>>:50000/XMII/CM/Opa-LineGroupMaintenance.html:152:22)
at Object.f (https:// sapui5.hana.ondemand.com/sdk/resources/sap/ui/test/opaQunit.js:6:331)
at Object.run (https:// sapui5.hana.ondemand.com/sdk/resources/sap/ui/thirdparty/qunit.js:11:9294)
at eval (https:// sapui5.hana.ondemand.com/sdk/resources/sap/ui/thirdparty/qunit.js:11:11222)
at C (https:// sapui5.hana.ondemand.com/sdk/resources/sap/ui/thirdparty/qunit.js:11:5918)
at E (https:// sapui5.hana.ondemand.com/sdk/resources/sap/ui/thirdparty/qunit.js:11:6299)
at eval (https:// sapui5.hana.ondemand.com/sdk/resources/sap/ui/thirdparty/qunit.js:11:6431)# 3618 ms
Expected:
true
Result:
false
Diff:
trufalse
Source:
at Object.eval [as ok] (https:// sapui5.hana.ondemand.com/sdk/resources/sap/ui/thirdparty/qunit.js:11:20688)
Script error.# 3623 ms
Source:
:0

It is working for me in this way. the Success Function we have to do firePress() event:
Then.onTheTranslationPage.ipressOKButton();
ipressOKButton: function () {
var oOrderNowButton = null;
return this.waitFor({
viewName: sViewName,
searchOpenDialogs: true, //mandatory
controlType: "sap.m.Button", //optional
success: function (aButtons) {
return aButtons.filter(function (oButton) {
if(oButton.getText() == "OK") {
oOrderNowButton = oButton;
oButton.firePress();
}
});
Opa5.assert.ok(true, "Form Got Submitted Successfully");
},
actions: new Press(),
errorMessage: "Did not find the dialog control"
});
},

I found following piece of code working for me:
Then.waitFor({
pollingInterval: 10, //optional
searchOpenDialogs: true, //mandatory
//controlType: "sap.m.Button", //optional
success: function(oDialogs) {
if (oDialogs[oDialogs.length - 1].$().text() === "OK") {
oDialogs[oDialogs.length - 1].$().trigger("click");
Opa5.assert.ok(true, "Found OK button inside open dialog!");
}
},
errorMessage: "Did not find either the open dialog or buttons inside an open dialog"
});

Related

Not able to click an element in saved form in Mocha framework

Requesting you to plz help on this .
I am using MOCHA and chai fW for my testing here .Here i have one saved form namely formula and i am trying to click an element with clickElement(driver,By.xpath('//*[#id="clsmyGrid"]')) but it is not working . I had an option to create a new form and it starts working with same code i mean i am able to click an element. Here i saved this form and it is not picking the id to click the element.
it('Searching for satistics row', done => {
setTimeout(function () {
clickElement(driver,By.xpath('//*[#id="clsmyGrid"]')).then(function(){
done();
});
}, executionPauseTime)
});
function clickElement(driver,by){
var ele = driver.wait(until.elementLocated(by), large);
return ele.click().then(function(res){
chai.assert.isOk(true);
}, function(error) {
chai.assert.fail(error.message)
});
}

Switching to a nested route is automatically running the last commit event from parent's store

Reproduction link
https://codesandbox.io/s/vue-template-c2gtb
Steps to reproduce
Open https://codesandbox.io/s/vue-template-c2gtb
Click on 'Go to Page with nested router' link
Click on 'commit event', it will show an alert box
Now change the nested route by clicking 'change nested route to reporting'
What is expected?
Route changed to reporting without showing the 'hello' alert box.
What is actually happening?
Its showing the 'hello' alert box again.
You should change your watcher to ignore cases when old value is the same as new value:
watch: {
event: {
handler(newVal,oldVal) {
if(oldVal === newVal) return; // <--- the important part
switch (this.event.id) {
case 'new_requirement': {
alert('hello');
break;
}
default:
}
},
},
},

callbacks not firing when opening a magnific popup from another one

I currently have a magnific popup and within that popup i have a link that opens another magnific popup. Something along the lines of:
$('.logbook-entry-details').magnificPopup({
type: 'ajax',
closeBtnInside:true,
closeOnBgClick:false,
closeOnContentClick:false,
callbacks: {
beforeOpen: function () {
$.magnificPopup.close();
},
open: function() {
console.log('Popup open has been initiated');
},
beforeClose: function() {
console.log('Popup before close has been initiated');
},
close: function() {
console.log('Popup close has been initiated');
},
afterClose :function() {
console.log('Popup after close has been initiated');
}
}
});
After reading i found that callbacks on the second popup will not be registered until i close the original popup as opening the new one just replaces the content and actually doesn't recreate a new instance.
I am trying to figure out how i could have my link within my popup close the current popup before calling the code to open the new one so it can register my callbacks.
By the way, the reason I am trying to do this is i want to reopen the original popup after closing my new popup. If you happen to have a better solution please let me know.
So just in case someone needs this answered, i had to add the following code to my new popup.
// a button that closes the popup
$('#cancel-logbook-entry-btn').click(function(){
$.magnificPopup.proto.close.call(this);
});
$.magnificPopup.instance.close = function () {
//code to show the original popup
};
And then in the original popup i had to add otherwise it will never close the popup
$.magnificPopup.instance.close = function () {
// "proto" variable holds MagnificPopup class prototype
// The above change that we did to instance is not applied to the prototype,
// which allows us to call parent method:
$.magnificPopup.proto.close.call(this);
};

Sencha Touch - event listener for NestedList back button?

Sencha Touch 1.1.1 --
Is there a way to set up a listener to listen for click events on the Back button of a NestedList? I can only find examples of how to set up for clicks on the 'body' or 'el' element. How would you be more specific and target the NestedList's back button?
Many Thanks
Code so far
MyTest.views.Justacard = Ext.extend(Ext.NestedList, {
title: "The Title",
...
listeners: {
click: {
element: 'el', // ANYTHING HERE TO TARGET THE BACK BUTTON?
fn: function(){
// do action
}
}
}
});
Ext.reg('justacard', MyTest.views.Justacard);
On a side note: because the NestedList component adds the back button automatically, there's no opportuity to configure it and add a handler (I think).
PS: adding the following code (below title: for example) allows me to respond to the Back button clicks - however, it also removes all the normal Back button functionality and the NestedList no longer slides back to the parent list.
onBackTap: function() {
alert('boo');
}
Turning into a proper 'lumpy carpet' scenario ; )
Try
MyTest.views.Justacard = Ext.extend(Ext.NestedList, {
title: "The Title",
...
listeners: {
back: function() {
alert('back?');
}
}
});
or
onBackTap: function() {
this.callParent(arguments);
alert('boo');
}
P.S. Sorry, I didn't test this (just looked at sources)

Dojo lightbox problem

I made a custom basic lightbox with Dojo to be used with forms and data. Not really dealing with images or such.
The problem that I seem to be facing is this. When Dojo makes a call via AJAX to ajaxtb.php with specific code for example; ?f=login or ?f=register the page is loaded. When you I close the lightbox and try to view something different say ?f=stuff the lightbox will show what ever was before it be it ?f=login or what ever, it will show it until ?f=stuff is fully loaded.
Here is the code for the lightbox, also can some one tell me how to optimize it since its pretty redundant at the moment and very basic.
dojo.ready(function(){
#loads logout confirmation
dojo.query("#jsLogoutPromp").connect("onclick", function(){
dojo.byId("qpbox-title-text").innerHTML = "Logout Confirmation";
dojo.query("#qpbox-content").style("display", "block");
dojo.query("#qpbox-overlay").style("display", "block");
dojo.xhrGet({
url: "ajaxtb.php?f=logout",
load: function(newContent) {
dojo.byId("utm").innerHTML = newContent;
},
// The error handler
error: function() {
// Do nothing -- keep old content there
}
});
});
#loads options to upload profile photo
dojo.query("#jsUserPhotoPromp").connect("onclick", function(){
dojo.byId("qpbox-title-text").innerHTML = "Upload Photo";
dojo.query("#qpbox-content").style("display", "block");
dojo.query("#qpbox-overlay").style("display", "block");
dojo.xhrGet({
url: "ajaxtb.php?f=display_pic",
load: function(newContent) {
dojo.byId("utm").innerHTML = newContent;
},
// The error handler
error: function() {
// Do nothing -- keep old content there
}
});
});
#closes everything when clicked well technically hides everything
dojo.query("#qpbox-close").connect("onclick", function(){
dojo.query("#qpbox-content").style("display", "none");
dojo.query("#qpbox-overlay").style("display", "none");
});
#shows up for logout only, same as above code, but does not work since the original id is included in ajax.php?f=logout
dojo.query("#qpbox-stay").connect("onclick", function(){
dojo.query("#qpbox-content").style("display", "none");
dojo.query("#qpbox-overlay").style("display", "none");
});
});
The functions responsible for closing everything is qpbox-close and qpbox-stay. Technically both only hide the lightbox not close. The other problem is with qpbox-stay. qpbox-stay id is located in ajax.php?f=logout and when clicked it does not close the lightbox so not sure whats the problem with it.
here is the code for ajax.php
if($_GET['f'] == 'logout') {
echo '
<p>Are you sure you want to exit right now?</p>
<br>
<button type="submit">Logout</button> No, I wana Stay
';
}
Thanks
You can use dojo.empty(dojo.byId('utm')) before showing the lightbox to delete all the contents.
Also, you can refactor your code quite a bit. Both click handlers do basically the same thing. So why not refactor them in a function?
dojo.ready(function() {
function showLightBox(title, url) {
var utm = dojo.byId('utm');
dojo.empty(utm);
dojo.byId("qpbox-title-text").innerHTML = title;
dojo.style(dojo.byId("qpbox-content"), "display", "block");
dojo.style(dojo.byId("qpbox-overlay"), "display", "block");
dojo.xhrGet({
url: url,
load: function(newContent) {
utm.innerHTML = newContent;
},
// The error handler
error: function() {
// Do nothing -- keep old content there
}
});
}
function hideLightBox() {
dojo.style(dojo.byId("qpbox-content"), "display", "none");
dojo.style(dojo.byId("qpbox-overlay"), "display", "none");
}
dojo.connect(dojo.byId('jsLogoutPromp'), 'onclick', function() {
showLightBox("Logout Confirmation", "ajaxtb.php?f=logout");
});
// ...
dojo.connect(dojo.byId('qpbox-close'), 'onclick', hideLightBox);
});
You can try and connect to #qpbox-stay after you've loaded the content, or if using Dojo 1.6, you can use NodeList.delegate like:
dojo.require('dojox.NodeList.delegate');
dojo.query('#utm').delegate('#qpbox-stay', 'onclick', hideLightBox);
That will connect to #utm which is already loaded, but work for #qpbox-stay only. It works with event bubbling, similar to jquery.live(). See http://davidwalsh.name/delegate-event