YARN-3840. Resource Manager web ui issue when sorting application by id (with application having id > 9999) Contributed by Mohammad Shahid Khan

hadoop-mapreduce-project/hadoop-mapreduce-client/hadoop-mapreduce-client-app/src/main/java/org/apache/hadoop/mapreduce/v2/app/webapp/TaskPage.java

@@ -221,7 +221,7 @@ public class TaskPage extends AppView {
     .append("\n{'aTargets': [ 5 ]")
     .append(", 'bSearchable': false }")
 
-    .append("\n, {'sType':'string', 'aTargets': [ 0 ]")
+    .append("\n, {'sType':'natural', 'aTargets': [ 0 ]")
     .append(", 'mRender': parseHadoopID }")
 
     .append("\n, {'sType':'numeric', 'aTargets': [ 6, 7")

hadoop-mapreduce-project/hadoop-mapreduce-client/hadoop-mapreduce-client-app/src/main/java/org/apache/hadoop/mapreduce/v2/app/webapp/TasksPage.java

@@ -43,7 +43,7 @@ public class TasksPage extends AppView {
       .append(", bProcessing: true")
 
       .append("\n, aoColumnDefs: [\n")
-      .append("{'sType':'string', 'aTargets': [0]")
+      .append("{'sType':'natural', 'aTargets': [0]")
       .append(", 'mRender': parseHadoopID }")
 
       .append("\n, {'sType':'numeric', bSearchable:false, 'aTargets': [1]")

hadoop-yarn-project/CHANGES.txt

@@ -1042,6 +1042,9 @@ Release 2.8.0 - UNRELEASED
     YARN-4326. Fix TestDistributedShell timeout as AHS in MiniYarnCluster no longer 
     binds to default port 8188. (Meng Ding via wangda)
 
+    YARN-3840. Resource Manager web ui issue when sorting application by id (with
+    application having id > 9999) (Mohammad Shahid Khan via jianhe)
+
 Release 2.7.3 - UNRELEASED
 
   INCOMPATIBLE CHANGES

hadoop-yarn-project/hadoop-yarn/hadoop-yarn-common/src/main/java/org/apache/hadoop/yarn/webapp/view/JQueryUI.java

@@ -65,14 +65,14 @@ public class JQueryUI extends HtmlBlock {
 
   @Override
   protected void render(Block html) {
-    html.
+    html.link(root_url("static/jquery/themes-1.9.1/base/jquery-ui.css"))
-      link(root_url("static/jquery/themes-1.9.1/base/jquery-ui.css")).
+        .link(root_url("static/dt-1.9.4/css/jui-dt.css"))
-      link(root_url("static/dt-1.9.4/css/jui-dt.css")).
+        .script(root_url("static/jquery/jquery-1.8.2.min.js"))
-      script(root_url("static/jquery/jquery-1.8.2.min.js")).
+        .script(root_url("static/jquery/jquery-ui-1.9.1.custom.min.js"))
-      script(root_url("static/jquery/jquery-ui-1.9.1.custom.min.js")).
+        .script(root_url("static/dt-1.9.4/js/jquery.dataTables.min.js"))
-      script(root_url("static/dt-1.9.4/js/jquery.dataTables.min.js")).
+        .script(root_url("static/yarn.dt.plugins.js"))
-      script(root_url("static/yarn.dt.plugins.js")).
+        .script(root_url("static/dt-plugin-1.10.7/sorting/natural.js"))
-      style("#jsnotice { padding: 0.2em; text-align: center; }",
+        .style("#jsnotice { padding: 0.2em; text-align: center; }",
             ".ui-progressbar { height: 1em; min-width: 5em }"); // required
 
     List<String> list = Lists.newArrayList();
@@ -82,9 +82,8 @@ public class JQueryUI extends HtmlBlock {
     initProgressBars(list);
 
     if (!list.isEmpty()) {
-      html.
+      html.script().$type("text/javascript")._("$(function() {")
-        script().$type("text/javascript").
+          ._(list.toArray())._("});")._();
-          _("$(function() {")._(list.toArray())._("});")._();
     }
   }
 

hadoop-yarn-project/hadoop-yarn/hadoop-yarn-server/hadoop-yarn-server-applicationhistoryservice/src/main/java/org/apache/hadoop/yarn/server/applicationhistoryservice/webapp/AppAttemptPage.java

@@ -53,7 +53,7 @@ public class AppAttemptPage extends AHSView {
 
   protected String getContainersTableColumnDefs() {
     StringBuilder sb = new StringBuilder();
-    return sb.append("[\n").append("{'sType':'string', 'aTargets': [0]")
+    return sb.append("[\n").append("{'sType':'natural', 'aTargets': [0]")
       .append(", 'mRender': parseHadoopID }]").toString();
   }
 

hadoop-yarn-project/hadoop-yarn/hadoop-yarn-server/hadoop-yarn-server-applicationhistoryservice/src/main/java/org/apache/hadoop/yarn/server/applicationhistoryservice/webapp/AppPage.java

@@ -55,7 +55,7 @@ public class AppPage extends AHSView {
 
   protected String getAttemptsTableColumnDefs() {
     StringBuilder sb = new StringBuilder();
-    return sb.append("[\n").append("{'sType':'string', 'aTargets': [0]")
+    return sb.append("[\n").append("{'sType':'natural', 'aTargets': [0]")
       .append(", 'mRender': parseHadoopID }")
 
       .append("\n, {'sType':'numeric', 'aTargets': [1]")

hadoop-yarn-project/hadoop-yarn/hadoop-yarn-server/hadoop-yarn-server-applicationhistoryservice/src/test/java/org/apache/hadoop/yarn/server/applicationhistoryservice/webapp/TestAHSWebApp.java

@@ -21,7 +21,7 @@ package org.apache.hadoop.yarn.server.applicationhistoryservice.webapp;
 import static org.apache.hadoop.yarn.webapp.Params.TITLE;
 import static org.mockito.Mockito.mock;
 
-import org.junit.Assert;
+import java.util.Map;
 import org.apache.hadoop.conf.Configuration;
 import org.apache.hadoop.yarn.api.ApplicationBaseProtocol;
 import org.apache.hadoop.yarn.api.records.ApplicationAttemptId;
@@ -38,6 +38,7 @@ import org.apache.hadoop.yarn.server.applicationhistoryservice.MemoryApplication
 import org.apache.hadoop.yarn.util.StringHelper;
 import org.apache.hadoop.yarn.webapp.YarnWebParams;
 import org.apache.hadoop.yarn.webapp.test.WebAppTests;
+import org.junit.Assert;
 import org.junit.Before;
 import org.junit.Test;
 
@@ -87,6 +88,21 @@ public class TestAHSWebApp extends ApplicationHistoryStoreTestUtils {
     WebAppTests.flushOutput(injector);
   }
 
+  @Test
+  public void testAPPViewNaturalSortType() throws Exception {
+    Injector injector =
+        WebAppTests.createMockInjector(ApplicationBaseProtocol.class,
+            mockApplicationHistoryClientService(5, 1, 1));
+    AHSView ahsViewInstance = injector.getInstance(AHSView.class);
+
+    ahsViewInstance.render();
+    WebAppTests.flushOutput(injector);
+    Map<String, String> moreParams =
+        ahsViewInstance.context().requestContext().moreParams();
+    String appTableColumnsMeta = moreParams.get("ui.dataTables.apps.init");
+    Assert.assertTrue(appTableColumnsMeta.indexOf("natural") != -1);
+  }
+
   @Test
   public void testAboutPage() throws Exception {
     Injector injector =
@@ -117,6 +133,22 @@ public class TestAHSWebApp extends ApplicationHistoryStoreTestUtils {
     WebAppTests.flushOutput(injector);
   }
 
+  @Test
+  public void testAppPageNaturalSortType() throws Exception {
+    Injector injector =
+        WebAppTests.createMockInjector(ApplicationBaseProtocol.class,
+            mockApplicationHistoryClientService(1, 5, 1));
+    AppPage appPageInstance = injector.getInstance(AppPage.class);
+
+    appPageInstance.render();
+    WebAppTests.flushOutput(injector);
+    Map<String, String> moreParams =
+        appPageInstance.context().requestContext().moreParams();
+    String attemptsTableColumnsMeta =
+        moreParams.get("ui.dataTables.attempts.init");
+    Assert.assertTrue(attemptsTableColumnsMeta.indexOf("natural") != -1);
+  }
+
   @Test
   public void testAppAttemptPage() throws Exception {
     Injector injector =
@@ -135,6 +167,21 @@ public class TestAHSWebApp extends ApplicationHistoryStoreTestUtils {
     WebAppTests.flushOutput(injector);
   }
 
+  @Test
+  public void testAppAttemptPageNaturalSortType() throws Exception {
+    Injector injector =
+        WebAppTests.createMockInjector(ApplicationBaseProtocol.class,
+            mockApplicationHistoryClientService(1, 1, 5));
+    AppAttemptPage appAttemptPageInstance =
+        injector.getInstance(AppAttemptPage.class);
+    appAttemptPageInstance.render();
+    WebAppTests.flushOutput(injector);
+    Map<String, String> moreParams =
+        appAttemptPageInstance.context().requestContext().moreParams();
+    String tableColumnsMeta = moreParams.get("ui.dataTables.containers.init");
+    Assert.assertTrue(tableColumnsMeta.indexOf("natural") != -1);
+  }
+
   @Test
   public void testContainerPage() throws Exception {
     Injector injector =
@@ -195,5 +242,4 @@ public class TestAHSWebApp extends ApplicationHistoryStoreTestUtils {
       return store;
     }
   };
-
 }

hadoop-yarn-project/hadoop-yarn/hadoop-yarn-server/hadoop-yarn-server-common/src/main/java/org/apache/hadoop/yarn/server/webapp/WebPageUtils.java

@@ -49,7 +49,7 @@ public class WebPageUtils {
       boolean isFairSchedulerPage, boolean isResourceManager) {
     StringBuilder sb = new StringBuilder();
     sb.append("[\n")
-      .append("{'sType':'string', 'aTargets': [0]")
+      .append("{'sType':'natural', 'aTargets': [0]")
       .append(", 'mRender': parseHadoopID }")
       .append("\n, {'sType':'numeric', 'aTargets': [6, 7]")
       .append(", 'mRender': renderHadoopDate }")
@@ -75,7 +75,7 @@ public class WebPageUtils {
 
   private static String getAttemptsTableColumnDefs() {
     StringBuilder sb = new StringBuilder();
-    return sb.append("[\n").append("{'sType':'string', 'aTargets': [0]")
+    return sb.append("[\n").append("{'sType':'natural', 'aTargets': [0]")
       .append(", 'mRender': parseHadoopID }")
       .append("\n, {'sType':'numeric', 'aTargets': [1]")
       .append(", 'mRender': renderHadoopDate }]").toString();
@@ -91,7 +91,7 @@ public class WebPageUtils {
 
   private static String getContainersTableColumnDefs() {
     StringBuilder sb = new StringBuilder();
-    return sb.append("[\n").append("{'sType':'string', 'aTargets': [0]")
+    return sb.append("[\n").append("{'sType':'natural', 'aTargets': [0]")
       .append(", 'mRender': parseHadoopID }]").toString();
   }
 

hadoop-yarn-project/hadoop-yarn/hadoop-yarn-server/hadoop-yarn-server-nodemanager/src/main/java/org/apache/hadoop/yarn/server/nodemanager/webapp/AllApplicationsPage.java

@@ -54,7 +54,14 @@ public class AllApplicationsPage extends NMView {
         // Sort by id upon page load
         append(", aaSorting: [[0, 'asc']]").
         // applicationid, applicationstate
-        append(", aoColumns:[null, null]} ").toString();
+        append(", aoColumns:[").append(getApplicationsIdColumnDefs())
+        .append(", null]} ").toString();
+  }
+
+  private String getApplicationsIdColumnDefs() {
+    StringBuilder sb = new StringBuilder();
+    return sb.append("{'sType':'natural', 'aTargets': [0]")
+        .append(", 'mRender': parseHadoopID }").toString();
   }
 
   @Override

hadoop-yarn-project/hadoop-yarn/hadoop-yarn-server/hadoop-yarn-server-nodemanager/src/main/java/org/apache/hadoop/yarn/server/nodemanager/webapp/AllContainersPage.java

@@ -52,9 +52,15 @@ public class AllContainersPage extends NMView {
   private String containersTableInit() {
     return tableInit().
         // containerid, containerid, log-url
-        append(", aoColumns:[null, null, {bSearchable:false}]} ").toString();
+        append(", aoColumns:[").append(getContainersIdColumnDefs())
+        .append(", null, {bSearchable:false}]} ").toString();
   }
 
+  private String getContainersIdColumnDefs() {
+    StringBuilder sb = new StringBuilder();
+    return sb.append("{'sType':'natural', 'aTargets': [0]")
+        .append(", 'mRender': parseHadoopID }").toString();
+  }
   @Override
   protected Class<? extends SubView> content() {
     return AllContainersBlock.class;

hadoop-yarn-project/hadoop-yarn/hadoop-yarn-server/hadoop-yarn-server-resourcemanager/src/test/java/org/apache/hadoop/yarn/server/resourcemanager/webapp/TestRMWebApp.java

@@ -28,6 +28,7 @@ import static org.mockito.Mockito.when;
 import java.io.IOException;
 import java.util.ArrayList;
 import java.util.List;
+import java.util.Map;
 import java.util.concurrent.ConcurrentMap;
 
 import org.apache.hadoop.conf.Configuration;
@@ -119,6 +120,10 @@ public class TestRMWebApp {
         YarnApplicationState.RUNNING.toString()));
     rmViewInstance.render();
     WebAppTests.flushOutput(injector);
+    Map<String, String> moreParams =
+        rmViewInstance.context().requestContext().moreParams();
+    String appsTableColumnsMeta = moreParams.get("ui.dataTables.apps.init");
+    Assert.assertTrue(appsTableColumnsMeta.indexOf("natural") != -1);
   }
 
   @Test public void testNodesPage() {