Protractor + ionicPopup - protractor

Has anyone succeeded in using Protractor to detect an ionicPopup alert?
I've tried all the workarounds suggested here but no luck.
I need Protractor to detect the alert and check the text in the alert.

Here's the class I wrote to test that the popup exists and to ensure the text is correct in the header and body:
var TestUtilities = function(){
this.popup = element(by.css('.popup-container.popup-showing.active'));
//Tests to see if $ionicPopup.alert exists
this.popupShouldExist = function() {
expect(this.popup.isDisplayed()).toBeTruthy();
};
//Tests to see if $ionicPopup.alert contains the text provided in the argument exists in the header
this.popupContainsHeaderText = function (text) {
this.popupShouldExist();
expect(this.popup.element(by.css('.popup-head')).getText()).toMatch(text);
};
//Tests to see if $ionicPopup.alert contains the text provided in the argument exists in the body
this.popupContainsText = function (text) {
this.popupShouldExist();
expect(this.popup.element(by.css('.popup-body')).getText()).toMatch(text);
};
};
module.exports=TestUtilities;
Also check out this site for more on testing Ionic in protractor it talks about how to check to see if the popup exists: http://gonehybrid.com/how-to-write-automated-tests-for-your-ionic-app-part-3/

I've tested Ionic popups successfully by setting the popup variable as follows:
var popup = element(by.css('.popup-container.popup-showing.active'));
And in the test:
expect(popup.isDisplayed()).toBeTruthy();

Ionic Popups are just made of DOM elements, so you should be able to use normal locators to find/test them. Because they're not made of alerts, the workarounds in the issue you linked to are probably not useful.

I got it - I saw a lot of issues out there trying to do it in very complex ways, but in the end I tried this and it turns out to be this simple.
Inspect your element and find its ng-repeat value, then
var button = element(by.repeater('button in buttons')).getText()
You also need to have the browser sit out somehow for a couple seconds so it doesn't resolve to the tests while the ionic popup isn't actually there.
For that, browser.sleep(3000);
That's it! However, getting the other button in there is proving to be a little problem. var button = element(by.repeater('button in buttons')).get(0) or .get(1) return undefined is not a function.
Please accept the answer if you like it! If I figure out how to get the other button, I'll post it here.

Related

how to disable pasting on google form?

i want to create a google form that i dont want people answer the questions by pasting from somewhere else, I want them to type their answers.
How can I do this?
I have tried to add js codes to google script but it didn't work.
It's not worh to prevent pasting because it will never be 100% effective, users can tweak prevention and do what they want.
But you can try using javascript.
This will prevent all inputs in your form:
let input = document.querySelector('input');
input.addEventListener('paste', (e) => {
e.preventDefault(); // This is what prevents pasting.
});
And this one will prevent only on an input that is specified by it's ID:
window.onload = function (){
var input = document.getElementById('inputId');
input.onpaste = functino(e){
e.preventDefault();
}
}
Update based on your comment
Here is a complete tutorial on how to create a google form and add scripts to it. It's not the exact same problem, but it's a clue.

trying to access Thunderbird-tabmail does not work

I want to open a new tab with a gloda conversation from inside calendar code.
I receive an error from error console:
window not defined (or document not defined), depending on which of the two I use to Access tabmail:
let tabmail = window.document.getElementById("tabmail");
let tabmail = document.getElementById("tabmail");
The code works fine if the js file is included in an overlay xul-file.
But I want to use it outside of xul in my code.
Somewhere in my calendar code (in my 'addevent'), the same code throws the error.
This code is originally called from a rightclick on an email, but several layers deep into calendar code.
In MDN, I read that window is global? So what do I Need to do to add an tab?
This part works if tabmail is properly referenced:
tabmail.openTab("glodaList", {
collection: queryCollection,
message: aCollection.items[0],
title: tabTitle,
background: false
});
So how do I get a reference for tabmail?
Any help is appreciated.
after trying and looking through code for really some time before posting, it took only ca. 20 minutes to accidentally find the solution after submitting the question..
While browsing mailutils on mxr for something else, I found the solution in some function:
mail3PaneWindow = Services.wm.getMostRecentWindow("mail:3pane");
if (mail3PaneWindow) var tabmail = mail3PaneWindow.document.getElementById("tabmail");

writing a Jacada Interaction extension

I want to create an "extension" for a Jacada Interaction (to extend functionality), in my case to parse and assign the numerical part of serialNumber (a letter, followed by digits) to a numeric global ("system") variable, say serialNumeric. What I am lacking is the structure and syntax to make this work, including the way to reference interaction variables from within the extension.
Here is my failed attempt, with lines commented out to make it innocuous after failing; I think I removed "return page;" after crashing, whereupon it still crashed:
initExtensions("serialNumeric", function(app){
app.registerExtension("loaded", function(ctx, page) {
// Place your extension code here
//$('[data-refname="snum"]').val('serialNumber');
// snum = Number(substring(serialNumber,1))
});
});
Here is an example of one that works:
/**
* Description: Add swiping gestures to navigate the next/previous pages
*/
initExtensions("swipe", function(app) {
// Swipe gestures (mobile only)
app.registerExtension('pageRenderer', function(ctx, page) {
page.swipe(function(evt) {
(evt.swipestart.coords[0] - evt.swipestop.coords[0] > 0)
? app.nextButton.trigger('click')
: app.backButton.trigger('click')
});
return page;
});
});
After reading the comment below, I tried the following, unsuccessfully (the modified question variable is not written back to that variable). It rendered poorly in the comment section, so I am putting it here:
initExtensions("serialNumeric", function(app){
app.registerExtension("loaded", function(ctx, page) {
var sernum = new String($('[data-refname="enter"] input'));
var snumeric = new String(sernum.substr(1));
$('[data-refname="enter"] input').val(snumeric);
});
});
I would like to understand when this code will run: it seems logical that it would run when the variable is assigned. Thanks for any insight ~
In your case, you extend loaded event. You don't have to return the page from the extension like in your working example below.
The page argument contains the DOM of the page you have just loaded, the ctx argument contains the data of the page in JSON form. You can inspect the content of both arguments in the browser's inspection tools. I like Chrome. Press F12 on Windows or Shift+Ctrl+I on Mac.
The selector $('[data-refname="snum"] input') will get you the input field from the question with the name snum that you defined in the designer. You can then place the value in the input field with the value from the serialNumber variable.
$('[data-refname="snum"] input').val(serialNumber);
You can also read values in the same way.
You can't (at this point) access interaction variables in the extension, unless you place theses variables inside question fields.
Here is a simple example how to put your own value programmatically into a input field and cause it to read it into the model, so upon next it will be sent to the server. You are welcome to try more sophisticated selectors to accommodate for your own form.
initExtensions("sample", function(app){
app.registerExtension("loaded", function(ctx, page) {
// simple selector
var i = $('input');
// set new value
i.val('some new value');
// cause trigger so we can read into our model
i.trigger('change');
});
});

How do I test if an img tag exists?

if I do expect(img).not.toBe(null) then I get an error:
Error: expect called with WebElement argment, expected a Promise. Did you mean to use .getText()?. I don't want to get the text inside an img, I just want to know if the tag exists on the page.
describe('company homepage', function() {
it('should have a captcha', function() {
var driver = browser.driver;
driver.get('http://dev.company.com/');
var img =driver.findElement(by.id('recaptcha_image'));
expect(img.getText()).not.toBe(null);
});
});
Passes but I'm not sure it is testing the right thing. Changing the id to something that doesn't exist does fail.
How do I properly test for a tag to exist with protractor in a non-angular app context?
Edit 2:
Per Coding Smackdown below, an even shorter answer is now available in protractor:
expect(element(by.id('recaptcha_image')).isPresent()).toBe(true);
Edit 1:
I discovered isElementPresent() today which is just a more readable shortcut for what I described below. See: http://www.protractortest.org/#/api
Usage for you would be:
driver.isElementPresent(by.id('recaptcha_image')).then(function(present){
expect(present).toBe(false);
})
Old answer (this works but the above is more reader friendly)
In general you should use findElements (or $$ which is an alias for findElements by css) if you're not sure a tag will be there. Then test for the array length. FindElement (and $) will just throw an error if it cant find the element.
Therefore instead of
var img =driver.findElement(by.id('recaptcha_image'));
expect(img.getText()).not.toBe(null);
use:
driver.findElements(by.id('recaptcha_image')).then(function(array){
expect(array.length).not.toBe(0);
})
Also, getText() returns a promise which is why you're getting that error.
Using the latest Protractor build you can shorten it down to the following:
expect(element(by.id('recaptcha_image')).isPresent()).toBe(true);

AngularJS - binding input file scope to a different scope

Wasn't sure how to properly title my question, I guess in my case it can also be titled "DOM manipulation not being detected by the scope", but it all depends on the approach of my problem.
To start off, I followed an official example on AngularJS main website with the Projects app which connects with Mongolab. The only difference is I want to add a file input, that reads file name and its lastModifiedDate properties and then applies those values to my form. To make file input work I followed this example here.
I made it work, but the problem is that when values get applied to my form scope is not picking up the changes.
I am doing DOM manipulation in my .apply() function and using $compile too, but something is missing. Or perhaps there's an easier way altogether without doing DOM manipulation?
Here's what I have so far, please take a look at this plunker - http://plnkr.co/edit/mkc4K4?p=preview
(Just click on the plus sign icon to add new entry, then try choosing a file.)
You need to add a watch statement in the CreateCtrl
function CreateCtrl($scope, $location, Movie) {
$scope.inputfile = {};
$scope.movie = {};
$scope.$watch('inputfile.file', function(value){
$scope.movie.filename = value ? value.name : '';
$scope.movie.dateadded = value ? value.lastModifiedDate : '';
})
$scope.save = function() {
Movie.save($scope.movie, function(movie) {
$location.path('/edit/' + movie._id.$oid);
});
};
}
Demo: Sample