頑張りすぎないVue.js単体テストのススメ / Vue.js unit testing that does not work too hard

Slide 1

Slide 1 text

,PTVLF:BNBTIJUB 4503&4KQ JODIFZ JOD 4503&4KQ.FFUVQGPS'SPOUFOE&OHJOFFST ؤுΓ͗͢ͳ͍7VFKT୯ମςετͷεεϝ

Slide 2

Slide 2 text

ࣗݾ঺հ ɾࢁԼޭհ ɾ4503&4KQ6*վળνʔϜ ɾ೥݄ೖࣾ ɾલ৬͸ϕτφϜͷελʔτΞοϓ ɹͰ3FBDUϝΠϯ !LTLZNTU

Slide 3

Slide 3 text

୯ମςετॻ͍ͯ·͔͢ʁ

Slide 4

Slide 4 text

ετΞσβΠϯ ϦϒϥϯσΟϯά ՝ۚϖʔδ ૿੫ରԠ ׂൢ๏ରԠ 6*$PNQPOFOU ΞΠςϜ࡞੒ฤू ೥݄ ೥ ݱࡏ 5FTUJOH4UBSU Ҡߦ։࢝ ˞1+͸Ұ෦ൈਮ

Slide 5

Slide 5 text

֤ݸਓؤுͬͯਐΊ͍͕ͯͨɻɻ ςετํ਑ΛܾΊͯޮՌతͳςετΛ ؤுΓ͗ͣ͢ॻ͖͍ͨ ςετཻ౓ͷෆἧ͍׌ͭɺޮՌతͰͳ͍ςετ ɾϦιʔεͷফ໣ ɾϝϯςφϯείετ ɾεϓϦϯτ௨Γʹਐ·ͳ͍JTTVF ɾਫ਼ਆతͳਏΈ ! "

Slide 6

Slide 6 text

ͦ͜Ͱࠓ೔͸4503&4͕ςετͱ ޲͖߹ͬͨ݁Ռʹ͍͓ͭͯ࿩͠·͢

Slide 7

Slide 7 text

˞ิ଍

Slide 8

Slide 8 text

4503&4KQͰ͸ओʹͭͷϦϙδτϦͰ /VYUº+FTUΛத৺ʹςετ؀ڥΛߏங .BJO 6*$PNQPOFOU-JCSBSZ

Slide 9

Slide 9 text

/VYU WVFUFTUVUJMT º+FTUͰͷ͓࿩͕ϝΠϯ .BJO 6*$PNQPOFOU-JCSBSZ

Slide 10

Slide 10 text

"HFOEB ໨తΛܾΊΔʢXIZʣ ςετର৅ΛܾΊΔʢXIBUʣ Ͳ͏ςετ͢Δͷ͔ IPX ͜Ε͔Β

Slide 11

Slide 11 text

"HFOEB ໨తΛܾΊΔʢXIZʣ ςετର৅ΛܾΊΔʢXIBUʣ Ͳ͏ςετ͢Δͷ͔ IPX ͜Ε͔Β

Slide 12

Slide 12 text

ςετΛॻ͘໨త ɾਫ਼ਆత҆ఆ ɾखಈςετͷίετͷ࡟ݮ ɾϦϑΝΫλϦϯά࣌ͷΤϯόάΛݮΒ͢ ɾίϯϙʔωϯτͷ࢓༷ॻత໾ׂ

Slide 13

Slide 13 text

"HFOEB ໨తΛܾΊΔʢXIZʣ ςετର৅ΛܾΊΔʢXIBUʣ Ͳ͏ςετ͢Δͷ͔ IPX ͜Ε͔Β

Slide 14

Slide 14 text

ςετର৅ ɾQBHFT ⚪1$ ⚪41 ɾDPNQPOFOUT ⚪NJYJO ⚪DPOUBJOFS ⚪QSFTFOUBUJPOBM ɾMBZPVUT ɾTUPSF ɾVUJMT ɾDPOTUBOUT ɾQMVHJOT ɾNJEEMFXBSF

Slide 15

Slide 15 text

ςετ಺༰ ɾNPVOU ɾQSPQT ɾDPNQVUFE ɾNFUIPET ⚪FNJU ⚪IUUQ3FRVFTU ɾUFNQMBUF ⚪TMPU ⚪WJGWTIPX ⚪WPO ⚪WCJOEDMBTT ⚪WCJOEBUUS ɾMJGFDZDMF ɾNJYJO ɾBTZOD%BUBGFUDI ɾHFUUFST ɾNVUBUJPOT ɾBDUJPOT

Slide 16

Slide 16 text

ൣғ͸޿͍ !

Slide 17

Slide 17 text

ޮՌతɺޮՌͷബ͍ςετΛఆٛͯ͠ ॻ͘ɺॻ͔ͳ͍Λ໌֬ʹ͢Δ !

Slide 18

Slide 18 text

ޮՌͷബ͍ςετ ɾॳظදࣔঢ়ଶ ɾQSPQTͷఆٛ ɾ୯७ͳϩδοΫ FUD ෳࡶ౓ͷ௿͍ϩδοΫ͸ ॻ͔ͳ͍બ୒Λͨ͠ !

Slide 19

Slide 19 text

ॳظදࣔঢ়ଶ QSPQTͷUFNQMBUFදࣔͷΈ

Slide 20

Slide 20 text

QSPQTͷఆٛ QSPQTఆٛʹରͯ͠ͷςετ

Slide 21

Slide 21 text

୯७ͳϩδοΫFYNVUBUJPOT ୯७ͳTUBUFมߋͷNVUBUJPO ͦͷଞFNJUΛൃՐ͢Δ͚ͩͷNFUIPETͳͲ

Slide 22

Slide 22 text

ޮՌతͳςετ ɾυϝΠϯͰͷίΞͳϩδοΫ ɾ෼ذͷೖΔϩδοΫ ෳࡶ౓ͷߴ͍ϩδοΫ͸ ͔ͬ͠Γͱ཈͑Δ !

Slide 23

Slide 23 text

υϝΠϯͰͷίΞͳ߲໨Λఆٛ͢Δ

Slide 24

Slide 24 text

ྫ͑͹͜͏͍ͬͨ ༗ྉձһొ࿥ϑΥʔϜͷ৔߹ ίΞͳςετ߲໨Λఆٛ

Slide 25

Slide 25 text

༗ྉձһొ࿥ϑΥʔϜ ͷ৔߹ ᶃ ᶄ ᶆ ᶅ ᶄֹ͕ۚਖ਼͘͠දࣔ͞Ε͍ͯΔࣄ ᶃʮ͓ࢧ෷ํ๏ʯʹΑͬͯ ϑΥʔϜ಺༰͕มΘΔࣄ ᶅόϦσʔγϣϯ͕ਖ਼͘͠ಈ࡞ɺ දࣔ͞ΕΔࣄ ᶆϑΥʔϜͷೖྗ಺༰Ͱ"1*͕ ୟ͔ΕΔࣄ

Slide 26

Slide 26 text

෼ذͷೖΔϩδοΫ ಛఆ৚݅ɺΠϕϯτʹΑͬͯڍಈ͕ มΘΓόάʹͳΓ΍͍͢

Slide 27

Slide 27 text

"HFOEB ໨తΛܾΊΔʢXIZʣ ςετର৅ΛܾΊΔʢXIBUʣ Ͳ͏ςετ͢Δͷ͔ IPX ͜Ε͔Β

Slide 28

Slide 28 text

Ͳ͏ςετ͢Δͷ͔ ɾQBHFTͰͷ౷߹ςετ ɾTUPSF͸GBDUPSZؔ਺Ͱڞ௨Խ ʜFUD ಉ஋Ϋϥεςετɺڥք஋ςετͷΑ͏ͳςετٕ๏ ͸΋ͪΖΜͰ͕͢ɺ΋ͬͱ7VFº+FTUଆͷ࿩

Slide 29

Slide 29 text

QBHFTͰͷ౷߹ςετ QBHFT͔ΒNPVOUͰ౷߹ςετ σʔλͷྲྀΕΛ͔ͬ͠Γ௨͍ͬͯΔ͔νΣοΫ ˞ଞίϯϙʔωϯτ͸جຊతʹ͸TIBMMPX.PVOUͰ੹຿Λด͡ࠐΊΔ 1BSFOU $IJME (SBOEDIJME mount

Slide 30

Slide 30 text

ͦͷࡍXBSOJOHͰ΋GBJMʹ͢Δ jestSetup.js XBSOJOH͕ग़΍͘͢ɺग़ͯ΋ςετࣗମ͸௨ͬͯ͠·͏ҝ XBSOJOHͰ΋GBJM͢Δ༷ʹ͓ͯ͘͠ͱΑΓָͰ҆৺ jest.conﬁg.js

Slide 31

Slide 31 text

TUPSF͸GBDUPSZؔ਺Ͱڞ௨Խ ڞ௨Խ͢Δ͜ͱͰେ෯ʹָʹ

Slide 32

Slide 32 text

͜ͷଞʹ΋·ͩ·ͩ͋Δ !EFYJB͕ࣾ಺2JJUBʹ߲໨ͷ σβΠϯύλʔϯɺΞϯνύλʔϯ Λ·ͱΊͯ͘Ε͍ͯΔ ࣮૷࣌ͷ໎͍͕ফ͑ϨϏϡϫʔ ͱ΋ڞ௨ݴޠͰձ࿩Ͱ͖ΔΑ͏ʹ ͳΔ ৄ͍͠಺༰͸·ͨͲ͔͜Ͱ࿩ͤͨΒ !

Slide 33

Slide 33 text

"HFOEB ໨తΛܾΊΔʢXIZʣ ςετର৅ΛܾΊΔʢXIBUʣ Ͳ͏ςετ͢Δͷ͔ IPX ͜Ε͔Β

Slide 34

Slide 34 text

͜Ε͔Β WJGͳͲͷදࣔ෼ذʹؔͯ͠͸&&ಋೖͳͲ ࢼͯ͠Έ͍ͨɺྑͦ͞͏Ͱ͋Ε͹୯ମςετ ͷ಺༰Λ&&دͤΒΕΔͷͰ͸ͳ͍͔ʁ ͳΜͯ࿩Λ͍ͯ͠·͢

Slide 1

Slide 1 text

Slide 2

Slide 2 text

Slide 3

Slide 3 text

Slide 4

Slide 4 text

Slide 5

Slide 5 text

Slide 6

Slide 6 text

Slide 7

Slide 7 text

Slide 8

Slide 8 text

Slide 9

Slide 9 text

Slide 10

Slide 10 text

Slide 11

Slide 11 text

Slide 12

Slide 12 text

Slide 13

Slide 13 text

Slide 14

Slide 14 text

Slide 15

Slide 15 text

Slide 16

Slide 16 text

Slide 17

Slide 17 text

Slide 18

Slide 18 text

Slide 19

Slide 19 text

Slide 20

Slide 20 text

Slide 21

Slide 21 text

Slide 22

Slide 22 text

Slide 23

Slide 23 text

Slide 24

Slide 24 text

Slide 25

Slide 25 text

Slide 26

Slide 26 text

Slide 27

Slide 27 text

Slide 28

Slide 28 text

Slide 29

Slide 29 text

Slide 30

Slide 30 text

Slide 31

Slide 31 text

Slide 32

Slide 32 text

Slide 33

Slide 33 text

Slide 34

Slide 34 text

Slide 35

Slide 35 text

Slide 36

Slide 36 text

Slide 37

Slide 37 text

Slide 38

Slide 38 text