JavaScript QA Tools

JAVASCRIPT-QA-TOOLS

Tuesday, October 16, 12

WER BIN ICH?

• Sebastian Springer

• 29

•Dipl. Inf. (FH)

• Teamleiter @ Mayflower


WAS ERZÄHLE ICH HEUTE?

•Was bringt mir eine hohe Qualität überhaupt?

•Welche Tools kann ich nutzen?

•Wie kann ich die QA automatisieren?


LET’S GO


WARUM QUALITÄTSSICHERUNG?


JAVASCRIPT === QUICK & DIRTY



• Leichtgewichtig

• Schnelle Ergebnisse

•Direkt in HTML eingebettet

• (Fast) überall verfügbar



langfristig


UND WAS IST JETZT QUALITÄT?


WAS IST QUALITÄT?

• Reliability

• Efficiency

• Security

•Maintainability

• Size


8Qualitätssicherung als

kontinuierlicher Prozess


Continuous Inspection


Continuous Integration


QA IM KLEINEN - DIE IDE


IDE - EINSTELLUNGEN


QA IM GROßEN - JENKINS


JENKINS - KONFIGURATION

• Build Targets mit Apache Ant

• Build.xml

• Build Steps

• Visualisierung über Plugins


JENKINS KONFIGURATION


JENKINS - KONFIGURATION

• Projektkonfiguration/var/lib/jenkins/jobs/<Projekt>/config.xml

•Ant-Konfiguration/var/lib/jenkins/jobs/<Projekt>/workspace/build.xml


UND WOZU DAS GANZE?


Schnelle Rückmeldung


BEISPIEL: DATE CALC


BEISPIEL: DATE CALCDatum eingeben


BEISPIEL: DATE CALCOfffset eingeben


BEISPIEL: DATE CALC

Datum berechnen lassen


BEISPIEL: DATE CALC

Feiertage beachten!


CODE-ANFORDERUNGEN

• JSLinted

• Kein Copy/Paste Code

• Unittests

• Akzeptanztests


WIE?


Toolunterstützung &Automatisierung


CODE-ANFORDERUNGEN

• JSLinted


• Unittests

• Akzeptanztests


JSLINT


JSLINT?ANYONE?


IT WILL HURT YOUR FEELINGS


WAS TUT JSLINT?• Codingstyle - Whitespaces

• == und != vs. === und !==

• Variablendeklaration zu Beginn einer Funktion

• “use strict”

• Keine Globale Variablen

•Definition vor Verwendung

• eval is EVIL


JSLINT IN DER IDE


JSLINT IN JENKINS

<target name="jslint"> <apply executable="java" output="${basedir}/build/ jslint/jslint.xml"> <arg value="-jar" /> <arg value="/opt/jslint4java/jslint4java.jar" /> <arg value="--report" /> <arg value="xml" /> <fileset dir="${basedir}/source"> <patternset> <include name="**/*.js" /> </patternset> </fileset> </apply></target>


JSLINT IN JENKINS

• Plugin: Violations Plugin

• Post-build action: Report Violations


CODE-ANFORDERUNGEN

• JSLinted


• Unittests

• Akzeptanztests


COPY AND PASTE DETECTION


WAS MACHT CPD?

•Duplikate im Quellcode finden

• Tokens statt Strings


WARUM CPD?

• Verbesserungen an mehreren Stellen

• Bugfixes an mehreren Stellen


WARUM CPD?

• Verbesserungen an mehreren Stellen

• Bugfixes an mehreren Stellen

= erhöhter Wartungsaufwand


CPD IN DER IDE


CPD IN JENKINS<target name="jscpd"> <exec executable="/opt/PMD/pmd-bin-5.0.0/bin/run.sh"> <arg value="cpd" /> <arg value="--minimum-tokens" /> <arg value="5" /> <arg value="--files" /> <arg value="source" /> <arg value="--language" /> <arg value="ecmascript" /> <arg value="--format" /> <arg value="xmls" /> <arg value="build/jscpd/jscpd.xml" /> </exec></target>


CPD IN JENKINS

• Plugin: Duplicate Code Scanner Plug-in

• Post-build action: Publish duplicate code analysis results


CPD IN JENKINS

• Plugin: Violations Plugin

• Post-build action: Report Violations


CODE-ANFORDERUNGEN

• JSLinted


• Unittests

• Akzeptanztests


UNITTESTS


WARUM UNITTESTS?

• Stabilität

• Sicherheit für Developer

•Dokumentation

• Pro Bug ein Test


JASMINE

describe("DateCalc", function () { it("should return...", function () { var dateCalc = new DateCalc(), result = dateCalc.resolveDate(); expect(result).toBeFalsy(); });});


JSTESTDRIVER

• Testing Framework

• Browser Capturing

• Coverage

• Plugins für andere Frameworks (qUnit, Jasmine, etc.)


JASMINE IN JENKINS

java -jar JsTestDriver.jar --port 9876


JASMINE IN JENKINS<target name="jasmine"><exec executable="java">

<arg value="-jar" /> <arg value="/opt/jstestdriver/JsTestDriver-1.3.5.jar" /> <arg value="--config" /> <arg value="${basedir}/source/DateCalcJenkins.jstd" /> <arg value="--tests" /> <arg value="all" /> <arg value="--testOutput" /> <arg value="${basedir}/build/jstestdriver" /></exec>

</target>


JASMINE IN JENKINS

• Plugin: xUnit Plugin

• Post-build action: Publish xUnit test result report


COVERAGE

• Voraussetzung #1: JsTestDriver Coverage Plugin

• Voraussetzung #2: Lcov to Cobertura Converter


COVERAGE

<target name="coverage"> <exec executable="/opt/jstestdriver/lcov_cobertura.py"> <arg value="${basedir}/build/jstestdriver/

jsTestDriver.conf-coverage.dat" /> <arg value="-o" /> <arg value="${basedir}/build/jstestdriver/coverage.xml" /> </exec></target>


COVERAGE

• Plugin: Cobertura Plugin

• Post-build action: Publish Cobertura Coverage Report


CONFIG.JSTDserver: 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"


http://localhost:9876

http://localhost:9876

JASMINE IN DER IDE


CODE-ANFORDERUNGEN

• JSLinted


• Unittests

• Akzeptanztests


AKZEPTANZTESTS


WARUM AKZEPTANZTESTS?

• Tests gegen Akzeptanzkriterien

• Anforderungen vs. Umsetzung

•Nicht von Entwicklern


SELENIUM IDE


SELENIUM IN JENKINS<target name=”selenium”> <exec executable=”java” output=”${basedir}/build/selenium/results.html> <arg value=”-jar” /> <arg value=”/opt/selenium/selenium-server.jar” /> <arg value=”-htmlSuite” /> <arg value=”*firefox” /> <arg value=”http://datecalc.basti.dev” /> <arg value=”/srv/www/vhosts/datecalc/tests/suite.html” /> </exec></target>


SELENIUM IN JENKINS

• Plugin: Selenium HTML report Plugin

• Post-build action: Publish Selenium HTML Report


CHUCK NORRIS PLUGIN


FRAGEN?


KONTAKT

Sebastian [email protected]

Mayflower GmbHMannhardtstr. 680538 MünchenDeutschland

@basti_springer

https://github.com/sspringer82


mailto:[email protected]

mailto:[email protected]



JavaScript QA Tools

Technology

Transcript of JavaScript QA Tools