Cypress custom command for element selection

We started using Cypress.io in one of our modern application built in React, and the journey with Cypress is incredible so far.

I’m working on a series of posts on my journey with Cypress and how I’m using it for end-to-end testing.

Last week, I saw this awesome open-source sample repository shared by Cypress.io team. This repo contains a test app and example tests using lots of recommended practices. I liked using The custom command for element selection as one of the recommended practices implemented in this repository https://github.com/upgundecha/cypress-realworld-app/blob/develop/cypress/support/commands.ts

We’re using a data-testid attribute to select elements and perform actions on them:

The above code works great, but making a shorthand command like getBySelLike reads better than using cy.get(). I refactored the tests and implemented a custom command from the example and named as getByDataTestSel to select elements as shown in below code snippet:

This custom command makes tests more readable and offers specific API to select an element which have data-test* attribute. You can find more details in Cypress documentation on how to implement custom commands.

Awesome online software testing courses & tutorials

I’ve been curating a list of online training courses and tutorials on software testing and related topics. The list covers top sites like LinkedIn Learning, Pluralsight, Applitools Test Automation University, MOOC site such as edX, and more.

Some of these sites are free, and some require paid subscriptions.

You can view the list in GitHub repo https://lnkd.in/fe_KHn8

Please feel free to add more courses or update courses to the list. I am looking forward to your pull requests!

P.S @Pluralsight is offering free access for the entire month in April 2020

Happy Learning!

More Selenium4 Goodies

After my previous post on Selenium 4 Relative Locators, I further explored Selenium4 features and found a few more goodies in WebElement and WebDriver interfaces.

Element Screenshots

Yes, now we can capture screenshot of an individual element or group of elements. This is a very useful feature. I talked about capturing element screenshots in my Selenium Testing Tools Cookbook. However, the new feature added in Selenium 4 (alpha-3) is inbuilt and much simpler.

The WebElement interface now supports getScreenShotAs() method by implementing the TakesScreenshot to capture a screenshot of the element.

This method accepts the OutputType argument and screenshots can be captured as FILE, BYTES or BASE64 string.

Let’s try to capture screenshot of a link and the search box displayed on Google Search Home page:


// find the Images link on Google Search home page
WebElement imagesLink = driver.findElement(By.linkText("Images"));

// take a screenshot of the link element
File linkScr = imagesLink.getScreenshotAs(OutputType.FILE);
FileUtils.copyFile(linkScr, new File("./target/linkScr.png"));

We can also capture a group of elements by taking a screenshot of the parent element. Here is a complete example capturing the Images link and the search box:

The new getRect() method

The new getRect() method is introduced in WebDriver interface which is essentially a combination of previous getSize() and getLocation() methods. Here’s a difference between previous methods and new the getRect() method which returns a Rectangle object:

New additions in WebDriver

In addition, to maximize() method, the browser window can now be made fullscreen by using the new fullscreen() method:

driver.manage().window().fullscreen();

A new parentFrame() method is added for navigating between frames.

driver.switchTo().parentFrame()

I’m not really sure if this is completely new feature (or maybe I’m too lazy to go through the changes) but we can now create a new empty tab or new browser window by using the newWindow() method.

driver.switchTo().newWindow(WindowType.TAB);
driver.switchTo().newWindow(WindowType.WINDOW);

That’s it for now. I’ll deep dive into new Selenium Grid features in an upcoming post.

Closing note

These features are in alpha release and subject to change in future. Please use with caution. You can find the complete code example from this post in my GitHub repo https://github.com/upgundecha/selenium4

Gherkin Dialects

One of the core principles of Behaviour Driven Development (BDD) is having meaningful conversations to describe the behaviour of the software with concrete examples.

…having conversations are more important than capturing conversations is more important than automating conversations. – Liz Keogh

BDD practitioners have a choice to select a language that is commonly used and understood by the team to describe the behaviour of the software.

Gherkin, the ubiquitous language used by BDD practitioners to describe the behaviour of software, has been translated to over 70 languages.

In order to allow Gherkin to be written in a number of languages, the keywords such as Feature, Background, Scenario, Scenario Outline, Given, When, Then, And, But, Examples have been translated into multiple languages. Find more about the languages supported by Gherkin and keywords translated in these languages at https://cucumber.io/docs/gherkin/reference/#overview

Some of these keywords have more than one translation to improve readability and flow.

Let’s take a personal loan calculator application. The feature and scenario for this software are described in the English language as below:

feature_en

Now, let’s translate the behaviour of a personal loan calculator in Hindi (one of my native languages)

feature

Automating conversations with Cucumber

Cucumber framework, the widely used tool by BDD practitioners supports Gherkin dialects.

A # language: header on the first line of a feature file tells Cucumber what spoken language to use.

To automate this feature and scenario, Cucumber will generate step definitions in the selected language. In this example, it uses Hindi as shown in below code:

Both Cucumber and Java support internationalization and this example is automated with Selenium WebDriver, navigating to the Hindi version of the personal loan calculator and checking the behaviour of the software.

Along with Java, the Gherkin dialect (i18N) support is available in supporting programming languages such as Ruby, Python, Go, DotNet, etc.

The working example is available in GitHub Repo https://github.com/upgundecha/cucumber-gherkin-hindi

Selenium4 Relative Locators

Selenium 4 alpha-3 is released yesterday with much-awaited friendly locators, now called as relative locators. These new locator methods will find elements based on their location relative to other elements, visually! You can find the desired element or elements by passing withTagName method along with near, above, below, toRight and toLeft methods. These methods take the relative WebElement or By locator as an argument. The overloaded near method takes the pixel distance as an additional argument. I did a trial run of this cool new feature on a sample app:

In the sample application, to find the input field which is right of the label Hight in Centimeters, we’ll first locate the label using the By.cssSelector method. Next, we will use the located element to find the input field. For this we will call the withTagName method along with rightOf method passing the label WebElement as shown in below snippet:

2019-10-12_14-23-13


WebElement heightLabel = driver.findElement(By.cssSelector("label[for='heightCMS']"));
WebElement heightInput =  driver.findElement(withTagName("input")
        .toRightOf(heightLLabel));

heightInput.sendKeys("181");

We can also chain the relative locator method to narrow down the search as shown in below code to find the input field to enter weight. The weight field is below hight input and right of weight label:

WebElement weightInput =   driver.findElement(withTagName("input")
        .below(heightInput).toRightOf(weightLabel));

You can find the sample code in my GitHub repo https://lnkd.in/fr5rvmh

Selenium uses JavaScript method getBoundingClientRect to find the elements using Relative Locators.

If you want to know more about these new locators and sample usage, find more details in Selenium test base (tests are living documentation)

Closing note

The relative locators should be used wisely when other methods won’t work. The features in alpha releases may change in future releases. Also, these methods may not work well on overlapping elements.

This is not an entirely new concept. There are other tools in both commercial and open-source space offering similar features to locate element based on visual cues.

Face Detection with Python and OpenCV

Recently I started playing with OpenCV and Python to experience ML & AI. I wrote a small Python program for face detection using OpenCV and Face detection API.

I don’t necessarily understand what’s going on behind the scene and something I’ll continue to explore but it was really quick and easy to bring these libraries together to detect faces.

This is program is written in Python3 and requires following libraries:


pip3 install opencv-python
pip3 install dlib
pip3 install face_recoginition

Here’s the program that will detect faces from computer’s video cam. The code is self-explanatory:

import cv2
import face_recognition

video = cv2.VideoCapture(0)

face_locations = []

while True:

ret, frame = video.read()

rgb_frame = frame[:,:,::-1]
face_locations = face_recognition.face_locations(rgb_frame)

for top, right, bottom, left in face_locations:
cv2.rectangle(frame,(left, top),(right, bottom),(255, 0, 0), 2)

cv2.namedWindow('face detector', cv2.WINDOW_NORMAL)
cv2.imshow('face detector', frame)

if cv2.waitKey(1) & 0xFF == ord('x'):
break

video.release()
cv2.destoryAllWindows()

Here’s the output when you run the program with face detected in blue rectangle:

face_detector

Easy Mock Services with Atmo

In this post, I’ll introduce you to a super cool tool Atmo for simulating HTTP based APIs for development, testing, presentations or demos. You can consider Atmo as a Service Virtualization tool or a Mock server. Find out more about both the topics at https://www.infoq.com/articles/stubbing-mocking-service-virtualization-differences

There are many commercial service virtualization and open source tools & frameworks like SoapUI, Postman, MockServer, JSONServer, WireMock etc. available for creating Mock services or APIs. However, Atmo is my favourite because it is easy to setup and offers a highly intuitive user interface to define Mock services. You can either deploy a Mock service locally or in the cloud with Zeit.

Atmo is created by Raathigeshan Kugarajan. It comes in two flavours the original core built with React & JSONServer and the new standalone cross-platform Desktop version built with Electron and Express.

atmo-screen

In this post, you will see how to use the Desktop version of Atmo for setting up a simple Mock service returning JSON response.

Installation

Download the Windows or Mac Desktop app from http://getatmo.com and launch the app.

Creating a Project

With Atmo you can create a project to logically group the Mock services. For example, you’re working on multiple projects and want to create set of Mock services for each one of these projects.

On launch, Atmo will display a Dialog with options to Create a new Project or Open a saved project.

For this example let’s create a new project called ToDo App

create_project

Define a Mock Service

After creating a new project Atmo will load an empty form to define a service. In this example, we will define an service or REST API endpoint to get a list of to-do items:

GET /todos

In Url box enter todos
Select GET operation from the drop-down
Keep the default header for Content-Type. The Mock service will return a JSON list
Select Response Type as JSON (you have a choice to return XML, Simple Text or Custom response)
Select OK as Response Code (since this a GET method)
Enter sample JSON response that will be returned by the Mock service

create_endpoint

Now the newly defined service is ready to deploy.

Deploying Service

Atmo can either deploy the newly created service on localhost or you can deploy in Zeit. Let’s deploy this on the localhost.

Save the newly created service
Click on Deploy option from the sidebar
Once the service is deployed, Atmo will show the Url in the header section. You can click on the link (for example http://localhost:9000/todos). This will open the default Browser and call the GET method. The Browser should display the raw JSON returned by the Mock service.

deploy

You can now use this service endpoint to mock a dependency in your application.

Here’s step-by-step recording –

You can do much more than a simple GET service with Atmo. You can add more logic or secure services using advanced project settings. You can deploy the services in Zeit cloud to share with other developers.

Atmo has helped me immensely in my Development and Testing workflows to create prototypes of the services for UI development or Mock the third party APIs during the development & testing.

Update – Recently one of my colleagues pointed me to Mockoon. It has similar features as Atmo and super easy to setup.

A Simple Status Page for Monitoring Application Enviornments

I was looking for a simple way to set up a status page or dashboard to monitor a REST Service and Web UI for teams to know the current status of application environments and health of the service. There are numerous ways and tools that you can use to achieve this but in this post, I’ll show you a really simple open source tool named greenyet.

greenyet is developed in Clojure and available as standalone JAR file. It polls the configured services for status information and gives a traffic light overview on the service health and availability.

You can dig the source code or simply use the JAR file with a minimal configuration.

Let’s see how to use greenyet to monitor a REST endpoint and Web UI. I have a demo app called das-boot and I want to set up a monitor for teams to monitor the Dev and QA environments.

The first step is to download the JAR file from https://github.com/cburgmer/greenyet/releases

Next, we need to setup couple of YAML configuration files –

Host List

This file lists all the hosts that you want to monitor. The list includes a name of the system or application, environment and hostname or IP. Here’s hosts.yaml for das-boot application:


- hostname: 192.168.10.101
environment: QA
system: das-boot-service
- hostname: 192.168.0.101
environment: QA
system: das-boot-ui
- hostname: 192.168.10.102
environment: Dev
system: das-boot-service
- hostname: 192.168.0.102
environment: Dev
system: das-boot-ui

Status URL’s

This file lists all the matching system entries from the host file and the endpoints. Here’s status_url.yaml for the das-boot application:


- system: das-boot-service
url: http://%hostname%:9999/api/v1/ping
- system: das-boot-ui
url: http://%hostname%:9999/

Create these files in the same directory along with the downloaded JAR file and run following command:

java -jar greenyet-2.0.0-standalone.jar

This will launch the greenyet with default polling interval and port

Open a browser window and navigate to the greenyet. This will display a page similar to below screenshot

greenyet_green

You can add more systems and configure additional options. Share this with the team or display on a TV monitor. Here is Raspberry Pi Touch displaying the greenyet monitor:

Cozmo, IFTTT and Jenkins Build Notifications

Recently I bought Anki Cozmo. This little tiny robot is amazing and a great companion on your desk. Cozmo comes with a great personality. He is full of fun, he plays games with you, do tricks, animate and makes a lot of joy. Cozmo comes with a Camera that can detect faces and greet people and pets. It also has a SDK which allows you to customize Cozmo and create cool Apps and IoT connected programs.

In this post, I’ll show how to use Cozmo with my Jenkins IFTTT Build Notification plugin to send build notification to Cozmo. He will animate to these notifications and do some tricks like lighting up his cubes. This will make Cozmo an eXtreme Feedback Device

The Cozmo SDK comes with a bundle of examples and apps that you can play and modify. There is a bunch of examples that connect Cozmo to IFTTT and use different channels like Gmail or Sports news. I took the Gmail example and modified it to get Jenkins notifications. Here’s how this works on a high level:

Step 1 – Connecting Cozmo from IFTTT

In order to connect Cozmo from IFTTT, we need a computer running Cozmo exposed to the internet. You can do this either by using a static IP or using a tool like ngrok which sets up a secure tunnel to localhost running on your computer. To set up ngrok follow instructions from https://ngrok.com/download

Run this command to create a secure public URL for port 8080:

 ./ngrok http 8080

Note the HTTP forwarding address shown in the terminal (e.g., http://4916890d.ngrok.io). This is required while creating the IFTTT applet.

WARNING: Using ngrok exposes your local web server to the internet. See the ngrok documentation for more information: https://ngrok.com/docs

Step 2 – IFTTT Jenkins Cozmo Script

Cozmo SDK is presently available in Python. The IFTTT examples use aiohttp module to create a web server with an endpoint with a handler to call the Cozmo SDK:

	#!/usr/bin/env python3

	# Copyright (c) 2016 Anki, Inc.
	#
	# Licensed under the Apache License, Version 2.0 (the "License");
	# you may not use this file except in compliance with the License.
	# You may obtain a copy of the License in the file LICENSE.txt or at
	#
	# http://www.apache.org/licenses/LICENSE-2.0
	#
	# Unless required by applicable law or agreed to in writing, software
	# distributed under the License is distributed on an "AS IS" BASIS,
	# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
	# See the License for the specific language governing permissions and
	# limitations under the License.

	# Program modified by Unmesh Gundecha, http://unmesh.me

	'''"If This Then That" Jenkins example

	This example demonstrates how "If This Then That" (http://ifttt.com) can be used
	make Cozmo respond when a Jenkins build job is completed. Instructions below
	will lead you through setting up an applet on the IFTTT website. When the applet
	trigger is called (which sends a web request received by the web server started
	in this example), Cozmo will annouce the the Build status, play an animation and
	light up the cubes.

	Please place Cozmo on the charger for this example. When necessary, he will be
	rolled off and back on.

	Follow these steps to set up and run the example:
	1) Provide a a static ip, URL or similar that can be reached from the If This
	Then That server. One easy way to do this is with ngrok, which sets up
	a secure tunnel to localhost running on your machine.

	To set up ngrok:
	a) Follow instructions here to download and install:
	https://ngrok.com/download
	b) Run this command to create a secure public URL for port 8080:
	./ngrok http 8080
	c) Note the HTTP forwarding address shown in the terminal (e.g., http://55e57164.ngrok.io).
	You will use this address in your applet, below.

	WARNING: Using ngrok exposes your local web server to the internet. See the ngrok
	documentation for more information: https://ngrok.com/docs

	2) Set up your applet on the "If This Then That" website.
	a) Sign up and sign into https://ifttt.com
	b) Create an applet: https://ifttt.com/create
	c) Set up your trigger.
	1. Click "this".
	2. Select "Maker Webhooks" as your service.
	3. Under "Choose a Trigger", select “Receive a Web request".
	4. In "Recive a Web Request", enter "JenkinsBuild" as "Event Name"
	5. Click "Create Trigger" button
	d) Set up your action.
	1. Click “that".
	2. Select “Maker Webhooks" to set it as your action channel. Connect to the Maker channel if prompted.
	3. Click “Make a web request" and fill out the fields as follows. Remember your publicly
	accessible URL from above (e.g., http://55e57164.ngrok.io) and use it in the URL field,
	followed by "/iftttJenkins" as shown below:

	URL: http://55e57164.ngrok.io/iftttJenkins
	Method: POST
	Content Type: application/json
	Body: {"project" : "{{Value1}}", "build" : "{{Value2}}", "status": "{{Value3}}"}

	5. Click “Create Action" then “Finish".

	3) Test your applet.
	a) Run this script at the command line: ./ifttt_jenkins.py
	b) On ifttt.com, on your applet page, click “Check now”. See that IFTTT confirms that the applet
	was checked.
	4) Setup Jenkins Job – requires IFTTT Build Notification Plugin
	a) In your Jenkins job "Post-build Action" section add a new "IFTTT Build Notifier"
	action with following values:

	Event Name: JenkinsBuild
	Key: <Your Make Webhooks Key>

	Note: You can get your unique Maker Webhooks Key from https://ifttt.com/services/maker_webhooks/settings

	5) Run your Jenkins job to test the setup.
	In response to the ifttt web request, Cozmo should roll off the charger, raise and lower
	his lift, announce the status, and then animate and light-up the cubes.
	'''

	import asyncio
	import re
	import sys


	try:
	from aiohttp import web
	except ImportError:
	sys.exit("Cannot import from aiohttp. Do `pip3 install –user aiohttp` to install")

	import cozmo

	from common import IFTTTRobot
	from cozmo.objects import LightCube1Id, LightCube2Id, LightCube3Id

	app = web.Application()


	async def serve_jenkins(request):
	'''Define an HTTP POST handler for receiving requests from If This Then That.

	You may modify this method to change how Cozmo reacts to the Jenkins build
	notification
	'''

	json_object = await request.json()

	# Extract the name of the project and build status.
	project_name = json_object["project"]
	status = json_object["status"]

	robot = request.app['robot']
	async def read_name():
	try:
	async with robot.perform_off_charger():
	'''If necessary, Move Cozmo's Head and Lift to make it easy to see Cozmo's face.'''
	await robot.get_in_position()

	# First, have Cozmo play an animation
	await robot.play_anim_trigger(cozmo.anim.Triggers.ReactToPokeStartled).wait_for_completed()

	# Next, have Cozmo speak the name of the project and the build status.
	if status == "SUCCESS":
	await robot.say_text("Build for " + project_name + " is successful").wait_for_completed()
	elif status == "FAILURE":
	await robot.say_text("Build for " + project_name + " is failed").wait_for_completed()
	else:
	await robot.say_text("Build for " + project_name + " is completed" + status).wait_for_completed()

	# Last, have Cozmo animate & Cubes flash light based on build status
	await rock_n_roll(robot, status)

	except cozmo.RobotBusy:
	cozmo.logger.warning("Robot was busy so didn't receive status for: "+ project_name)

	# Perform Cozmo's task in the background so the HTTP server responds immediately.
	asyncio.ensure_future(read_name())

	return web.Response(text="OK")

	async def rock_n_roll(robot, status):
	cube1 = robot.world.get_light_cube(LightCube1Id) # looks like a paperclip
	cube2 = robot.world.get_light_cube(LightCube2Id) # looks like a lamp / heart
	cube3 = robot.world.get_light_cube(LightCube3Id) # looks like the letters 'ab' over 'T'

	if status == "SUCCESS":
	light_color = cozmo.lights.green_light
	await robot.play_anim_trigger(cozmo.anim.Triggers.PeekABooGetOutHappy).wait_for_completed()
	elif status == "FAILURE":
	light_color = cozmo.lights.red_light
	await robot.play_anim_trigger(cozmo.anim.Triggers.FrustratedByFailure).wait_for_completed()
	else:
	light_color = cozmo.lights.blue_light

	if cube1 is not None:
	cube1.set_lights(light_color)
	else:
	cozmo.logger.warning("Cozmo is not connected to a LightCube1Id cube – check the battery.")

	if cube2 is not None:
	cube2.set_lights(light_color)
	else:
	cozmo.logger.warning("Cozmo is not connected to a LightCube2Id cube – check the battery.")

	if cube3 is not None:
	cube3.set_lights(light_color)
	else:
	cozmo.logger.warning("Cozmo is not connected to a LightCube3Id cube – check the battery.")

	await asyncio.sleep(10)
	cube1.set_lights_off()import asyncio
	import re
	import sys


	try:
	from aiohttp import web
	except ImportError:
	sys.exit("Cannot import from aiohttp. Do `pip3 install –user aiohttp` to install")

	import cozmo

	from common import IFTTTRobot
	from cozmo.objects import LightCube1Id, LightCube2Id, LightCube3Id

	app = web.Application()


	async def serve_jenkins(request):
	'''Define an HTTP POST handler for receiving requests from If This Then That.

	You may modify this method to change how Cozmo reacts to the Jenkins build
	notification
	'''

	json_object = await request.json()

	# Extract the name of the project and build status.
	project_name = json_object["project"]
	status = json_object["status"]

	robot = request.app['robot']
	async def read_name():
	try:
	async with robot.perform_off_charger():
	'''If necessary, Move Cozmo's Head and Lift to make it easy to see Cozmo's face.'''
	await robot.get_in_position()

	# First, have Cozmo play an animation
	await robot.play_anim_trigger(cozmo.anim.Triggers.ReactToPokeStartled).wait_for_completed()

	# Next, have Cozmo speak the name of the project and the build status.
	if status == "SUCCESS":
	await robot.say_text("Build for " + project_name + " is successful").wait_for_completed()
	elif status == "FAILURE":
	await robot.say_text("Build for " + project_name + " is failed").wait_for_completed()
	else:
	await robot.say_text("Build for " + project_name + " is completed" + status).wait_for_completed()

	# Last, have Cozmo animate & Cubes flash light based on build status
	await rock_n_roll(robot, status)

	except cozmo.RobotBusy:
	cozmo.logger.warning("Robot was busy so didn't receive status for: "+ project_name)

	# Perform Cozmo's task in the background so the HTTP server responds immediately.
	asyncio.ensure_future(read_name())

	return web.Response(text="OK")

	async def rock_n_roll(robot, status):
	cube1 = robot.world.get_light_cube(LightCube1Id) # looks like a paperclip
	cube2 = robot.world.get_light_cube(LightCube2Id) # looks like a lamp / heart
	cube3 = robot.world.get_light_cube(LightCube3Id) # looks like the letters 'ab' over 'T'

	if status == "SUCCESS":
	light_color = cozmo.lights.green_light
	await robot.play_anim_trigger(cozmo.anim.Triggers.PeekABooGetOutHappy).wait_for_completed()
	elif status == "FAILURE":
	light_color = cozmo.lights.red_light
	await robot.play_anim_trigger(cozmo.anim.Triggers.FrustratedByFailure).wait_for_completed()
	else:
	light_color = cozmo.lights.blue_light

	if cube1 is not None:
	cube1.set_lights(light_color)
	else:
	cozmo.logger.warning("Cozmo is not connected to a LightCube1Id cube – check the battery.")

	if cube2 is not None:
	cube2.set_lights(light_color)
	else:
	cozmo.logger.warning("Cozmo is not connected to a LightCube2Id cube – check the battery.")

	if cube3 is not None:
	cube3.set_lights(light_color)
	else:
	cozmo.logger.warning("Cozmo is not connected to a LightCube3Id cube – check the battery.")

	await asyncio.sleep(10)
	cube1.set_lights_off()
	cube2.set_lights_off()
	cube3.set_lights_off()

	# Attach the function as an HTTP handler.
	app.router.add_post('/iftttJenkins', serve_jenkins)

	if __name__ == '__main__':
	cozmo.setup_basic_logging()
	cozmo.robot.Robot.drive_off_charger_on_connect = False

	# Use our custom robot class with extra helper methods
	cozmo.conn.CozmoConnection.robot_factory = IFTTTRobot

	try:
	app_loop = asyncio.get_event_loop()
	sdk_conn = cozmo.connect_on_loop(app_loop)

	# Wait for the robot to become available and add it to the app object.
	app['robot'] = app_loop.run_until_complete(sdk_conn.wait_for_robot())
	except cozmo.ConnectionError as e:
	sys.exit("A connection error occurred: %s" % e)

	web.run_app(app)
	cube2.set_lights_off()
	cube3.set_lights_off()

	# Attach the function as an HTTP handler.
	app.router.add_post('/iftttJenkins', serve_jenkins)

	if __name__ == '__main__':
	cozmo.setup_basic_logging()
	cozmo.robot.Robot.drive_off_charger_on_connect = False

	# Use our custom robot class with extra helper methods
	cozmo.conn.CozmoConnection.robot_factory = IFTTTRobot

	try:
	app_loop = asyncio.get_event_loop()
	sdk_conn = cozmo.connect_on_loop(app_loop)

	# Wait for the robot to become available and add it to the app object.
	app['robot'] = app_loop.run_until_complete(sdk_conn.wait_for_robot())
	except cozmo.ConnectionError as e:
	sys.exit("A connection error occurred: %s" % e)

	web.run_app(app)

view raw

ifttt_jenkins.py

hosted with ❤ by GitHub

Complete source code is available at https://github.com/upgundecha/cozmo-python-sdk

Step 3 – Creating IFTTT Recipe

IFTTT is a web service that lets you create chains of simple conditional statements, called applets. An applet is triggered by changes that occur within other web services such as Gmail, Facebook, Instagram, or Twitter. An applet may send an e-mail message if the user tweets using a hashtag or copy a photo on Facebook to a user’s archive if someone tags a user in a photo or it can trigger an support IoT device to a specific action.

In this example, we will create custom IFTTT Trigger and Action using Maker Webhooks feature.

Sign up and sign into https://ifttt.com
1. Create an applet: https://ifttt.com/create
2. Set up your trigger.
  1. Click “this”.
  2. Select “Maker Webhooks” as your service.
  3. Under “Choose a Trigger”, select “Receive a Web request”.
  4. In “Receive a Web Request”, enter “JenkinsBuild” as “Event Name”
  5. Click “Create Trigger” button
3. Set up your action.
  1. Click “that”.
  2. Select “Maker Webhooks” to set it as your action channel. Connect to the Maker channel if prompted.
  3. Click “Make a web request” and fill out the fields as follows. Remember your publicly accessible URL from above (e.g., http://55e57164.ngrok.io) and use it in the URL field, followed by “/iftttJenkins” as shown below:

URL: http: // 55e57164.ngrok.io / iftttJenkins
Method: POST
Content Type: application / json
Body: {“project”: “{{Value1}}”, “build”: “{{Value2}}”, “status”: “{{Value3}}”

Click “Create Action” then “Finish”.

Here is video loop for above settings:

Step 4 – Configuring Jenkins Build Job

Setup Jenkins Job – requires IFTTT Build Notification Plugin

In Jenkins job “Post-build Action” section add a new “IFTTT Build Notifier” action with following values:

Event Name: JenkinsBuild
Key: <Make Webhooks Key>

Note: You can get your unique Maker Webhooks Key from https://ifttt.com/services/maker_webhooks/setting

Finally, run the Jenkins job to test the setup. In response to the ifttt web request, Cozmo should roll off the charger, raise and lower his lift, announce the status, and then animate and light-up the cubes.

Here is video loop for above settings:

Running it together

Here’s video with Cozmo’s reaction to a passed build vs. a failed build:

You can also connect CI tools like Travis or Circle CI using curl command to Maker endpoint.

We can add more actions to this web server and make Cozmo thrill.

API Testing with Postman Collections in AWS CodePipeline

This post explains how to setup an AWS CodePipeline to run Postman collections for testing REST APIs using AWS CodeCommit and AWS CodeBuild.

Step 1 – Creating a Git repository with AWS CodeCommit

AWS CodeCommit is a version control service hosted by AWS. You can create, manage Git repositories on CodeCommit.

For this project, we will create a new repository named postman-sample from AWS Console > Developer Tools > CodeCommit

Clone the newly created repository on your computer

Step 2 – Exporting Postman Collection

Next, we need to export the Postman collection so we can run this using newman cli

Select Collection v2 option from Export Collection dialogue box and click Export

Save the collection in cloned repository folder from Step 1 above

Creating buildspec file

We need to create a buildspec file to tell AWS CodeBuild how we want to run the collection. Before running the collection we need to install newman npm package in pre_build phase and then call newman cli with the collection we want to run in the build phase. We can also specify report options to generate HTML file at the end. We will upload this file to S3 after CodeBuild executes the collection:

Commit & Push the collection and buildspec file to CodeCommit in master branch

You can find the collection and buildspec file used for this example at https://github.com/upgundecha/postman-sample

Step 3 – Creating an S3 Bucket to save report

Let’s create an S3 bucket to save the report file generated by the newman. We can use this file to publish the results.

From AWS Console > Storage > S3 create a new bucket named postmanreport (you will need to use a unique name). You can enable version control on S3 bucket to see historical reports.

Step 4 – Creating an AWS CodeBuild Project

We will use CodeBuild to fetch the changes from CodeCommit and run the collection using newman. We already have buildspec file which has a sequence for execution.

From AWS Console > Developer Tools > CodeBuild create a project named postman-sample.

Set Source Provider as AWS CodeCommit and Repository as postman-sample:

We need an environment to run the build job. Let’s configure the Ubuntu/Node.js environment and Artefacts settings as shown in below screenshot:

Next, we need to configure a Service role. Create a new service role and click Continue

The CodeBuild project is ready. We can test this project by manually starting the build.

Step 5 – Bringing it together with AWS CodePipeline

Finally, we need to create a new AWS CodePipleine to trigger the CodeBuild when a new change is pushed to CodeCommit.

From AWS Console > Developer Tools > CodePipeline create a pipeline named postman-sample:

Configure the Source Location as AWS CodeCommit as shown in below screenshot:

Configure the Build provider as AWS CodeBuild with the CodeBuild project created in Step 4 above as shown in below screenshot:

We just want to run tests and stop there for now. We will not deploy anything in this project so we will select No Deployment option in Deploy section as shown in below screenshot: