react testing

I have to say that hardest part with react was to figure out testing. (testing components is easy with thousands examples). But how to test props, state vlaues, clicking events, helping functions,… There are many projects in github and almost all of them are without any tests.

I have put together small app, where you can find code with tests.

I have tested:
* components
* props values
* state values
* events on components like clicking,…
* functions

Frankly I haven’t seen any project where they would cover all of the above.

I am not gonna write step by step, just small info I am using Jest & Enzyme testing framework.

For details better check my code. Check for package.json for packages I am using and __tests__ folders for tests.

Here are:
* github link
* travis link
* sonarcloud.io link

enjoy

Advertisements

node/react -> github -> travis -> sonar

When programming I like to keep my code as clean and automated as possible.

I like sonar (does analysis on your code and provide you output how many duplicate, code smells, unused variables,..)

I like node.js / react.js for its quick prototyping and agile and others advantages. So lastly I was looking if I can have setup where I could automate my infrastructure  code -> push to  VCS (github) -> CI (travis) -> code analysis (Sonar).

Here are steps what you need to do:

  • github.com -> on project settings turn on “travis-ci” integration
    • github.com -> project -> settings -> Integration & services -> Add Service -> Travis CI
  • travis-ci.com -> make sure after code push code build is triggered
  •  sonarcloud.io – get started
    • create token here (I used this token in travis – see above)
    • define your organisation here
  • project:

.travis.yml
dist: trusty
sudo: required
addons:
sonarqube:
organization: "czechsource"
branches:
- master
- develop
jdk:
- oraclejdk8
script:
- sonar-scanner
cache:
directories:
- '$HOME/.sonar/cache'

sonar-project.properties
sonar.projectKey=czechsource:reactBlog
sonar.projectName=React.js blog
sonar.projectVersion=1.0
sonar.sources=src
sonar.language=js
sonar.sourceEncoding=UTF-8
sonar.branch=develop,master

Make sure you define sonacloud.io organization and token and use it in travis.

Github repo

travis info

sonarcloud info

Update: I am using git flow and find out that branches “develop” were not sent to sonar. Make sure you add them in .travis.yml as well as in sonar-project.properties files (marked them in bold)

Update2: there is another option using sonarqube-scanner-node project . (I am assuming your project is made by create-react-app by facebook)

  • yarn add sonarqube-scanner-node --dev
  • yarn test -- --coverage
  • package.json -> add in script section:  "sonarqube": "sonarqube-scanner-node"
  • from command line: yarn sonarqube -Dsonar.host.url=https://sonarcloud.io -Dsonar.organization=chowanioksource -Dsonar.sources=src -Dsonar.projectKey=chowanioksource:reactBlog  -Dsonar.login=<sonarcloud.io token>

 


unable to find valid certification path to requested target

It is always preferred to use https instead of http (specially when using passwords and so on…)

We have switched our SonarQube (tool for Continuous Inspection of code quality) to use https for security reasons. Anyway I have noticed that Jenkins stop sending new quality codes to our sonar. When I have checked the logs I have seen this stacktrace:

Exception in thread "main" java.lang.IllegalStateException: Fail to request server version
	at org.sonar.runner.Bootstrapper.getServerVersion(Bootstrapper.java:73)
	at org.sonar.runner.Runner.checkSonarVersion(Runner.java:220)
	at org.sonar.runner.Runner.execute(Runner.java:150)
	at org.sonar.runner.Main.execute(Main.java:84)
	at org.sonar.runner.Main.main(Main.java:56)
Caused by: javax.net.ssl.SSLHandshakeException: sun.security.validator.ValidatorException: PKIX path building failed: sun.security.provider.certpath.SunCertPathBuilderException: unable to find valid certification path to requested target
	at com.sun.net.ssl.internal.ssl.Alerts.getSSLException(Alerts.java:150)
	at com.sun.net.ssl.internal.ssl.SSLSocketImpl.fatal(SSLSocketImpl.java:1584)
	at com.sun.net.ssl.internal.ssl.Handshaker.fatalSE(Handshaker.java:174)
	at com.sun.net.ssl.internal.ssl.Handshaker.fatalSE(Handshaker.java:168)
	at com.sun.net.ssl.internal.ssl.ClientHandshaker.serverCertificate(ClientHandshaker.java:848)
	at com.sun.net.ssl.internal.ssl.ClientHandshaker.processMessage(ClientHandshaker.java:106)
	at com.sun.net.ssl.internal.ssl.Handshaker.processLoop(Handshaker.java:495)
	at com.sun.net.ssl.internal.ssl.Handshaker.process_record(Handshaker.java:433)
	at com.sun.net.ssl.internal.ssl.SSLSocketImpl.readRecord(SSLSocketImpl.java:877)
	at com.sun.net.ssl.internal.ssl.SSLSocketImpl.performInitialHandshake(SSLSocketImpl.java:1089)
	at com.sun.net.ssl.internal.ssl.SSLSocketImpl.startHandshake(SSLSocketImpl.java:1116)
	at com.sun.net.ssl.internal.ssl.SSLSocketImpl.startHandshake(SSLSocketImpl.java:1100)
	at sun.net.www.protocol.https.HttpsClient.afterConnect(HttpsClient.java:402)
	at sun.net.www.protocol.https.AbstractDelegateHttpsURLConnection.connect(AbstractDelegateHttpsURLConnection.java:166)
	at sun.net.www.protocol.http.HttpURLConnection.getInputStream(HttpURLConnection.java:951)
	at java.net.URLConnection.getContent(URLConnection.java:682)
	at sun.net.www.protocol.https.HttpsURLConnectionImpl.getContent(HttpsURLConnectionImpl.java:406)
	at org.sonar.runner.Bootstrapper.remoteContent(Bootstrapper.java:125)
	at org.sonar.runner.Bootstrapper.getServerVersion(Bootstrapper.java:71)
	... 4 more

So here you can see that Jenkins has problem to “handshake” ssl certificate.

follow these steps:

Download InstallCert.java

Search google – it originally was done in Sun, but you can find this program on google codes or somewhere else. You can even download binaries of this file.

Add Trusted Keystore

Run “InstallCert.java” on server (where you run your https service). something like java InstallCert localhost:443 -> press “1”  when asked. It will add your “localhost” as a trusted keystore, and generate a file named “jssecacerts“.

[user@sonar ~]$ java InstallCert localhost:443
Loading KeyStore /usr/java/jdk1.6.0_37/jre/lib/security/cacerts...
Opening connection to localhost:443...
Starting SSL handshake..
Server sent 1 certificate(s):
1 Subject CN=Unknown, OU=Unknown, O=Vendavo, L=Unknown, ST=Czech republic, C=CZ
Enter certificate to add to trusted keystore or 'q' to quit: [1]
1
Added certificate to keystore 'jssecacerts' using alias 'localhost-1'

I have removed most of the parts but the main parts are here:

a) press 1 when assked – you agree to add certificate for this domain into keystore

b) it created jssecacerts file

Verify Trusted Keystore

Run same command again 🙂  (this is full export – removed hashed data)

[mchowaniok@sonar ~]$ java InstallCert sonar.vmcz.vendavo.com:443
Loading KeyStore jssecacerts...
Opening connection to sonar.vmcz.vendavo.com:443...
Starting SSL handshake...
No errors, certificate is already trusted
Server sent 1 certificate(s):
1 Subject CN=Unknown, OU=Unknown, O=Vendavo, L=Unknown, ST=Czech republic, C=CZ
 Issuer CN=Unknown, OU=Unknown, O=Vendavo, L=Unknown, ST=Czech republic, C=CZ
 sha1 
 md5 
Enter certificate to add to trusted keystore or 'q' to quit: [1]
q
KeyStore not changed

Copy jssecacerts

copy jssecacerts file into java/jre/lib/security folder (I had to done it under sudo )

[user@sonar ~]$ sudo cp jssecacerts /usr/java/default/jre/lib/security/

Done

verify it 🙂   in my case, run Jenkins job and verify data are uploaded to Sonar.


SonarQube part #2 – let’s feed it with some data

In previous article, I have showed you how to build sonarqube 4.0 on openshift , but let’s feed it with some data.

  • Let’s create dummy j2ee project using maven
    • mvn archetype:generate
    • cd <<project_name>>
    • mvn clean compile
  • openshift port forward to access database
    • rhc port-forward <<APPLICATION_NAME>>
    • you should see something like this:
      Service      Local                            OpenShift
      ——- ————–       —-     —————
      java     127.0.0.1:8080 => 127.X.X.X:8080
      mysql 127.0.0.1:3306 => 127.X.X.X:3306
    • database can be accessed on localhost:3306

Now we have few options how to feed sonar

  • maven – best for maven projects
  • sonarqube runner – best for java legacy code
  • jenkins,….

Maven projects

5 things to change or consider:

  1. jdbc url – make sure you have correct url, port, application name
  2. mysql username
  3. mysql password
  4. sonar host url
  5. I am using maven version 3 – in case you have maven version 2 you have set different dependences

to run:

mvn clean compile sonar:sonar 

or (including profile name to be used)

mvn clean compile sonar:sonar -Dsonar.profile="Sun checks"

SonarQube Runner

4 things to change or consider:

  1. jdbc url – make sure you have correct url, port, application name
  2. mysql username
  3. mysql password
  4. sonar host url

to run:

  • you have to download SonarQube runner & set PATH variable
    export SONAR_RUNNER_HOME=/Path/to/SonnarRunner/sonar-runner-2.3
    export PATH=$SONAR_RUNNER_HOME/bin:$PATH
  • create file called “sonar-project.properties” and fill it with info mentioned above in gist
  • run:
    sonar-runner

Now change code (i.e. add empty private method, named with upper case letter, ….) and run analysis again to feed sonar. Check sonar – it shows you all violations and issues in your code, …  (also it depends on plugins you have installed on your sonar)

Example project can be found on Bitbucket


How to run SonarQube 4.0 on openshift

I have managed to run latest SonarQube on openshift for free.

Because openshift has bug you can’t just have one-line command to do all setup for you, but I had to separate it into several commands and two git repos.

Bug

you can’t have .openshift folder in repo – so I have to have 2 git repos

  1. git repo with sonar without (.openshift folder)
  2. git repo with .openshift folder  with start & stop commands

How to get SonarQube 4.0 running on openshift

Description

  1. when RedHat fixes the bug, you should be fine, just with line #1
  2. cd into project
  3. add another git repo which holds .openshift folder with start & stop commands
  4. get changes from repo above
  5. pull from origin repo – git was complaining when I didn’t do pull
  6. push into openshift
  7. wait several minutes until sonar gets running

Thanks

Big thanks goes to Rui Rodrigues(@rodriguesrmb) as he managed to solve port binding problems and update java wrapper with new version