techminister.com cypress-first-impression

commonjs_n_ex6_module_export.js

// CommonJS default export
module.exports = () => {
    // do something
}

// ES6 module default export
export default () => {
    // do something
}

commonjs_n_ex6_module_import.js

// CommonJS default import
const doSomthing = require('../doSomething')

// ES6 module default import
import doSomething from '../doSomething'

cypress__not_working_node_module.js

/*
 * express is an external node modules that is used to create http servers
 * https://expressjs.com/
 */
import express from 'express';

describe('Using modules with Cypress', () => {
	it('will never make this method', () => {
		console.log('')
	})
});

cypress_es6_to_es5.js

// ES6 code automation engineer writes
export default class Cat {
    static meaw() {
        console.log('Meaw!!!');
    }
} 

// Above ES6 class will be preprocessed in to following ES5 code before the run
// You got the source map to original ES6 code in case you want to debug
var Cat = /*#__PURE__*/ function() {
    function Cat() {
        (0, _classCallCheck2["default"])(this, Cat);
    }(0, _createClass2["default"])(Cat, null, [{
        key: "meaw",
        value: function meaw() {
            console.log('Meaw!!!');
        }
    }]);
    return Cat;
}();

cypress_google_search_script.js

describe('Google', () => {
    it('should search value in Google', () => {
        // navigate to google
        cy.visit('https://www.google.com');

        // find element with title Search
        // type hello world
        // hit enter
        cy.get('input[title="Search"]')
            .type('Hello world')
            .type('{enter}');
    });
});

cypress_working_node_module.js

/*
 * path is a native node js modules
 * https://nodejs.org/api/path.html
 */
import path from 'path';
/*
 * simple message router is a external node module written by an awesome guy XD
 * https://www.npmjs.com/package/simple-message-router
 */
import Router from 'simple-message-router';

describe('Using modules with Cypress', () => {
    it('using external modules', () => {
        var root = new Router();
        let middleware = false;
        root.registerMiddleware(function() {
            middleware = true;
        });
        root.dispatchRequest('/');
        assert.isTrue(middleware);
    });

    it('using nodejs modules', () => {
        assert.equal('/home/user', path.join('/', 'home', 'user'));
    });
});

dont_store_chainer_objects.js

describe('Google', () => {
	it('should search value in Google', () => {
		cy.visit('https://www.google.com');

		// Storing the Chainer object to use it in the future
		const input = cy.get('div');

		// Find search 'input' within 'div' and type 'hello world'
		input.find('input[title="Search"]').type('hello world');

		/*
		 Eventhough following statement looks like finding search 'input' within 'div' and hit { enter } key, it's not
		 This has nothing to do with promises but the weird way Cypress collects actions & executes them
		 So the following statement is going to search for an 'input' element in last statements 'subject', which is the 'input' element
		 There is no 'input' element within an 'input' element so it's failing (not what we wanted to do anyway)
		*/
		input.find('input[title="Search"]').type('{enter}');
	});
});