Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Unit Testing for Frontend Code at Blibli.com

Irfan Maulana
January 26, 2018
Programming
1
240

Unit Testing for Frontend Code at Blibli.com

Speak about Unit Test implementation for frontend code in Blibli.com especially in Vue.js framework

Irfan Maulana

January 26, 2018
Tweet

More Decks by Irfan Maulana

See All by Irfan Maulana
Panduan untuk mempublikasikan kode ke publik
mazipan
0
92
Mengukur dan meningkatkan performa website
mazipan
1
200
Testing JavaScript
mazipan
0
130
Membuat Website Zaman Sekarang
mazipan
0
480
Kinerja Web 101 - Edisi 2022
mazipan
1
430
Layout Repaint & The Lessons Learned
mazipan
0
390
Bagaimana implementasi mockup design
mazipan
0
460
Memulai karir sebagai web programmer
mazipan
0
720
Membuat laporan kecepatan web untuk blog
mazipan
0
510

Other Decks in Programming

See All in Programming
DataStoreをテストする
mkeeda
0
300
プロフェッショナルとしての成長「問題の深掘り」が導く真のスキルアップ / issue-analysis-and-skill-up
minodriven
8
1.6k
音声プラットフォームのアーキテクチャ変遷から学ぶ、クラウドネイティブなバッチ処理 (20250422_CNDS2025_Batch_Architecture)
thousanda
0
250
国漢文混用体からHolloまで
minhee
1
200
これだけは知っておきたいクラス設計の基礎知識 version 2
masuda220
PRO
24
6.5k
小田原でみんなで一句詠みたいな #phpcon_odawara
stefafafan
0
350
REALITY コマンド作成チュートリアル
nishiuriraku
0
100
State of Namespace
tagomoris
4
1.8k
リアルタイムレイトレーシング + ニューラルレンダリング簡単紹介 / Real-Time Ray Tracing & Neural Rendering: A Quick Introduction (2025)
shocker_0x15
1
310
Golangci-lint v2爆誕: 君たちはどうすべきか
logica0419
1
140
The Evolution of the CRuby Build System
kateinoigakukun
0
720
generative-ai-use-cases(GenU)の推しポイント ～2025年4月版～
hideg
1
230

Featured

See All Featured
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
52
2.4k
Imperfection Machines: The Place of Print at Facebook
scottboms
267
13k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
32
2.2k
Bash Introduction
62gerente
611
210k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
233
17k
Optimising Largest Contentful Paint
csswizardry
36
3.2k
Building Applications with DynamoDB
mza
94
6.3k
What's in a price? How to price your products and services
michaelherold
245
12k
Large-scale JavaScript Application Architecture
addyosmani
512
110k
Embracing the Ebb and Flow
colly
85
4.6k
How to train your dragon (web standard)
notwaldorf
90
6k
VelocityConf: Rendering Performance Case Studies
addyosmani
328
24k

Transcript

  1. UNIT TESTING FOR FRONTEND CODE at Blibli.com Irfan Maulana |

    Front End Developer

  2. About Me

  3. Fans ?

  4. Blibli.com Frontend Code ⚔ We believe in Green framework (*not

    Blue)
  5. None

  6. '

  7. Blackbox vs Whitebox Testing

  8. Blibli.com Frontend Unit Test Tools • karma runner • karma-mocha

    • karma-sinon-chai • karma-babel-preprocessor • Karma-coverage • karma-sourcemap-loader • karma-spec-reporter • karma-webpack • karma-phantomjs-launcher

  9. Automate on Git Commit • Developer commit code • Automate

    run build and test • Run Code Analysis • Quality Passed ? ✅ : ⛔

  10. Quality Gate

  11. Karma vs Jest • https://stackshare.io/stackups/jest-vs-karma-runner update in January 26 2018

  12. Let’s take a look the codes…

  13. Vue Component

  14. Unit Testing Vue Component

  15. How (*Blue) Doing Unit Test ?

  16. Vue Unit Test with Avoriaz

  17. Jest-in-Vue

  18. Space for Improvement (for Blibli.com) • Move from Karma to

    Jest – Simplify tooling • Add Avoriaz / vue-test-utils – UI centric testing • End 2 End Test for Developer – Better quality delivery • Etc…

  19. Do you like my talks ? https://github.com/mazipan https://github.com/mazipan/talks https://github.com/mazipan/project-catalog

  20. THANK YOU