Behatを使ってWordPressの構成をテストする

PHPカンファレンス 2016のスライドです。

Transcript

1. #FIBU
   Λ࢖ͬͯ
 8PSE1SFTT
   ͷߏ੒ͷςετΛ
 ࣗಈԽ͢Δ 
   QIQDPO
   5BLBZVLJ
   .JZBVDIJ
   UXJUUFS
   !NJZB
6. #FIBU
   ʹ͍ͭͯ
7. IUUQCFIBUPSH
8. w #FIBU
   ͱͷग़ձ͍͸
   81$-*
   ΁ͷߩݙ͕͖͔͚ͬ
   w 81$-*
   Ͱ͸ɺ๲େͳόϦΤʔγϣϯͷίϚϯυ ͷ૊Έ߹ΘͤΛ
   #FIBU
   Ͱ࣮ࡍʹ࣮ߦ͠ɺͦͷग़ྗ ΛνΣοΫ͢Δ͜ͱͰςετ͍ͯ͠·͢ɻ
9. Scenario: wp say <string> 
 When I run `wp say hello` Then STDOUT should be: ``` Success: hello ``` 81$-*ίϚϯυͷςετίʔυͷྫ
10. 8PSE1SFTT
    Λ #FIBU
    Ͱςετ͢Δ
11. ͜ͷςετͷΰʔϧ w $44΍+BWB4DSJQUͳͲ΋ؚΊͨ8PSE1SFTTαΠ τશମʹର͢Δཁٻ࢓༷ʹج͍ͮͨςετΛߦ͏ɻ
12. ඞཁͳ΋ͷ
    $PNQPTFS
    ໨త
    CFIBUCFIBU
    #%%ςετ༻ϑϨʔϜϫʔΫ
    CFIBUNJOLFYUFOTJPO
    ϒϥ΢βͱ#FIBUΛڮ౉͠
    CFIBUNJOLTFMFOJVNESJWFS
    .JOLͱϒϥ΢βΛ઀ଓ͢ΔυϥΠό
13. 8PSE1SFTT༻ͷΤΫεςϯγϣϯΛ։ൃத IUUQTHJUIVCDPNWDDXUFBNXPSEQSFTTFYUFOTJPO
14. σϞͷιʔε https://github.com/miya0001/phpcon2016-demo
15. CFIBUZNM
    ͸ઃఆϑΝΠϧ
16. features/ !"" 01-login.feature !"" 02-responsive.feature !"" 03-session.feature !"" 04-mouseover.feature !"" 05-screenshot.feature !"" 06-form.feature GFBUVSFͱ͍͏ϑΝΠϧ͸ςετɻ
17. ςετͷجຊతͳจ๏ Feature: Button Tests Scenario: I should see "Hello" Given I am on "/" When I press "#button" Then I should see "Hello" Scenario: ... ...
18. Scenario: Showing the Homepage When I am on "/" Then I should see "Welcome" ΋͠
    8IFO
    ͳΒ
    5IFO
    Ͱ͋Δ΂͖
19. Scenario: Click a button Given I am on "/" When I push ".button" Then I should see "Welcome" (JWFO͸લఏͱͳΔ৚݅
20. bin/behat -di --lang=en ҎԼͷίϚϯυͰఆٛࡁΈͷ
 $POUFYUͷϦετΛݟΔ͜ͱ͕Ͱ͖·͢ɻ ࣮͸೔ຊޠͰ΋ॻ͚·͕͢ࠓ೔͸লུ͠·͢ɻɻɻ
21. Scenario: Showing the Homepage When I am on "/" And I push ".button" Then I should see "Welcome" And I should see "Hello World" "OE
    Ͱෳ਺ࢦఆ͕ՄೳͰ͢ɻ
22. ͞Βʹ۩ମతʹ Ҏ߱ͷྫͰ͸8PSE1SFTT
    &YUFOTJPOͷ
    ػೳ΋ؚ·Ε·͢ɻ
23. @javascript Scenario: Login as Administrator When I login as the "administrator" role And I am on "/" Then I should see "Howdy, admin" When I logout And I am on "/" Then I should not see "Howdy, admin" ϩάΠϯϢʔβʔʹରͯ͠؅ཧόʔ͕දࣔ͞Ε͍ͯΔ͔ʁ
    ϩάΞ΢τͨ࣌͠ʹඇදࣔʹͳ͍ͬͯΔ͔ʁ
24. @javascript Scenario: PC and Mobile Given I login as the "administrator" role And I am on "/wp-admin/" When the screen size is 1440x900 Then I should see "Dashboard" \
 in the "#adminmenu" element When the screen size is 320x400 Then I should not see "Dashboard" \
 in the "#adminmenu" element ϞόΠϧͰ؅ཧը໘ͷϝχϡʔ͕ඇදࣔʹͳ͍ͬͯΔ͔ʁ
25. @javascript Scenario: PC and Mobile Given I login as the "administrator" role And I am on "/wp-admin/" When I am on "/" Then I should see "Welcome" When I am on "/wp-admin/plugins.php" Then I should see "Contact Form 7" ηογϣϯΛ࣋ͬͯา͘͜ͱ΋Ͱ͖·͢ɻ
26. @javascript Scenario: I hover over the specific element Given the screen size is 1440x900 And I login as the "administrator" role And I am on "/" When I hover over the \ "#wp-admin-bar-my-account" element And I wait for 3 seconds Then I should see "Edit My Profile" +BWB4DSJQUͷNPVTFPWFSͷςετ
27. @javascript Scenario: I hover over the specific element Given the screen size is 1440x900 And I login as the "administrator" role And I am on "/" When I hover over the \ "#wp-admin-bar-my-account" element And I wait for 3 seconds Then I should see "Edit My Profile" And take a screenshot and save it to \ "~/Desktop/screenshot-1.png" εΫϦʔϯγϣοτ΋ࡱΕ·͢ɻ
28. @javascript Scenario: Send message from contact form Given I am on "/contact" When I fill in the following: | your-name | miya | | your-email | miya@example.com | | your-subject | Hello | | your-message | ͜Μʹͪ͸ʂ | And I press "Send" And I wait for 3 seconds Then I should see "Thank you" ϑΥʔϜͷςετ΋؆୯
29. https://github.com/vccw-team/wordpress- extension/tree/master/features ͦͷଞͷྫ͸ҎԼͷ63-Ͱʂ
30. Ϣʔεέʔε
31. w ೲ඼௚લͷςετ
    w 8PSE1SFTTຊମ΍ϓϥάΠϯͷΞοϓσʔτʹ൐ ͏֬ೝ࡞ۀͷࣗಈԽ
    w ಛఆͷΠϯϑϥͰͷಈ࡞֬ೝ
    w ςʔϚϨϏϡʔ
32. ࢀߟ
33. • https://blog.hanhans.net/2015/06/26/ behat-extension-create/ • https://pantheon.io/docs/guides/ wordpress-automated-testing/ • https://github.com/jhedstrom/ drupalextension
34. 5IBOLT