Testing Framework For testing UI Components - javascript

I am writing jquery plugins like selectbox, rangeslider etc.. I am planning to do automation test. When I look into it, I find them confusing.
There are frameworks like TestNG, JUnit, Maven, Gradel etc..
and on the other side mocha, jasmine etc..
What is the similarity and difference between them?
Which one is the best to test uicomponents?
or At least the basics which would help me to understand?
#sjethvani Thanks for your reply.
Now I have got some understanding on Browser Automation Tools and Testing Frameworks. Have decided to use Selenium with NodeJs and Mocha. But, Is it possible to test it in all browsers parallelly using a single command line? mocha test - command preferably runs it in a single browse or Do I have to loop it inside my test file, to open it in different browsers? Is this the way?

Related

How to test a web page from my local machine after it is loaded in my browser

I have a website that is running on some server, which is used by a few thousand people. It's built on Java and soy template. I need to test the fronted rendering/js files. Can I do this from my local machine after accessing the web page?
for example: say I need to run a few Javascript test files on facebook.com. I go to facebook.com in my browser, after it is loaded, I need to run a few js files to test it. Is it possible? if yes, should I use Mocha or jest or any other alternate framework?
Only you can do is E2E testing. E2E testing is an UI automation testing. Here are the e2e testing framework choices:
puppeteer
cypress
casperjs
protractor
You can use jestjs with puppeteer.
There are different test types that can be run against code: Unit, Integration, Functional, etc. Some types have different test methodologies: TDD, BDD, etc. In this instance it seems you are wanting Functional Tests usually using the BDD method. In regard to your post, you state Java but tag the post Javascript and mention the Mocha framework. I'm assuming you meant Javascript instead of Java, with that said Mocha does support Functional Tests:
https://mochajs.org/#retry-tests
You will need the Selenium Driver to be installed along with other specific web browser drivers: Chrome, Edge, Gecko. A quick search shows that there might be an easier path to get up and running:
https://www.npmjs.com/package/mocha-webdriver
I have no experience with that library but leave further investigation up to you.

is it possible to perform e2e testing of a pure js class with gulp-jasmine-phantom

Specific scenario is that, I have a es6 class can add class to a dom upon scrolling to certain point on the screen. So to simulate that scrolling I realized I actually need to create page for that. I found that use phantomjs is the most comment way. I also found that people use jasmine + phantom for similar e2e.
Though I wonder when I use gulp-jasmine-phantom from npm, am I able to also do e2s as the above example did? How to set it up? Because I did not see similar setup of using phantomjs calling the test file and the .html file for the e2e testing.
If this is not the right approach, should I give up running phantomjs based e2e test with gulp?
PhantomJS is a great tool and some people use it in combination with other tools for end to end testing, but it alone does not do so, nor do they make any claims.
With your setup, you already have great tools at your disposal with gulp and Jasmine. For true end to end testing you need front end interaction which can be achieved Casper, or one of my personal favorite Selenium which allows for testing in multiple browser.
If you are using Angular I recommend Protractor which is itself an end to end testing framework.
Hope that helps

How to test a front-end JavaScript library and integrate with Travis?

I have already experimented testing NodeJS libraries using Jasmine or Mocha, but I don't know how to test front-end projects. I have found tutorials online, but everything includes a task manager in the workflow and I would like to know how to do this without one.
I found the following question close to what I am asking:
Using Travis-CI for client-side JavaScript libraries?
In my case, I am using Jasmine and have already set up the Jasmine SpecRunner.html, Jasmine library and spec/mylibSpec.js. The tests pass when I run the SpecRunner.html on my browser.
Now, how do I integrate this with Travis, without Grunt/Gulp/Brunch/etc?
I have heard the words "PhantomJS" and "Selenium" and I think this has to do with what I am trying to accomplish. Is there a "hello, world"-like project with tests and Travis integration one can learn from?
The Travis documentation lists three basic ways to accomplish this:
the PhantomJS headless browser
running Firefox with a virtual display or
using the Saucelabs browser VM service
Testing with PhantomJS is the fastest, since it does not simulate a display (it still allows you to create screenshots, though). PhantomJS comes with a run-jasmine example.
The phantom test script can then be executed directly, simply by running
script: phantomjs run-jasmine.js
in your .travis.yml, without the additional overhead of a build system such as Grunt.
If testing your project requires a real browser GUI, that leaves you with options 2 or 3.
Saucelabs browser VMs have the advantage of real cross-browser testing; if your project is open source, they offer a free plan. They also provide an in-depth tutorial for your specific use case: Travis + Jasmine + Saucelabs, which however does require Grunt in order to run.

Test driven JavaScript, Jasmine, and production code

I'm trying to grasp the basics of Jasmine (and BDD/TDD I guess). The examples I have seen does not resemble any realistic scenario of a web application, and have a hard time relating to it.
Are Jasmine tests done aside (separately) from working on the JavaScript that will be deployed? Manually copying tested/validated code.. Or does Jasmine compile to standard JS used for production?
Cheers
Jasmine is a framework for testing JavaScript code. Just like testing Ruby on Rails code, the tests don't become part of the production code. They are in the same repo and are run but they aren't minified into project.js or whatever your build process is. As part of your test run process, you can do headless tests using PhantomJS (headless webkit) and have it run on your CI server and so forth just like any other test.
I have worked on a bunch of projects this way. There has been a trend of seeing JavaScript has an enhancement layer that doesn't really need to be tested but today JavaScript is so much more. It is critical to test it if your application needs to work.

How to Maven JUnit-test HTML pages containing Javascript and calling a servlet?

I am still new to Javascript and Servlets. I have some HTML pages containing javascript code and these pages can call a servlet. I want to develop JUnit-like test for this page to run from Maven.
I googled and found JSUnit to test Javascript and HttpUnit to test Servlets, but how can I test my HTML page by simulating clicks and user actions? Is there a framework to write these tests in a Java/JUnit fashion? Basically, I want to automate these as part of a maven compilation process.
Have you looked at Selenium and Watir? Selenium can capture the clicks and then be put into a jUnit framework to run like it was unit tests. Watir does the same type of thing in Ruby.
I use a combination of JWebUnit as the driver and easyb for writing specifications.
JWebUnit will drive either HtmlUnit or Selenium. This is both good and bad; good because the behavioral tests can run on a headless server via HtmlUnit, bad because I lose some functionality of HtmlUnit in the process... some tests "go native". Pretty good JavaScript support, too.

Categories

Resources