devel:hacking
Differences
This shows you the differences between two versions of the page.
| Both sides previous revision Previous revision Next revision | Previous revision Last revision Both sides next revision | ||
|
devel:hacking [2012/09/18 07:52] bredal [Running tests] |
devel:hacking [2013/06/19 07:45] morten fix jenkins url |
||
|---|---|---|---|
| Line 124: | Line 124: | ||
| # -*- coding: utf-8 -*- | # -*- coding: utf-8 -*- | ||
| </code> | </code> | ||
| + | |||
| + | ===== Javascript ===== | ||
| + | |||
| + | When writing javascript code try to focus on modules not pages. If the code is html-related, it should take selectors or objects as input and concern itself solely about those. This makes for much easier testing and reuse. And of course - write the tests first. | ||
| + | |||
| + | When the module is done you write a controller for the page that plugs the needed plugins to the page elements. This should fail gracefully if the needed elements are not present. | ||
| + | |||
| + | NAVs javascript uses [[http://requirejs.org/|require.js]] - use this to create modules and specify dependencies. | ||
| + | |||
| + | Pro tip is to create ''require_config.dev.js'' in ''media/js/'' and add the following configuration to requirejs: | ||
| + | <code>require.urlArgs = "bust=" + (new Date()).getTime();</code> This makes sure your not using cached resources in your browser when developing, which browsers loves to do! See [[http://requirejs.org/docs/api.html#config-urlArgs|config-urlArgs]] in requirejs documentation for «details». The ''require_config.dev.js'' is added in global HG ignore. | ||
| + | |||
| + | ==== Accessing resources with ajax requiring authentication ==== | ||
| + | |||
| + | As your authenticated session might have timed out due to idle (no activity), resources will return 500 Internal Error if you do not supply the important ''//X-NAV-AJAX//'' header on your ajax requests. | ||
| + | |||
| + | So make sure to include the ''**X-NAV-AJAX**'' header so you will get proper HTTP response code in the reponse from your request. | ||
| + | |||
| + | NAV has a shortcut for fixing this in ''default.js'' (adds a function in the public namespace NAV) which attaches the required handlers for jQuery by doing: | ||
| + | <code>NAV.addGlobalAjaxHandlers()</code> | ||
| ====== Database ====== | ====== Database ====== | ||
| Line 354: | Line 374: | ||
| ===== Javascript testing ===== | ===== Javascript testing ===== | ||
| - | blapp | + | Testing of javascript is in its infancy in NAV. We are currently using [[http://busterjs.org/|buster.js]] as testing toolkit. |
| + | |||
| + | To install buster.js install [[http://nodejs.org/|node]] and then: | ||
| + | <code> | ||
| + | npm install -g buster | ||
| + | </code> | ||
| + | |||
| + | As we use [[http://requirejs.org/|require.js]] you need the AMD module of buster aswell. Install it in the /media/js directory: | ||
| + | <code> | ||
| + | npm install buster-amd | ||
| + | </code> | ||
| + | |||
| + | To run the tests you need to | ||
| + | - Start a buster server by typing ''buster-server'' | ||
| + | - Capture browsers by pointing browsers to the buster-server (default localhost:1111) | ||
| + | - Go to /media/js | ||
| + | - Run the tests by typing ''buster-test'' | ||
| + | |||
| + | All tests are located under ''media/js/tests/''. Create new tests there. For syntax, assertions and related stuff take a look at the tests already there and [[http://busterjs.org/docs/|the buster docs]]. | ||
| ===== Jenkins ===== | ===== Jenkins ===== | ||
| Line 362: | Line 400: | ||
| quality. | quality. | ||
| - | Our Jenkins installation is available on http://nav.uninett.no/jenkins . | + | Our Jenkins installation is available on https://ci.nav.uninett.no/ . |
| ===== Tips and tricks ===== | ===== Tips and tricks ===== | ||
devel/hacking.txt · Last modified: 2014/11/05 10:57 by morten
Page Tools
