Populate Oracle JET table on top of Oracle ADF BC using REST Web Service

 Previously I have posted about creating REST Web Service from ADF Application Module and in this post, I am going to use the same REST service for populating data in a JET table. Here we'll populate JET table on top of Oracle ADF BC (Business Components).

Here I am taking the same sample application that I have discussed in my first post Getting started with Oracle JET and JDeveloper

The URL of ADF BC based web service is http://127.0.0.1:7101/RestWebServApp-RESTWebService-context-root/rest/Jdev12.2.1/Department and it returns a list of Departments in nested JSON format

Let’s see the implementation part

Add an oj-table component in the dashboard.html page and define the required number of columns, this web service returns a list of Departments so I have taken 4 columns for Department Id, Department Name, Manager Id, and Location Id

1. <div class="oj-hybrid-padding">
2. <h1>Dashboard Content Area</h1>
3. <div id="div1">
5. <oj-table id='table' aria-label='Departments Table'
6. data='[[datasource]]'
7. selection-mode='{"row": "multiple", "column": "multiple"}'
8. dnd='{"reorder": {"columns": "enabled"}}'
9. scroll-policy='loadMoreOnScroll'
10. scroll-policy-options='{"fetchSize": 10}'
11. columns='[{"headerText": "Department Id",
12. "field": "dept_id",
13. "resizable": "enabled"},
15. {"headerText": "Department Name",
16. "field": "dept_name",
17. "resizable": "enabled"},
19. {"headerText": "Manager Id",
20. "field": "mgr_id",
21. "resizable": "enabled"},
23. {"headerText": "Location Id",
24. "field": "loc_id",
25. "resizable": "enabled"}
26. ]'
27. style='width: 100%; height: 400px;'>
28. </oj-table>
30. </div>
31. </div>

Now see the code of dashboard.js, Read comments to understand the javascript code, Here getJSON() method of jQuery is used to call REST Web Service as jQuery is a part of Oracle JET libraries.

1. /*
2. * Your dashboard ViewModel code goes here
3. */
4. define(['ojs/ojcore', 'knockout', 'jquery', 'ojs/ojinputtext', 'ojs/ojtable', 'ojs/ojarraytabledatasource'],
5. function (oj, ko, $) {
7. function DashboardViewModel() {
8. var self = this;
9. //Define a Knockout observable array and name it tabData
10. self.tabData = ko.observableArray();
12. //Use jQuery method to call REST Web Service
13. $.getJSON("http://127.0.0.1:7101/RestWebServApp-RESTWebService-context-root/rest/Jdev12.2.1/Department").
14. then(function (departments) {
15. //JSON response is nested that's why 'items' is used to access records
16. $.each(departments.items, function () {
17. //Push data in Observable array
18. self.tabData.push( {
19. dept_id : this.DepartmentId,
20. dept_name : this.DepartmentName,
21. mgr_id : this.ManagerId,
22. loc_id : this.LocationId
23. });
24. });
25. });
27. //Pass observable array in utility class to show data in table
28. self.datasource = new oj.ArrayTableDataSource(self.tabData,
29. {
30. idAttribute : 'dept_id'
31. });
32. .
33. .
34. .

tabData is a knockout observable array that is defined to hold returned value and you can see that
self.tabData.push is used to push web service data into this array and at last a JET utility class
ArrayTableDataSource is used to convert this observable array into tabular format data.

Now run the application and you can see that a JET table is populated with Departments data

Cheers 🙂 Happy Learning

Unit testing of ADF Application using JUnit

 JUnit is a unit testing package for Java language and can be used to test Oracle ADF applications as ADF is built on top of the J2EE framework. Unit testing is basically is a process to verify the smallest testable module against some defined test criteria. Here I am going to illustrate how can we set up and use JUnit in JDeveloper 12.2.1.3 to test the ADF application.

JDeveloper 12.2.1.3 comes with a JUnit extension so no need to install it separately. Let's start by creating a Fusion Web Application in JDeveloper IDE. Here I am taking Departments table of default HR Schema to prepare the model for ADF Application.

The next step is to create a new project to hold unit tests so that the whole application doesn't look ambiguous. Right-click on the Application name and select New–> From Gallery–> General–> Projects --> Java Project 

Put a name for that project and click on the Finish button.

Now next step is to create a Test Suite for business components and before that, we should know some terminology that is used in unit testing.

Test Suite- A group of Test Cases

Test Fixture- A class to handle long-running test cases and keep the state of multiple test cases.

Assertation- To check the result of a test case against the expected result.

Now to open the test suite wizard, Right-click on new project and select New–> From Gallery–> General–> Unit Tests --> ADF Business Components Test Suite

Click on the OK button and configure the test suite. You can see that here I have selected the Model project and DeptAm application module to test. You need to select Configuration for database connection too and here I have selected DeptAMLocal.

Click on the Next button and see that this wizard will generate a Test Suite class and a Test Fixture class. This wizard will also generate separate unit test classes for each view object in the application.

Now click on Finish button and you can under new project all files are created.

DeptAmFixture.java- Test Fixture Class

AllDeptAMTests.java- Test Suite Class

DepartmentsVO1VOTest.java- Unit Test Class for Departments ViewObject

Now open DepartmentsVO1VOTest.java class and look at the default test case that checks that the Department View Object should not be null.

You can see here @Test annotation, this indicates that this java method is a unit test and after performing test assert is used to verify the test result.

1. @Test
2. public void testAccess() {
3. ViewObject view = fixture1.getApplicationModule().findViewObject("DepartmentsVO1");
4. assertNotNull(view);
5. }
7. @Before
8. public void setUp() {
9. }
11. @After
12. public void tearDown() {
13. }

To check this default test case, Right-click on the test suite class and select run. You can see that the unit test execute successfully.

The next step is to create some of the own unit tests, I have created this unit test that checks that the Department Id should not be null in a newly created row.

1. @Test
2. public void checkDeptIdNotNull() {
3. ViewObject deptVo = fixture1.getApplicationModule().findViewObject("DepartmentsVO1");
4. Row newRow = deptVo.createRow();
6. newRow.setAttribute("DepartmentId", 222);
7. newRow.setAttribute("DepartmentName", "Testing");
9. assertNotNull("DepartmentId should not be null", newRow.getAttribute("DepartmentId"));
10. }

So in the above code, I have created a new row in Department's view object and set 222 in Department Id. Now run this test case.

You can see here that the test is passed successfully because Department Id is not null, That's great. Now comment this line in the code

//newRow.setAttribute("DepartmentId", 222);

and run the test again

See that test is failed with AssertionError as Department Id is null this time. This is how we can write our own unit tests to check.

Here I am writing one more test case to check whether the department is in the database or not. I am passing 1990 as department id that is not in the database.

1. @Test
2. public void findDepartment() {
3. ViewObject deptVo = fixture1.getApplicationModule().findViewObject("DepartmentsVO1");
4. int deptId = 1990;
6. Row row[] = deptVo.findByKey(new Key(new Object[] { deptId }), 1);
7. Integer count = row.length;
8. //assertTrue fails when second parameter evaluates to "false"
9. assertTrue("Department Not Found", count.compareTo(0) == 1);
11. }

Let's see the result

This is how we configure and use JUnit in the Oracle ADF Application for Unit Testing.

Cheers 🙂 Happy Learning