1. Panther loves
Symfony apps
SIMONE D’AMICO SOFTWARE ENGINEER @ SPREAKER
Not just e2e testing, unleash the full potential!

2. Me
Simone D’Amico @dymissy
First met Symfony in 2013 (symfony/symfony:>=2.3)
Software Engineer at

3. Howdy,
let's see
what this
talk is
about.
Panther is a browser testing and
web scraping library that relies on
the WebDriver W3C specification
to manipulate real web browsers.
3

4. SO, PANTHER...
Yet another functional
testing library. Isn’t it?

5. It is,
but...
● Are you able to test Javascript
interaction with BrowserKit?
● Are you able to test async calls in
your web page with BrowserKit?
● Are you able to test unexpected
CSS behaviors in your web page
with BrowserKit?
● Are you able to scrape web pages
without installing dedicated
libraries? What if those web
pages use Javascript?

6. BrowserKit
doesn’t
support JS
(nor CSS)

7. That’s exactly what
Panther is meant for!

8. LET ME TELL YOU A STORY

9. DietWater LTD
DietWater LTD is a
newly founded startup
and its core business is
selling calorie-free
water.

10. 10

11. They sell the product worldwide on
several marketplaces (eg. Amazon,
Bestbuy, Walmart, etc.) and collect all
the reviews from all marketplaces on
a landing page.
The tech team consists of:
● Matt, the UX/UI designer
● Julia, the frontend developer
● Grace, the backend developer
DietWater LTD

12. www.spreaker.com
All people
in the
team got
frustrated
for some
reasons...
Matt
Matt is pixel-perfect
addicted and he can’t
stand when
something being
released is not
roughly the same on
different devices.
He’s looking for a way
to automate
cross-browser
testing on multiple
devices.
Julia
Julia is always afraid
the next PR will be the
one that causes a
serious visual
regression.
She’s looking for a
tool which will help
her to create a safety
net against visual
regressions.
Grace
Grace is fed up of
maintaining the
infrastructure needed
for scraping reviews
from all different
marketplaces.
She’s looking for an
automatic and stable
way of retrieving info
from several places.

13. HOW CAN WE HELP THEM?

14. Panther
provides a
solution for
each of them
14

15. Panther in
a nutshell
● Executes real web browsers
(including JS/CSS) thanks to native
support for ChromeDriver and
GeckoDriver
● Implements BrowserKit’s API
● Provides convenient methods for
JS testing (wait, execute script, …)
● Able to take screenshots
● Standalone library for web scraping
https://www.slideshare.net/coopTilleuls/panther-test-your-symfony-apps-with-real-web-browsers

16. 16
Adding Panther to your SF app in 3 steps
(assuming you are using a compatible Docker definition*)
* https://github.com/dunglas/symfony-docker
1
Flex recipe installs the library and
automatically updates the Dockerfile
to install Chromedriver in the image

17. 17
Register PHPUnit extension
Adding Panther to your SF app in 3 steps
(assuming you are using a compatible Docker definition*)
2
* https://github.com/dunglas/symfony-docker

18. Replace WebTestCase with PantherTestCase
Replace the client with the Panther one
Adding Panther to your SF app in 3 steps
(assuming you are using a compatible Docker definition*)
* https://github.com/dunglas/symfony-docker
3

19. HOW CAN WE HELP THEM?

20. Matt - UX/UI Designer
Pain: being able to review web pages
before releasing them on production
Solution: CI step which helps Matt to
see how pages have been rendered
on different browsers and devices as
soon as a new release is being
deployed on stage environment
20

21. Julia - Frontend Developer
Pain 1: unable to properly test
Javascript interactions and
asynchronous calls
Solution: testing async calls thanks
to waitFor() and DOM APIs
21

22. Julia - Frontend Developer
Pain 2: afraid of introducing visual
regressions
Solution: screenshots and e2e
testing
22

23. Grace - Backend Developer
Pain: maintaining the infrastructure
needed for scraping several websites
is costly
Solution: Use Panther client which is
able to make async calls and scrape
Javascript pages
23

24. TELL ME MORE

25. How does Panther work?
Under the hood Panther:
● starts your project with the built-in PHP web-server on
localhost:9000
● starts the version of Chromedriver shipped with the library
to automate your local Chrome
● executes the browsing scenario defined in the test with
Chrome in headless mode

26. How does Panther work?
Under the hood Panther makes use of:
● PHP Webdriver (https://github.com/facebook/php-webdriver)
● BrowserKit and DomCrawler
(https://github.com/symfony/symfony)
● Goutte (https://github.com/FriendsOfPHP/Goutte)

27. Which browsers shall I use?
Even if Chrome is the default choice, Panther also supports:
● remote browser testing services (Selenium Grid,
SauceLabs and Browserstack)
● Geckodriver (local installation of Firefox)

28. How does Panther work?

29. How does Panther work?

30. How does Panther work?

31. Pro Tip

32. PROs
- Standalone
- Nothing to configure
- No web server
- No Selenium
- Easy to maintain
- Easy to integrate
CONs
- Heavy docker image
(~500MB)
- Flaky results
- Functional tests are
slowly and costly
- Requires PHP
expertise

33. Why would I need Panther when
Javascript with its myriad of testing
tools already suits these needs?
The Symfony team is working hard to provide a modern and
straightforward integration of JavaScript directly in the framework
through the UX initiative.
In this context, having a good browser testing library with JavaScript
support is a must.

34. DietWater Repository
https://github.com/dymissy/diet-water

35. Thanks. SIMONE D’AMICO
SOFTWARE ENGINEER @ Spreaker
Get In Touch
simone.damico@spreaker.com
@dymissy
https://www.linkedin.com/in/simonedamico/

37. Image Credits