We Behatin’

INTRODUCTION Behat background

3 Behat prep Getting started

4 Behat background What is behat? Form of functional or acceptance testing Focus on testing functionality from the end-user perspective Automates verification of site functionality/behavior

5 Behat background Great. So why Behat? The Drupal and Symfony communities (among others) are standardizing on Behat Non-technical users can help write the test cases. Helps us focus on the end-user experience. Reduces the number of regression bugs Provides clearer specifications about what is expected Can test user interactions in a browser

6 Behat background What’s this mean for me? Implement the feature/scenari o files Step 1Step 2Step 3Step 4Step 5Step 6 Implement any custom steps Implement the story/ticket Verify the tests pass Submit the PR with both the test implementatio n and test files PROFIT! TDD (Test Driven Development)

INTRODUCTION Behat basics

8 > vagrant ssh > cd /var/www/drupalvm/drupal > behat --story-syntax Behat basics Some Sample Syntax

Feature: Some terse yet descriptive text of what is Scenario: Some determinable business situation Given some precondition And some other precondition When some action by the actor And some other action And yet another action Then some testable outcome is achieved And something else we can check happens too Behat basics Anatomy of a Feature and Scenario Written in Gherkin language Business Readable Line-Oriented language Tags are used to organize features and scenarios. Feature Conventionally one Feature per *.feature file. Steps Must start with one of these. Given, When, Then, But or And The trailing portion after “Given”, “And”, “When”, “Then” is matched to a regular expression which executes a PHP callback.

Feature: Some terse yet descriptive text of what is Scenario: Some determinable business situation Given some precondition And some other precondition When some action by the actor And some other action And yet another action Then some testable outcome is achieved And something else we can check happens too Behat basics Anatomy of a Feature and Scenario Written in Gherkin language Business Readable Line-Oriented language Tags are used to organize features and scenarios. Feature Conventionally one Feature per *.feature file. Steps Must start with one of these. Given, When, Then, But or And The trailing portion after “Given”, “And”, “When”, “Then” is matched to a regular expression which executes a PHP callback.

Feature: Some terse yet descriptive text of what is Scenario: Some determinable business situation Given some precondition And some other precondition When some action by the actor And some other action And yet another action Then some testable outcome is achieved And something else we can check happens too Behat basics Anatomy of a Feature and Scenario Written in Gherkin language Business Readable Line-Oriented language Tags are used to organize features and scenarios. Feature Conventionally one Feature per *.feature file. Steps Must start with one of these. Given, When, Then, But or And The trailing portion after “Given”, “And”, “When”, “Then” is matched to a regular expression which executes a PHP callback.

Feature: Some terse yet descriptive text of what is Scenario: Some determinable business situation Given some precondition And some other precondition When some action by the actor And some other action And yet another action Then some testable outcome is achieved And something else we can check happens too Written in Gherkin language Business Readable Line-Oriented language Tags are used to organize features and scenarios. Feature Conventionally one Feature per *.feature file. Steps Must start with one of these. Given, When, Then, But or And The trailing portion after “Given”, “And”, “When”, “Then” is matched to a regular expression which executes a PHP callback. Behat basics Anatomy of a Feature and Scenario

Feature: Some terse yet descriptive text of what is Scenario: A less trival business situation Given some step with “String” argument And number step with 23 /** /^some step with “([^”]*)” argument$/ */ public function someStepWithArgument($argument1) { // Code to assert or Throw Exception } /** /^number step with (\d+)$/ */ public function numberStepWith($argument1) { // Code to assert or Throw Exception } Behat basics Anatomy of a Feature and Reuseable Scenario

Feature: Some terse yet descriptive text of what is Scenario: A less trival business situation Given some step with “String” argument And number step with 23 /** /^some step with “([^”]*)” argument$/ */ public function someStepWithArgument($argument1) { // Code to assert or Throw Exception } /** /^number step with (\d+)$/ */ public function numberStepWith($argument1) { // Code to assert or Throw Exception } Behat basics Anatomy of a Feature and Scenario

Feature: Some terse yet descriptive text of what is Scenario: A less trival business situation Given some step with “String” argument And number step with 23 /** /^some step with “([^”]*)” argument$/ */ public function someStepWithArgument($argument1) { // Code to assert or Throw Exception } /** /^number step with (\d+)$/ */ public function numberStepWith($argument1) { // Code to assert or Throw Exception } Behat basics Anatomy of a Feature and Scenario

Feature: Some terse yet descriptive text of what is desired Background: Given A User that likes cucumbers And The current User is hungry Scenario Outline: Eating example Given there are cucumbers When I eat cucumbers Then I should have cucumbers Examples: | start | eat | left | | 12 | 5 | 7 | | 20 | 5 | 15 | Behat basics Scenario Outline Examples is a Gherkin table The scenario will be run with each row (not header) of the table. Steps, known as Givens, Whens and Thens are technically all the same thing to Behat. Convention proposes: Givens: to put the system into a known state. Given I’m logged in as an ‘Administrator’ Whens: to describe the key action performed by the user. I delete user “achievebot” Thens: to observe outcomes. Then “Friday” is met with silence.

Feature: Some terse yet descriptive text of what is desired Background: Given A User that likes cucumbers And The current User is hungry Scenario Outline: Eating example Given there are cucumbers When I eat cucumbers Then I should have cucumbers Examples: | start | eat | left | | 12 | 5 | 7 | | 20 | 5 | 15 | Behat basics Scenario Outline Examples is a Gherkin table The scenario will be run with each row (not header) of the table. Steps, known as Givens, Whens and Thens are technically all the same thing to Behat. Convention proposes: Givens: to put the system into a known state. Given I’m logged in as an ‘Administrator’ Whens: to describe the key action performed by the user. I delete user “achievebot” Thens: to observe outcomes. Then “Friday” is met with silence.

18 Examples is a Gherkin table The scenario will be run with each row (not header) of the table. Steps, known as Givens, Whens and Thens are technically all the same thing to Behat. Convention proposes: Givens: to put the system into a known state. Given I’m logged in as an ‘Administrator’ Whens: to describe the key action performed by the user. I delete user “achievebot” Thens: to observe outcomes. Then “Friday” is met with Feature: Some terse yet descriptive text of what is desired Background: Given A User that likes cucumbers And The current User is hungry Scenario Outline: Eating example Given there are cucumbers When I eat cucumbers Then I should have cucumbers Examples: | start | eat | left | | 12 | 5 | 7 | | 20 | 5 | 15 | Behat basics Scenario Outline

Feature: Some terse yet descriptive text of what is desired Background: Given A User that likes cucumbers And The current User is hungry Scenario Outline: Eating example Given there are cucumbers When I eat cucumbers Then I should have cucumbers Examples: | start | eat | left | | 12 | 5 | 7 | | 20 | 5 | 15 | Examples is a Gherkin table The scenario will be run with each row (not header) of the table. Steps, known as Givens, Whens and Thens are technically all the same thing to Behat. Convention proposes: Givens: to put the system into a known state. Given I’m logged in as an ‘Administrator’ Whens: to describe the key action performed by the user. I delete user “achievebot” Thens: to observe outcomes. Then “Friday” is met with silence. Behat basics Scenario Outline

20 Scenario: Showing delivery cost for a product on the basket page Given there is a product: | name | White Marker | | price | £5 | And I am on the "/catalogue" page When I click "Buy" in the "White Marker" product block And I go to the "/basket" page Then I should see a list with 1 product And the overall price should be shown as £9 Bad scenario Too granular No business information Locks user to UI. (This one is arguable) Behat basics Behat is NOT unit testing!

21 Scenario: Getting the delivery cost for a single product under £10 Given a product named "White Marker" and priced £5 was added to the catalogue When I add the "White Marker" product from the catalogue to the picked up basket Then the overall basket price should be £9 Better scenario Focuses on business information Clear understanding of business concept behind the user- stories. Behat basics Behat is NOT unit testing!

EXERCISE Let’s do this

23 Exercise Blog post content creation Let’s create a test to ensure an authorized user can create blog posts.

24 Exercise Start with Feature: Test Blog Post Creation In order to create blog content As an authorized user I need to have access to the content creation page

25 Exercise Add Feature: Test Blog Post Creation In order to create blog content As an authorized user I need to have access to the content creation Scenario: Attempting to create blog content as anonymous Given I am an anonymous user And I am on "/node/add/blog_post" Then I should see "Access denied"

26 Exercise Add Feature: Test Blog Post Creation In order to create blog content As an authorized user I need to have access to the content creation Scenario: Attempting to create blog content as anonymous Given I am an anonymous user And I am on "/node/add/blog_post" Then I should see "Access Scenario: Attempting to create blog content as administrator Given I am logged in as a user with the "administrator" role And I am on "/node/add/blog_post" Then I should see "Create Blog post"

27 FAILURE = SUCCESS We want our tests to fail. This is TDD.

28 Exercise Add another scenario Make it work. Create a ‘Blog post’ content type.

29 WE ARE GENIUSES Obviously.

30 Exercise Add another scenario But admins really shouldn’t be the only ones that can create blog posts. How about Content creators?

31 Exercise Enter Scenario Template: Attempting to create blog content as an authorized user Given I am logged in as a user with the " " role And I am on "/node/add/blog_post" Then I should see "Create Blog post” Examples: | role | | administrator | | Content creator |

32 BOOM

33 Exercise Run our tests Run the tests again. Fail again. Win.

34 Exercise Do the work Create a “Content creator” role. Test again.

35 DO THE HAPPY DANCE

36 Exercise DIY But what if we need a custom step?

37 Exercise DIY But what if we need a custom step? Let’s try that.

38 Exercise Scenario: Viewing the homepage as an administrator Given I am logged in as a user with the "administrator" role And I am on the homepage Then I should see "Powered by" in the ”footer" And I should see a block titled "Tools"

39 Exercise Test DIY Run the test. Again. Fail. Again.

40 Exercise Test DIY /** I should see a block titled :arg1 */ public function iShouldSeeABlockTitled($arg1) { throw new PendingException(); }

41 RUN. FAIL. REPEAT.

42 Exercise Test DIY public function iShouldSeeABlockTitled($arg1) { $success = FALSE; // Get our page. $page_element = $this->getSession()->getPage(); // Find and match block titles. $matches = $page_element->findAll('css', "div.block > h2"); foreach ($matches as $match) { if ($match->getText() == $arg1) { $success = TRUE; break; } } if (!$success) { throw new Exception("No block titled '". $arg1. "' found."); } }

43 RUN. FAIL. REPEAT.

44 Exercise ?!?!?! What went wrong? Inspect the css. It’s a “nav” element, not a div. Change the test and try again.

45 Exercise Fix it. public function iShouldSeeABlockTitled($arg1) { $success = FALSE; // Get our page. $page_element = $this->getSession()->getPage(); // Find and match block titles. $matches = $page_element->findAll('css', "nav.block > h2"); foreach ($matches as $match) { if ($match->getText() == $arg1) { $success = TRUE; break; } } if (!$success) { throw new Exception("No block titled '". $arg1. "' found."); } }

46 WE DID IT!

47 Recap What we learned Why? Feature Scenario Steps Scenario template Custom steps

48 Questions Go. ?