Slide 1

Slide 1 text

Vue.jsの単体テストライブラリ 「vue-function-tester」 を作ってみた話 2019年11⽉

Slide 2

Slide 2 text

2 • 村上大和 • @pipopotamasu • 野球, 筋トレ

Slide 3

Slide 3 text

3 vue-function-testerとは?

Slide 4

Slide 4 text

4 vue-function-testerとは? https://github.com/pipopotamasu/vue-function-tester

Slide 5

Slide 5 text

5 vue-function-testerとは? • Vue.jsの「メソッドの単体テストライブラリ」 • もっというと、methods, lifecycle hooks, computed, watchをテストするライブラリ

Slide 6

Slide 6 text

Get Started!!

Slide 7

Slide 7 text

7

Slide 8

Slide 8 text

8

Slide 9

Slide 9 text

9

Slide 10

Slide 10 text

10

Slide 11

Slide 11 text

11

Slide 12

Slide 12 text

12

Slide 13

Slide 13 text

13

Slide 14

Slide 14 text

14

Slide 15

Slide 15 text

15

Slide 16

Slide 16 text

16

Slide 17

Slide 17 text

17

Slide 18

Slide 18 text

18

Slide 19

Slide 19 text

19

Slide 20

Slide 20 text

20

Slide 21

Slide 21 text

21 なぜ作ったか?

Slide 22

Slide 22 text

22 なんとなく 「こんな感じにテストを書きたい」 をライブラリに落とし込んだ

Slide 23

Slide 23 text

23 こんな感じに書きたかった

Slide 24

Slide 24 text

24 1) メソッドチェーンで書きたい

Slide 25

Slide 25 text

25 1) メソッドチェーンで書きたい

Slide 26

Slide 26 text

26 2) とにかく短く書きたい

Slide 27

Slide 27 text

27 2) とにかく短く書きたい

Slide 28

Slide 28 text

28 2) とにかく短く書きたい

Slide 29

Slide 29 text

29 3) $emitのモック省略したい

Slide 30

Slide 30 text

30 3) $emitのモック省略したい

Slide 31

Slide 31 text

31 vue-function-testerとは? https://github.com/pipopotamasu/vue-function-tester