Getting Started with the Screenplay Pattern

Introduction

The Screenplay Pattern is an approach to writing automated acceptance tests founded on good software engineering principles that makes it easier to write clean, readable, scalable, and highly maintainable test code. … For example, it is very easy to write a test with several actors using different browser instances.

Before we go in to how the Screenplay Pattern works, I think it is important to first explain some of the pain points in Page Objects model and why Screenplay Pattern can be seen as a better alternative.

With Page Objects model, it serves its purpose quite well up to a point, but then eventually, page object classes can start getting bigger, making it harder to find things and increase code smell due to having a large class. A large class could be caused by a number of things, such as code duplication, or lack of abstraction.

Often times, Page Objects model is a SOLID anti pattern and page objects quite often break the Single Responsibility principle, even if the page objects are broken down in to smaller classes.

A great video on the pain points of Page Objects Model and the benefits of Screenplay Pattern can be found here.

Another good example could be the use of PageFactory. When using PageFactory, frequently it breaks the YAGNI (You Aren’t Gonna Need It) principle.

Let’s now start to explore the design of the Screenplay Pattern 🙂

The Screenplay Pattern Design

Let’s take an example Cucumber scenario like so…

Feature: Add new items to the todo list

  As James (the just-in-time kinda guy)
  I want to capture the most important things I need to do
  So that I don’t leave so many things until the last minute

  Scenario: Adding the first todo item
    Given that James has an empty todo list
     When he adds Buy some milk to his list
     Then his todo list should contain Buy some milk

We can think about this scenario in various different ways:

• Who is this scenario for?
  • What role do they play?
• What is their goal?
• What tasks do they need to perform in order to achieve their goal?
• What interactions will they need to do in order to complete each task?

If we look at the words above that are in bold, they are the foundations of the Screenplay Pattern. Let’s try and explain each one in more detail…

Role

The role we need someone to play for this feature is a ‘just-in-time kinda guy’.

Actor

Each role we discover requires an actor to play it. In the above feature, we have created an actor/persona called James who will play the role of a ‘just-in-time kinda guy’

A defined actor can perform tasks or ask questions about the state of the application.

Goal

The goal of an Actor is represented by the subject line of the test scenario.

In this case, the goal would be ‘adding the first todo item’.

James should be able to complete his goal of adding the first todo item to his list.

Task

In order for an actor to achieve their goal, they need to perform high-level tasks.

We name tasks using the vocabulary of the Problem Domain, where our customers live.

For example, in the above scenario, one task could be to AddATodoItem.called(‘Buy some milk’) , which mapped to a Cucumber.ts step definition could look like the below…

this.When(/^he adds (.*?) to his list$/, (itemName: string) => {
    return james.attemptsTo(
        AddATodoItem.called(itemName)
    );
});

Interaction

In order to perform a whole task, the task will contain/encapsulate multiple interactions directly related to completing the given task.

Question

Similarly to an Interaction, a Question directly exercises Actor’s Ability to interact with a specific external interface of the system – such as a website, a mobile app or a web service.

Asking a Question results in a promise that is eventually resolved to a specific value or a list of values.

Ability

In order to interact with the system, an Actor needs Abilities, which encapsulate interface-specific clients.

Those clients could be a web browser, a web service client, a mobile device driver and so on.

For example, for a web application, the actor would need the ability to BrowseTheWeb.

Another example could be for a web service, where the actor would need the ability to InteractWithTheApi.

Visual Diagram of The Model

Hopefully this section as well as its included links has given you an understanding of what Screenplay Pattern is and how it works.  In the next section, we will begin adding our tests and implementing this Screenplay Pattern 🙂

Liked it? Take a second to support Thomas on Patreon!