Testing Oracle JET Applications

You can use virtually any testing tool that tests client-side HTML applications written in JavaScript. For internal development,

Oracle JET uses the following tools for testing Oracle JET components and applications:

QUnit: JavaScript unit testing framework capable of testing any generic JavaScript project and used by the jQuery, jQuery UI, and jQuery Mobile projects.

QUnit requires configuration on your test page to include library and CSS references. You must also add the HTML div element to your page. In the example below, the highlighted code shows additions required by QUnit. The actual paths will vary, depending upon where you install QUnit.

<!doctype html>
<html lang="en">
  <head>
    <link rel="stylesheet" href="../../../../code/css/libs/oj/v1.1.2/alta/oj-alta-min.css"></link>
    <link rel="stylesheet" href="../../../css/qunit.css">
    <script type="text/javascript" src="../../../js/qunit.js"></script>
    <script>
      QUnit.config.autoload = false;
      QUnit.config.autostart = false;
    </script>        
    <script data-main="js/main" src="../../../../code/js/libs/require/require.js"></script>
    </head>
  <body>
    <div id="qunit"></div>
    <div id="button1">
       <h2> Example Knockout Template (displaying demo icons)</h2>
       <h3>Single Button Example </h3>
       ... contents omitted
    </div>
  </body>
</html>

For additional information about QUnit, see http://qunitjs.com.

Selenium WebDriver: Alternative method of testing applications that you do not want to modify for QUnit or that contain multiple HTML pages.

For additional information, see http://docs.seleniumhq.org/projects/webdriver.

To assist you with testing Oracle JET components in your own application, Oracle JET provides the following methods:

getNodeBySubId(locator): Returns the component DOM node indicated by the locator parameter. For additional information, see Using getNodeBySubId() in Testing.
getSubIdByNode(node): Returns the subId string for the given child DOM node.

Method can be used by test authors to tie into test script generators that must retrieve a recordable ID from a live DOM component while recording a test. This method is currently supported by only a subset of Oracle JET components, and you should check the Oracle JET component's API to verify support.

Using getNodeBySubId() in Testing

The getNodeBySubId() method provides safe access to an Oracle JET component's internal parts to check values and manipulate components. Most Oracle JET components will consist of one or more internal parts. For example, an Oracle JET table component has table cells that you can access with the getNodeBySubId() method.

To use the getNodeBySubId() method in testing:

When you create your component, be sure that you assign it an id selector in the HTML markup.

The code below shows example markup for an ojTable component with the id defined as table.

<table id="table1" summary="Department List"
       data-bind="ojComponent: {component: 'ojTable', data: datasource, columnsDefault: {sortable: 'none'}, columns:
         [{headerText: 'Department Id', field: 'DepartmentId'},
         {headerText: 'Department Name', field: 'DepartmentName'},
         {headerText: 'Location Id', field: 'LocationId'},
         {headerText: 'Manager Id', field: 'ManagerId'}]}">
</table>

Check the component's API documentation for the list of nodes that you can access with the getNodeBySubId(locator) method.

For example, if you know you want to access a table cell in an Oracle JET ojTable component, check the ojTable API documentation for getNodeBySubId() . The documentation indicates that to access a table cell, use oj-table-cell rowIndex: number columnIndex: number.
Add the code to access the table cell to your markup.
For example, the following code accesses the first table cell (row 0, column 0) in the Oracle JET table defined in Step 1.
```
node = $("#table1").ojTable('getNodeBySubId', {subId: 'oj-table-cell', rowIndex: 0, columnIndex: 0});
```