Web Acceptance Testing For Grumpy Programmers

How you can bend Behat + Mink + PhantomJS to your will to create web acceptance tests

Transcript

1. Web Acceptance Testing For Grumpy Programmers php|tek 2013 May 15, 2013 Chris Hartjes
2. whoami
3. Test vs. Test
4. A New Test Type
5. A New Test Type “BDD is a second-generation, outside–in, pull-based, multiple-stakeholder, multiple- scale, high-automation, agile methodology. It describes a cycle of interactions with well- defined outputs, resulting in the delivery of working, tested software that matters”
6. A New Test Type
7. A New Test Type Behavior-driven development specifies that tests of any unit of software should be specified in terms of the desired behavior of the unit.
8. What’s The Scenario Given I am in a talk When the speaker is presenting And he glares at me I remain quiet
9. What’s The Scenario Tests are readable by people first Non-technical people can be taught the DSL
10. Getting Started?
11. Behat
12. What Is It? “A PHP framework for testing your business expectations” http://behat.org
13. How Do I Use It 1. Install it via Composer 2. ??? 3. Profit!
14. How Do I Use It? 1. Install via Composer 2. Create a Feature with a Scenario 3. Run your test 4. Profit!
15. Installing
16. Create Your Feature File
17. What Is A Scenario? A test that covers specific behavior you wish to test
18. What Is A Scenario?
19. First Run
20. Steps To Implement
21. Steps To Implement
22. Write Some Code
23. Scenario Passes!
24. What About Web Testing?
25. Mink Framework for doing web acceptance testing Sits between Behat and browser emulator http://mink.behat.org
26. Installing
27. Browser Emulation
28. How does it help? Provides a common API for browser interaction Provides built-in functionality for common tasks
29. Goutte Pure PHP browser emulator Great for testing non-Javascript functionality
30. Installing Goutte
31. Behat + Goutte Config
32. Sample Mink Feature
33. Proof!
34. What About JavaScript?
35. PhantomJS
36. PhantomJS Headless browser based on WebKit Node app (don’t worry, npm will save you)
37. Installing PhantomJS Good instructions at http://slid.es/gimler/behat-mink-phantomjs Install npm (Node Package Manager) `npm install -g phantomjs`
38. Selenium2 + PHPUnit
39. Why Selenium2? PhantomJS can pretend to be a standalone Selenium2 server Configure Behat to send JavaScript scenarios to it
40. Behat + PhantomJS
41. Behat + PHPUnit Adds support for generic assertions
42. Adding in PHPUnit
43. Run PhantomJS `phantomjs --phantomjs --webdriver=8643`
44. Our first JS Scenario
45. Proof!
46. Now it gets grumpier
47. CSS Selectors Best way to locate specific elements on a page If you disliked CSS before, this might push you over the edge
48. Y U MAD CHRIS? 'html body div.container div.row div.span9 section#modals div#myModal.modal div.modal-header h3#myModalLabel' TOTALLY INTUITIVE Learn your browser debugger tools well
49. Pro Tip #1 Give all your elements ID’s Make it easier for CSS selectors to find them
50. Waiting For JavaScript Behat steps will need wait() commands for JS Gives time for browser to render Acceptance tests are not supposed to be fast
51. Pro Tip #2 Be conservative in your waiting estimates
52. Breaking down the steps
53. Breaking down the steps
54. Lessons Learned WAT is definitely “test-after” Learn CSS really well or else Twitter Rage ensues Good ratio is 90% unit - 10% WAT
55. Lessons Learned Keep your feature files focused to scenario groups Create app-critical scenarios
56. Advanced Level Different Behat configuration files for different environments `behat ---config <path to config file>`
57. Advanced Level Use Behat Gearman extension to run scenarios in parallel http://extensions.behat.org/gearman/
58. Building Testable Apps http://grumpy-testing.com
59. PHPUnit Cookbook http://grumpy-phpunit.com
60. Testing Screencasts
61. Thank You! https://github.com/chartjes/wat-tek13 https://joind.in/8167 @grmpyprogrammer