PHP Conference 2019 Lightning Talk@2019/12/01 の発表資料です。 BackstopJSでのビジュアルリグレッションテストを行った話です。
ϨΨγʔίʔυͰϏδϡΞϧϦάϨογϣϯςετΛͬͯΈͨʂ1)1$POGFSFODF-JHIUOJOH5BML!Ѩ࿈ஐܙ
View Slide
ࣗݾհ͋ΕΜΤΩαΠτגࣜձࣾ৽ଔ1)1FS!ZVDP@NN
ྐྵʜฐࣾͷͱ͋ΔͭͷαʔϏεجຊػೳ͕΄ͱΜͲಉͩͬͨ͡ͷͰɺಉ͡ίʔυͰ։ൃ͞Ε͍ͯͨ˝
αʔϏεಠࣗʹਐԽ࢝͠ΊɺಠࣗػೳͷͨΊͷग़͚͠ίʔυ͕૿͍͖͑ͯɺߴʹෳࡶʹͳͬͨɻὊ͜ͷ··͕ΜΔ⾣αʔϏεɺͭͷϓϩδΣΫτʹ͢Δ
ϓϩδΣΫτΛίϐʔ͠ɺ̎ͭ༻ҙ͢Δ͜ͱͰ͚Δ͜ͱʹޭɻ࣍ʹɺෆཁʹͳͬͨยํͷ੩తϑΝΠϧॲཧΛআ͢Δඞཁ͕͋Δɻ˝
੩తϑΝΠϧͷআྃɻ݅ۙ͘ͷϖʔδΛݕূ͢Δํ๏ʁ⾣खಈͰݕূὊʜʜ
੩తϑΝΠϧͷআྃɻ݅ۙ͘ͷϖʔδΛݕূ͢Δํ๏ʁὊखಈͰݕূ⾣ϏδϡΞϧϦάϨογϣϯςετͰݕূ
ϏδϡΞϧϦάϨογϣϯςετͱεΫϦʔϯγϣοτΛࡱӨ͠ɺલޙͰ͕ࠩग़͍ͯͳ͍͔ݕূ͢Δςετ$44ίʔυมߋʹΑΔද่ࣔΕ͕ͳ͍͔ݕূ͢Δͷʹ༏Ε͍ͯΔݕূͰ͖Δ͜ͱɾϘλϯը૾ͷදࣔՄ൱ɾϖʔδͷදࣔՄ൱ݕূͰ͖ͳ͍͜ͱɾϖʔδભҠ
͏ͷ#BDLTUPQ+4ɹϏδϡΞϧϦάϨογϣϯςετΛߦ͑ΔϑϨʔϜϫʔΫ ςετͷઃఆ CBDLTUPQKTPOɹ εΫϦʔϯγϣοτੜ มߋલͷεΫϦʔϯγϣοτʢ3FGFSFODFʣΛอଘ มߋޙͷεΫϦʔϯγϣοτʢ5FTUʣΛอଘ ྆ऀΛൺֱͨ͠ϨϙʔτੜςετͷྲྀΕࢲୡ͕Δ͜ͱʂNode.js + Puppeteer or ChromyJS
ςετ४උɹඞਢ̍ൺֱͰ͖Δڥͷ༻ҙྫɿຊ൪ڥͱεςʔδڥςετͷઃఆʲඞਢ߲ʳJEɿϨϙʔτλΠτϧWJFXQPSUTɿࡱӨը໘αΠζTDFOBSJPTɿςετ༰ɹMBCFMɿςετλΠτϧɹVSMɿมߋޙ63-ɹSFGFSFODF6SMɿมߋલ63-มߋޙڥมߋલڥ
ৄࡉઃఆ1VQQFUFFSPS$ISPNZ+44DSJQUΛ͏͜ͱͰҎԼͷରԠ͕Մೳw ϕʔγοΫೝূରԠw ϩάΠϯඇϩάΠϯը໘ରԠw ࡱӨલͷ6*มߋରԠ ϚεΦʔόʔը૾ࠩ͠ସ͑ςετ४උɹΦϓγϣϯTDFOBSJPTɿςετ༰ɹPO#FGPSF4DSJQUɿϒϥβͷઃఆɹPO3FBEZ4DSJQUɿεΫϦʔϯγϣοτલͷ6*ঢ়ଶมߋ
४උྃʂ⾣ςετ࣮ߦὊʹ͛Δ
݁ՌϛογϣϯίϯϓϦʔτʂʂʂʂʂ˝
·ͱΊϏδϡΞϧϦάϨογϣϯςετͷྑ͍ͱ͜Ζw ද่ࣔΕΛݕग़Ͱ͖Δw ςετͷ༻ҙ͕༰қ͜Μͳਓʹಛʹ͓͢͢Ίʂςετͷͳ͍ڥͰද่ࣔΕ͕ා͘ϦϑΝΫλϦϯά͕Ͱ͖ͯͳ͍ํɹΊͤ͟ʂϨΨγʔίʔυ͔Βͷ٫ʂ
͓·͚հهࣄɿʮ#BDLTUPQ+4ͰϏδϡΞϧϦάϨογϣϯςετʂʯIUUQTRJJUBDPNBIBSFODIJJUFNTDGEFDa͋Γ͕ͱ͏