Post on 27-May-2015
transcript
© Mayflower GmbH 2012
Qualitätssicherung in Webprojekten
Sebastian Springer I 06.06.2012
@basti_springer
MY NAME IS
HELLO
Womit verdiene ich mein Geld?
● Mayflower GmbH
● PHP
● Javascript
● Teamleiter
Projekte?
Was erzähle ich heute?
● Qualitätssicherung in Webprojekten
● Schwerpunkt: Javascript
...und was nicht?
● Qualitätssicherung in PHP
● PHPCS, PHPUnit, phpcpd, pdepend,...
● http://jenkins-php.org/
Warum Qualitätssicherung?
Javascript === Quick & Dirty
Javascript === Quick & Dirty
Was ist Qualitätssicherung
● Standards
● Verlässlichkeit
● Erweiterbarkeit
● Stabilität?
CI
∞
Continuous Inspection
Continuous Integration
Plattformen
CI im Großen - Jenkins
CI im Kleinen – die IDE
Und wozu das Ganze?
Schnelle Rückmeldung!
Das Beispiel
Ziel
Ziel
Datum eingeben
Ziel
Offset eingeben
Ziel
Datum berechnen
Ziel
Feiertage beachten!
Anforderungen an den Code
● JSLinted
● Kein Copy/Paste Code
● Unittests
● Akzeptanztests
Wie?
Mit Toolunterstützung und Automatisierung!
Anforderungen an den Code
● JSLinted
● Kein Copy/Paste Code
● Unittests
● Akzeptanztests
It will hurt your feelings!
Was macht JSLint?
● Codingstyle – Whitespaces● == & != vs. === & !==● Variablendeklarationen zu Beginn einer
Funktion● “use strict”● Globale Variablen● Verwendung vor der Definition● eval is Evil
JSLint in Jenkins
● jslint4java
java -jar jslint4java.jar --report xml /path/to/src/*.js > jslint.xml
● Violations Plugin
JSLint in PhpStorm
Anforderungen an den CodeAnforderungen an den Code
● JSLinted
● Kein Copy/Paste Code
● Unittests
● Akzeptanztests
Was macht CPD?
● Duplikate im Quellcode finden
● Tokens statt Strings
Warum?
● Verbesserungen an mehreren Stellen
● Bugfixes an mehreren Stellen
= erhöhter Wartungsaufwand
CPD in Jenkins
● PMD CPD
/opt/PMD/bin/run.sh cpd --minimum-tokens 12 --files /path/to/src --language ecmascript --format xml > cpd.xml
● Duplicate Code Scanner Plug-in
Anforderungen an den Code
● JSLinted
● Kein Copy/Paste Code
● Unittests
● Akzeptanztests
Warum Unittests?
● Stabilität
● Sicherheit
● Dokumentation
● Pro Bug ein Test
Jasmine
describe("DateCalc", function () {
it("should return false ...provided", function () {
var dateCalc = new DateCalc(),
result = dateCalc.resolveDate();
expect(result).toBeFalsy();
});
});
TDD
JsTestDriver
● Testing Framework
● Browser Capturing
● Coverage
● Plugins für Qunit und Jasmine
Jasmine in Jenkins
● JsTestDriver
java -jar JsTestDriver.jar --port 9876 --browser /usr/bin/firefox
java -jar JsTestDriver.jar --config /path/to/config.jstd --tests all --testOutput . --reset
● xUnit Plugin
config.jstd
server: http://localhost:9876
load:
- lib/jasmine-1.2.0.rc3/jasmine.js
- lib/jasmine-jstd-adapter/src/JasmineAdapter.js
- spec/DateCalc.js
- spec/Holiday.js
- src/DateCalc.js
- src/Holiday.js
plugin:
- name: "coverage"
jar: "/opt/JsTestDriver/plugins/coverage.jar"
module: "com.google.jstestdriver.coverage.CoverageModule"
Coverage in Jenkins
● JsTestDriver Coverage Plugin
● Converter
/opt/lcov-to-cobertura-xml.py jsTestDriver.conf-coverage.dat -o coverage/coverage.xml
● Cobertura Plugin
Jasmine in PHPStorm
Jasmine in PHPStorm
Jasmine in PHPStorm
Anforderungen an den Code
● JSLinted
● Kein Copy/Paste Code
● Unittests
● Akzeptanztests
Warum Akzeptanztests?
● Tests gegen Akzeptanzkriterien
● Anforderungen vs. Umsetzung
● Nicht von Entwicklern
Selenium IDE
Selenium in Jenkins
● Selenium Server
export DISPLAY=:5.0
java -jar /opt/selenium-server.jar -htmlSuite *firefox "http://dateCalc.basti.dev" "/srv/www/vhosts/tests/suite.html" "selenium/results.html"
● Selenium HTML report Plugin
Chuck Norris Plugin
Fragen?
http://joind.in/talk/view/6658
June 11, 2012 Mayflower GmbH 58
Vielen Dank für Ihre Aufmerksamkeit!
Sebastian Springer
sebastian.springer@mayflower.de
Mayflower GmbH
Mannhardtstr. 6
80538 München
Deutschland
Twitter: @basti_springer
https://github.com/sspringer82