Menu Close
    Convert your store into Magento Multi Vendor Marketplace

    How To SignIn Magento2 Frontend Using CasperJS

    Manual Testing is a time consuming and tough task to do. In manual testing, it happens to do same tests many times like create a new account, sign in, order placement etc for magento2 store, which is boring. There are some good tools available which make it easier. CasperJS is one of them. CasperJS comes with a basic testing suite that allows you to run full featured tests without the overhead of a full browser. It uses selector and events to do tests.

    For the installation and basic CasperJS knowledge, you can check here. Now we’ll proceed with the testing process. Here we’ll learn how we can sign in using CasperJS for magento2 store. This script will also show you proper error messages for wrong inputs

    The script procedure is as follows-
    Open home page of your Magento2 store, click on “SignIn” link, Fill Login Form, Click on SignIn button, wait to be redirected to “My Account Dashboard” page and then get the title of My account page.

    Here we have used some CasperJS methods like-

    start(): For Opening Magento2 Store Homepage

    casper.cli.get(0): For getting input from the terminal. Here 0 is an index of input.

    waitForSelector(): Waits until an element matching the provided.

    click(): method is used to click a link and buttons.

    fill(): method is used to fill the forms.

    exists(): Checks if any element matches with the provided selector

    wait(): wait for given amount of time

    bypass(): To Skip a given number of defined navigation steps

    fetchText(): Retrieves text of given selector

    getTitle(): Retrieves page title

    * Webkul Software.
    * @category Webkul
    * @package Webkul_CasperJS
    * @author Webkul
    * @copyright Copyright (c) 2010-2016 Webkul Software Private Limited (
    * @license
    var casper = require('casper').create({
    	verbose: true,
    var email = '';
    var password = '';
    //Home page link
    casper.echo('Current Magento2 link is: ' + casper.cli.get(0), "INFO");
    casper.echo("Testing frontend login...", "COMMENT");
    //Go to login page & Fields value assignment
    casper.waitForSelector('body > > header > div.panel.wrapper > div > ul > li.authorization-link > a', function () {'body > > header > div.panel.wrapper > div > ul > li.authorization-link > a')
    	if (casper.cli.get(1)) {
    		email = casper.cli.get(1);
    	if (casper.cli.get(2)) {
    		password = casper.cli.get(2);
    //Login Form Fillup
    casper.waitForSelector('#login-form', function () {
    	this.echo('Current Page Title is: ' + this.getTitle(), "INFO");
    	this.fill('form#login-form', {
    		'login[username]': email,
    		'login[password]': password
    	}, false);
    	this.echo('Login Form Filled', "COMMENT");
    //Click Sign In Button
    casper.then(function () {'#send2');
    //Frontend Field validation Check
    casper.then(function () {
    	//email error massage.
    	if (this.exists('#email-error')) {
    		this.echo('Email:' + this.fetchText('#email-error'), "ERROR");
    	//Password error massage.
    	if (this.exists('#pass-error')) {
    		this.echo('Password:' + this.fetchText('#pass-error'), "ERROR");
    casper.wait(3000, function () {
    	if (email == '') {
    		this.echo('Email Should be required Field');
    	if (password == '') {
    		this.echo('password Should be required Field')
    	//Invalid Login massage.
    	if (this.exists('#maincontent > > div:nth-child(2) > div:nth-child(1) > div > div')) {
    		this.echo(this.fetchText('#maincontent > > div:nth-child(2) > div:nth-child(1) > div > div'), "INFO");
    	} else {
    		//Login Successfull.
    		this.echo('Current Page Title is: ' + this.getTitle(), "INFO");
    		this.echo("Successfully Logged In", "COMMENT");

    Now you have to run a command on your terminal-

    casperjs your_file_name.js http://your_magento_homepage email_id password

    Here, you can see the result on your terminal –

    For blank input –

    For invalid email or password –

    After running the test script you will get the Dashboard page title if successfully logged in or error message for wrong inputs.

    . . .
    Discuss on Helpdesk

    Leave a Comment

    Your email address will not be published. Required fields are marked*

    Be the first to comment.

    Back to Top