devel:hacking
Differences
This shows you the differences between two versions of the page.
| Both sides previous revision Previous revision Next revision | Previous revision Next revision Both sides next revision | ||
|
devel:hacking [2012/09/18 07:52] bredal [Running tests] |
devel:hacking [2012/11/14 13:27] norangshol [Javascript] fixed a typo: browser -> browsers |
||
|---|---|---|---|
| Line 125: | Line 125: | ||
| </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. | ||
| ====== Database ====== | ====== Database ====== | ||
| NAV uses PostgreSQL as its database backend. Namespaces (schemas) are | NAV uses PostgreSQL as its database backend. Namespaces (schemas) are | ||
| Line 354: | Line 364: | ||
| ===== 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 ===== | ||
devel/hacking.txt · Last modified: 2014/11/05 10:57 by morten
Page Tools
