NativeScript e2e tests - check value fo the switch component - mobile

I am using NativeScript-Dev-Appium for writing E2E tests for my NativeScript application and I want to access the value of the checked attribute of my Switch component.
I tried both
UiElement.getAttribute("selected"), UiElement.getAttribute("checked")
But it doesnt seem to access those attributes.
Appium docs mentions to have incorporated isSelected() function for such elements.
http://appium.io/docs/en/commands/element/attributes/selected/
This method is not available with this plugin. Is there a way to go about it?

Related

How to test `contenteditable` events with React Testing Library

I am trying to write tests for one of our rich text components which was implemented with slate js editor in react js. So when writing tests, I am retrieveing the element div[contenteditable='true'], but not able to simulate events like change, blur, focus. The handlers attached to editor component are not getting called. I tried multiple combinations, but no luck. Can someone please help on this? Is it possible to simulate events for contenteditable element using testing library (contenteditable is implemented using slatejs)?
Like you've discovered, contenteditable isn't supported by JSDOM. React Testing Library (RTL) is built on top of JSDOM, so it's not possible to test the Slate editor properly with RTL until JSDOM implements support for contenteditable.
Use a browser automation library together with Testing Library
Your options are then to use a tool that creates a real browser context. Testing Library have integrations with many tools that do exactly that: TestCafe, Cypress, Nightwatch, Puppeteer.
You can also use the above tools on their own, without Testing Library.
I've solved this using Puppeteer, and there are two approaches:
Run a local server and tell Puppeteer to go to something like localhost:3000
Set the content directly with page.setContent(htmlString)
(1) is the most common, and you'll find many guides for this since it's a common approach for end-to-end testing (google search).
(2) is a little trickier because you will have to transform and bundle your source for each test, and then inject it as HTML into the browser page. I prefer this approach because the testing experience is much more similar to using RTL. I've created a repository with an example of this setup with the Slate editor here: https://github.com/marcusstenbeck/puppeteer-react-testing-template/

Which ReactJS Components or Elements should I test?

Hi I am developing a few SharePoint Web Parts with ReactJS and are ready to test them. Installed Mocha and Chai ok and test runs ran OK. The first two apps I am testing work as follows:
1. Search component - A jQuery Autocomplete that pulls data via the Fetch method and pushes this to the Input Div to perform searching and appends this data to some Input fields.
2. A-Z List - A Directory type application that allows users to navigate through locations from A to Z and view particular details about each location. Again data is pulled from SharePoint list via Fetch and then objectified:
(var myobj = data.map(item){return {value: item.title }} ).
They both make use of Material-UI themes (MUI) and in particular - Tabs,Tables,TextField, RaisedButton,Dialog.
I also have Interfaces as mentioned in separate classes.
Now I want to test and writing a some test and want to do tests with Describe and It methods but since this is my first time doing formal software testing I was wondering a few things and need advice:
What high level functionality should I test?
If I was to begin I am thinking of testing the following elements/components:
2a. Render method - Render()
2b. Class definitions - export default SearchCmp extends Component
2c. Main Divs - Important divs that need to be rendered.
2d. Navigation in the AZ list
2e. Fetch return - Does it equal to true?
So all in all I don't know if I am planning this right with the above areas to be included and two can you provide code sample or advice for such tests if they will be useful for me? jsdom is available too as we can't have access to real dom.
Thanks
Following this guidlines : NodeJS Testing with Chai and Code Quality. https://www.lynda.com/Node-js-tutorials/Assertion-libraries-correctness/587672/654554-4.html?srchtrk=index%3a1%0alinktypeid%3a2%0aq%3achai%0apage%3a1%0as%3arelevance%0asa%3atrue%0aproducttypeid%3a2
Once finished I should be in better position to design Unit and Integration tests.

Trying to run selenium - test on angular site

I try to run a selenium test (using selenium IDE on Firefox) For an angular app.
I followed the instructions here in SO and added something like this:
Command=waitForElementPresent
Target=//h3
But even if there are a lot of H3s generated quite quickly by the app, Selenium does not seem to be able to find any them. (it keeps waiting on the WaitForElementPresent command)
Anything else I have to do to make this work?
I would highly recommend you to use protractor in addition to Selenium. Basically its a Javascript executor which can locate elements by ng tags. I tried to test an angular site with selenium only, but protractor really made my life easier!
If there are are many H3 tags in your application , it would be a good idea to give an unique Id to tags .
like :
<h3 id="someUniqueId"> heading </h3>
which can be accessed by :
Command=waitForElementPresent
Target=id=someUniqueId
If you don't want to make the entire switch to Protractor but you do want to wait for Angular I recommend using Paul Hammants ngWebDriver (Java).
For me the standard selenium implicit wait didn't work as our page is built asyncronously with Angular. I fixed this by writing an actions class in which I waited for Angular (using ngWebDriver's waitForAngularRequestsToFinish()) before carrying out the actions (click, fill, check etc.).

AngularJs Testing using Cucumber BDD

Need guidance from you all on the below situation.
I am working on a IT concern where my client asked to me to do a POC to test web app(which has been build using angularJs).
Expectation from my client:
He wants the web app to be tested in a controlled way using BDD(Behavioral Driven Development)
His recommendation is to automate the testing of webpage(angularJS) using Cucumber with BDD approach
My Analysis Outcome:
we can automate a webpage (non angularJS web app) using Cucumber with BDD in a efficient way by providing element identification using common properties but when i think about the angular properties, there is no option to use the angularJS element in cucumber as per my knowledge.
Help required on:
Could any one please suggest me what is the efficient way that we can automate a angularJS page using Cucumber and how can we get the angularJs page element properties in cucumber?
check http://www.protractortest.org/#/frameworks
It has the basic setup for the protractor framework with protractor-cucumber-framework.
exports.config = {
// set to "custom" instead of cucumber.
framework: 'custom',
// path relative to the current config file
frameworkPath: require.resolve('protractor-cucumber-framework')
// relevant cucumber command line options
cucumberOpts: {
format: "summary"
}
};
On the cucumberjs github page you have an overview of the options:
https://github.com/cucumber/cucumber-js. You can use these in the cucumberOpts part in the protractor.conf file.
Expl:
cucumberOpts: {
require: "test/features/mystep_definitions/**/*.js",
format: "pretty"
}
I am working on a very similar situation at my client. Only difference is, we are using .NET (and thus SpecFlow)
Now I can speak for .NET that protractor is the way to go for the Angular JS application. It works like a charm and I am able to locate all elements as I go.
If you are hesitant to use protractor, it is still possible to locate every element by using javascript executor or css locator. Both work perfectly for an Angular JS application. Just make sure you wait the right amount of time for your elements to get loaded, or else you will get a lot of NoSuchElement exceptions.
Good luck!

Protractor browser.driver.getCurrentUrl vs browser.getCurrentUrl

I'm running an Angular app and I'm trying to get the current URL when testing on protractor. Which one to use?
browser.driver.getCurrentUrl() or browser.getCurrentUrl() ?
If this is an Angular application under test - use browser, otherwise - browser.driver.
To quote #jmr from a relevant github issue:
If you need to interact with a non-Angular page, you may access the wrapped webdriver instance directly with browser.driver.
Though, note that both are gonna work if this is Angular application under test. Some people even said that found browser.driver more reliable if it the sync time is longer than usual:
Just to add to this - I find that browser.driver works better on AngularJS apps that take time to sync. I have tried both and for some reason browser.driver is more reliable.
Though, I've personally used browser.getCurrentUrl() and cannot recall any problems.

Resources