Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Tests carto avec Mocha
Search
Makina Corpus
November 23, 2013
Technology
0
790
Tests carto avec Mocha
Quelques notes sur le test d'applications cartographiques avec Leaflet et Mocha
Makina Corpus
November 23, 2013
Tweet
Share
More Decks by Makina Corpus
See All by Makina Corpus
Publier vos données sur le Web - Forum TIC de l'ATEN 2014
makinacorpus
0
690
Créez votre propre fond de plan à partir de données OSM en utilisant TileMill
makinacorpus
0
110
Team up Django and Web mapping - DjangoCon Europe 2014
makinacorpus
3
810
Petit déjeuner "Les bases de la cartographie sur le Web"
makinacorpus
0
410
Petit déjeuner "Développer sur le cloud, ou comment tout construire à partir de rien" le 11 février - Toulouse
makinacorpus
0
260
CoDe, le programme de développement d'applications mobiles de Makina Corpus
makinacorpus
0
91
Petit déjeuner "Alternatives libres à GoogleMaps" du 11 février 2014 - Nantes - Sylvain Beorchia
makinacorpus
0
640
Petit déjeuner "Les nouveautés de la cartographie en ligne" du 12 décembre
makinacorpus
1
370
Alternatives libres à Google Maps
makinacorpus
2
3k
Other Decks in Technology
See All in Technology
あなたの知らないiOS開発の世界
recruitengineers
PRO
3
170
プログラム検証入門
riru
6
860
DroidKaigi 2024 たすけて!ViewModel
mhidaka
5
880
Privacy Sandbox on Android / DroidKaigi 2024
7pairs
1
240
OSTという文化を組織に根付かせてみた
sansantech
PRO
2
290
グイグイ系QAマネージャーの仕事
sadonosake
0
290
ロボットアームを遠隔制御の話 & LLMをつかったIoTの話もしたい
soracom
PRO
1
380
リアルお遍路+SORACOM IoT
ozk009
1
130
不動産tech Product Night#2_AIことはじめ_GA橋本
takehikohashimoto
0
180
とあるOSSを継続可能にするための取り組みについて / OSS Refactoring Process
bun913
1
190
四国のあのイベントの〇〇システムを45日間で構築した話 / cloudohenro2024_tachibana
biatunky
0
330
eBPFのこれまでとこれから
yutarohayakawa
9
3.1k
Featured
See All Featured
Facilitating Awesome Meetings
lara
49
5.9k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
246
1.3M
WebSockets: Embracing the real-time Web
robhawkes
59
7.3k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
227
52k
Agile that works and the tools we love
rasmusluckow
327
20k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
363
22k
Unsuck your backbone
ammeep
667
57k
The Invisible Side of Design
smashingmag
295
50k
The Pragmatic Product Professional
lauravandoore
31
6.2k
How STYLIGHT went responsive
nonsquared
93
5.1k
Adopting Sorbet at Scale
ufuk
73
8.9k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
230
17k
Transcript
Tests carto avec Mocha (notes) Mathieu Leplatre @leplatrem www.makina-corpus.com
Mécanique cartographique... • →JS + DOM • <img> (Fonds de
carte) • Lat/Long pixels → (SVG, CSS) • Événements (interactions)
Mocha + PhantomJS • Browser + Command-line (headless) • Intégration
Continue (exit codes) • TDD (watch / inotify) • jsdom... $ mocha-phantomjs test/index.html <script> (window.mochaPhantomJS || window.mocha).run(); </script>
À peu près pas loin ? • 10e-9 degré ~
1mm • assert.closeTo() (Chai) ✖ 1 of 46 tests failed: 1) Locate click on line: 4: expected 0.5 to equal 0.5000000000000001 at file:///home/user/app/node_modules/chai/chai.js:401 render events
Déclencher des vrais événements • Clic | Clavier | Scroll
| Touch • createEvent API (jQuery) • happen (http://macwright.org/happen/) it('zooms-in with double click', function(done) { map.on('zoomend', function () { assert.equal(map.getZoom(), 1); done(); }); happen.dblclick(map._container); })
Contrôle du temps, Doc ! • Sinon.JS (spy + stub
+ mock + sandbox) var clock = sinon.useFakeTimers(), callback = sinon.spy(); map.on('debounced', callback); map.fire('mousemove', {latlng: [0, 0]}); clock.tick(500); map.fire('mousemove', {latlng: [0, 0]}); map.fire('mousemove', {latlng: [0, 0]}); assert.equal(2, callback.callCount);
Conclusion • Unitaires ! • « Tout est difficile avant
d'être simple. » – Thomas Fuller
Merci FranceJS & Makina Corpus ! Outils • http://leafletjs.com •
http://visionmedia.github.io/mocha/ • https://github.com/metaskills/mocha-phantomjs • http://macwright.org/happen/ • http://chaijs.com/ • http://sinonjs.org/ • https://github.com/tmpvar/jsdom Lectures • http://blog.mathieu-leplatre.info/test-your-leaflet-applications-with-mocha.html • https://nicolas.perriault.net/code/2013/testing-frontend-javascript-code-using-mocha-chai-and-sinon/