Tasting Your First Test Burger

Tautrimas Pajarskas

About Me:

Tautrimas Pajarskas

PHP Team Lead,Lecturer at NFQ Academy,

Striving for efficient and scalable projects development

Goals Today

Observation: Automated testing is not used with legacy projects.

My goal is to encourage you to start testing.Today I will present you the HOW TO part.

What is Automated Testing?

Making someone do clicking for you (:

I am a Member of ONGR

We do Unit, Integration, Functional and Acceptance testing. > 90% test coverage.

First Time Testing is Like Trying a Burger

Too much stuff!

Continuous Integration

Example:https://travis-ci.org/ongr-io/ongr-sandbox

Databases

Q: I want to test deleting a user. How to login after that?A: Use fixtures.Q: ?

Which ones should I do?

Types of Tests

Tools

PHPUnit or phpspec?Behat using Selenium or CasperJS?

Difficult to choose without guidance.

Advice:Simply try CasperJS. Acceptance testing.

And if you cannot experiment at workDon’t do it at home!

Demo Time!

Demo Overview

1. Write basic CasperJS test2. Test dynamic Bootstrap feature3. Use Resurrectio recorder4. Use PhantomCSS for design testing

Our Example Legacy Project

First Test

Taking a Screenshot for debugging

Fixing Desktop Viewport Size

Test Dropdown Menu Works

Try out Resurrectio

https://github.com/ebrehault/resurrectio

Resurrectio is a Chrome extension allowing to record a sequence of browser actions and to produce the corresponding CasperJS script.

-- Resurrectio README.md

Start the Recording

Resulting Script After a Few Clicks

PhantomCSS: CSS regression testing

Let’s “accidentally” change <h1> font-size down

PhantomCSS: CSS regression testing

PhantomCSS is good for detecting any visual changes that are hard to sample using scripts.

Only do screenshot parts of the page. Otherwise, the change in the footer will fail every single page test in the test suite.

PhantomCSS: CSS regression testing

Increasing number of screenshots can get large for GIT. Use another GIT repo for them or look up solutions offered in:

https://github.com/Huddle/PhantomCSS

PhantomCSS: CSS regression testing

Use PhantomCSS only for design testing and only where it is needed.

Otherwise, screenshot diff collision madness will occur in your team (:

Summary

Summary for Legacy Projects

Isolate project’s testing version locally on a separate vhost and a separate DB.

Write a script that prepares project for testing. E. g. loads testing data for DB.

Start with highest level tests shown today.

Summary for Legacy Projects

Later, try out your Framework testing functionality for Unit testing. You will need it for much faster and fine grained tests. Remember to delete and rewrite crappy tests!

Experiment, acquire testing skills and spread the success stories!

Thank You!

Follow hottest web technology news atfacebook.com/nfq.lt