I am new to cypress and wanted to use xpath for my element locators.
How can I declare my objects using xpath ? I currently have a design like this.
How can I use xpath for my username and submitBtn elements?
export default class LoginPage extends BasePage {
constructor() {
super()
}
username = "#username";
submitBtn = "#_submit";
fillLoginUser(myUser) {
let field = cy.get(this.username);
field.clear();
field.type(Cypress.env(myUser));
this.submit(this.submitBtn)
}
}
You can use plugin for the xpath
Install with npm
npm install -D cypress-xpath
Include in your project's cypress/support/index.js
require('cypress-xpath')
You can use cy.xpath instead of cy.get .
cy.xpath('//ul[#class="todo-list"]//li')
Related
Am using #ngx translator but I'm getting error. I need to use translator dropdown at footer and the translator should reflect in all pages
like this the services .. it works
loadTranslations(...args: Locale[]): void {
const locales = [...args];
locales.forEach(locale => {
this.translate.setTranslation(locale.lang, locale.data, true);
this.langIds.push(locale.lang);
});
// add new languages to the list
this.translate.addLangs(this.langIds);
}
setLanguage(lang) {
if (lang) {
this.translate.use(this.translate.getDefaultLang());
this.translate.use(lang);
localStorage.setItem('language', lang);
}
}
getSelectedLanguage(): any {
return localStorage.getItem('language') || this.translate.getDefaultLang();
}
and the constructor
import { locale as arLang } from './i18n/ar';
import { locale as frLang } from './i18n/fr';
constructor(private translationService: TranslationService,
) {
// register translations
this.translationService.loadTranslations(arLang, frLang);
}
For localization/internationalization of your app, angular has i18n. It handles all static text of your app and translates with any of your locale. For that you need to include equavalent translated text in $Yourlocale.xlf file.
For some reference:
Translate addition i18n
Addition in template
Add i18n tag :<div i18n>Some text</div>
Add i18n-x tag to component attribute :
<some-component i18n-titleProp="title" titleProp="some text""></some-component>
<input i18n-placeholder="placeholder"" placeholder="some text""></input>
Addition in ts file i18n-polyfill
Add i18n to class constructor :constructor(private i18n: I18n) {}
Add i18n tag to variable value :
any = [this.i18n('first value'), this.i18n('second value')]
some = this.i18n('some value')
Creation XLIFF translations files
run npm run i18n
See translation file /locales/messages.xlf
here you need to manually enter the equivalent translated text for transaltion.
I'd like to use the 'faker' library to generate fake data in JSON file as below.
In karate-config.js, I do the following:
var faker = require('faker');
In sample.json:
{
'firstName': '#(faker.name.firstName)'
'city' : '#(faker.address.city)'
}
But I'm getting error like 'unable to find 'require' keyword in 'karate-config.js'
Please help on this.
Karate does not support NPM or the require keyword. For complex custom logic, the recommendation is to use Java interop.
My suggestion is you should find a Java library that does what "faker" does and integrate it.
First add the below dependency in your pom.xml
<dependency>
<groupId>com.github.javafaker</groupId>
<artifactId>javafaker</artifactId>
<version>1.0.2</version>
</dependency>
For the latest version of the dependency click here
Use the below code in karate-config.js:
config.faker = Java.type('com.github.javafaker.Faker');
In the feature file use the below code:
* def fakerObj = new faker()
* def fName = fakerObj.name().firstName()
* def lName = fakerObj.name().lastName()
* def mailId = fName+'.'+lName+'#test.com'
You could use the same in JSON body as follows:
"emailAddress":"#(mailId)",
"firstName":"#(fName)",
"lastName":"#(lName)",
"address":{
line1:"#(fakerObj.address().streetAddress())"}
Please click here for the class and methods of faker package
As far as I know, karate only supports java based dependencies. So try to find a Java equivalent for your JS library.
thanks for your response and suggestion, tried below and working fine.
in karate-config.js:
var faker = Java.type('.FakerClass');
......
config.faker = faker;
in sample.json:
{ 'name': '#(faker.address.city)' }
I'm using nativescript angular. I have a class called SomeClass that access the native API of iOS and Android separately.
I've written two files:
someclass.android.ts
export class SomeClass {
someFunction() {
if(isAndroid) {
// do some android specific code
}
}
}
someclass.ios.ts
export class SomeClass {
someFunction() {
if(isIOS) {
// do some ios specific code
}
}
}
Now, in app.component.ts, I'm using SomeClass like this:
import { SomeClass } from './../shared-code/someclass';
without .android.ts or .ios.ts, to enable nativescript to pick the right file depending on the running platform.
and then in the code, I user SomeFunction like this:
...
const someClass = new SomeClass();
someClass.someFunction();
...
With this setting, everything works perfectly on both iOS and Android, but I get the following error
error TS2307: Cannot find module './../shared-code/someclass'.
Do you have any idea how to tell nativescript/tslint to take into account the .android and .ios files and not to display this error?
Thanks
Here's the solution:
Alongside 'someclass.ios.ts' and 'someclass.android.ts', create a definitions file and name it 'someclass.d.ts' (Not index.d.ts). No need to put the files in a separate folder.
In someclass.d.ts, export declare the class like this:
export declare class SomeClass {
/**
* someFunction, is a function that does this and that (description)
*/
someFunction(): void;
}
Then, you can use this from another file like this:
In app.component.ts:
import { SomeClass } from './../shared-code/someclass';
Remember to use /someclass without any extensions.
This would solve build and tslint errors.
I am not able to make plugin work with angular project template .GitHub shows only code in native and XML .Sample plugin code works but unfortunately no angular support or help given. I am not able show on angular template.
relevant code i am using
detail.component.ts
registerElement("AutoComplete", () => require("nativescript-autocomplete").AutoComplete);
public list :Array = ['1','2','3','4','567'] ;
public itemTapped(args){
console.log("tapped");
}
detail.component.html
<AutoComplete items=""{{list}}"" itemTap="itemTapped($event)"> </AutoComplete>
i am getting exception on console while page loads and autocompletion doesnt work
this.items.forEach is not a function inside plugin code .that line is with definition of AutoComplete.prototype.itemsUpdate inside autocomplete.android.js plugin source
Debugging into plugin source it breaks at initialization time :
'AutoComplete.prototype.itemsUpdate = function (items) {
var arr = Array.create(java.lang.String, this.items.length);
this.items.forEach(function (item, index) {
arr[index] = item;
});
var ad = new android.widget.ArrayAdapter(app.android.context, android.R.layout.simple_list_item_1, arr);
this._android.setAdapter(ad);
};'
In detail.component.html
<AutoComplete [items]="list" (itemTap)="itemTapped($event)"> </AutoComplete>
in details.component.ts add
public list:any= ['1','2','3','4','567'] ;
itemTapped(ev){
//console.log(ev); your code
}
Issue in npm version. Clone the repository.
Replace all the files in node_modules/nativescript-autocomplete ,expect screenshot, demo folders and git related files. And try the solution
How can I use an external jquery plugin with Script# 0.7? Is there a tool to convert any jquery plugin to equivalent c# code? Or we have to do it manually?
Depending on your exact code, the following might also be appropriate:
jQuery.Select("#myDiv").Plugin<jQueryWithFoo>().FooInit();
This is useful if you have multiple plugins you want to use, and use the fluent-API pattern that you would in regular jQuery. Example:
jQuery.Select("#myDiv").
Plugin<jQueryFoo>().FooInit().
Plugin<jQueryBar>().SomeBarMethod();
In my opinion it's usually a better use of one's time to include the plugin as-is (in it's JavaScript form), and then prepare an imported type in Script# for exposing the plugin's functionality to the rest of Script#.
I don't know if there is a shortcut approach in Script# when dealing specifically with jQuery plugins, but what I've quickly done in the past is something like the following:
// Import my plugin "Foo"
[Imported]
[IgnoreNamespace]
public class jQueryWithFoo : jQueryObject
{
private jQueryWithFoo () { }
[ScriptName("foo")]
public void FooInit() { }
[ScriptName("foo")]
public void FooMethod(string method) { }
[ScriptName("foo")]
public void FooMethodWithOptions(string method, Dictionary options) { }
}
Then to use the plugin on an object you just cast to your imported type:
// grab my div and cast to my plugin type
jQueryWithFoo myDiv = (jQueryWithFoo)jQuery.Select("#myDiv");
// use the plugin
myDiv.FooInit();
myDiv.FooMethod("toggle");