Add TypeScript and HTML linting to Travis lint job (#7294)

.travis.yml

@@ -118,6 +118,14 @@ matrix:
         - export PATH="$GOROOT/bin:$GOPATH/bin:$PATH"
         - go get github.com/bazelbuild/buildtools/buildifier
         - ./ci/travis/bazel-format.sh
+        # Run TypeScript and HTML linting.
+        - pushd python/ray/dashboard/client
+        - source "$HOME/.nvm/nvm.sh"
+        - nvm use node
+        - node_modules/.bin/eslint --max-warnings 0 $(find src -name "*.ts" -or -name "*.tsx")
+        - node_modules/.bin/prettier --check $(find src -name "*.ts" -or -name "*.tsx")
+        - node_modules/.bin/prettier --check public/index.html
+        - popd
 
     # Build Linux wheels.
     - os: linux

ci/travis/install-dependencies.sh

@@ -65,6 +65,13 @@ elif [[ "$LINT" == "1" ]]; then
   export PATH="$HOME/miniconda/bin:$PATH"
   # Install Python linting tools.
   pip install -q flake8==3.7.7 flake8-comprehensions flake8-quotes==2.0.0
+  # Install TypeScript and HTML linting tools.
+  pushd "$ROOT_DIR/../../python/ray/dashboard/client"
+    source "$HOME/.nvm/nvm.sh"
+    nvm install node
+    nvm use node
+    npm ci
+  popd
 elif [[ "$LINUX_WHEELS" == "1" ]]; then
   sudo apt-get install docker
   sudo usermod -a -G docker travis
@@ -84,7 +91,7 @@ fi
 
 if [[ "$PYTHON" == "3.6" ]] || [[ "$MAC_WHEELS" == "1" ]]; then
   # Install the latest version of Node.js in order to build the dashboard.
-  source $HOME/.nvm/nvm.sh
+  source "$HOME/.nvm/nvm.sh"
   nvm install node
 fi
 

python/ray/dashboard/client/src/api.ts

@@ -127,7 +127,7 @@ export interface RayletInfoResponse {
           actorTitle: string;
           requiredResources: { [key: string]: number };
           state: -1;
-          invalidStateType?: 'infeasibleActor' | 'pendingActor';
+          invalidStateType?: "infeasibleActor" | "pendingActor";
         };
   };
 }

python/ray/dashboard/client/src/pages/dashboard/Dashboard.tsx

@@ -83,7 +83,7 @@ class Dashboard extends React.Component<
       { label: "Tune", component: Tune }
     ];
 
-    // if Tune information is not avaliable, remove Tune tab from the dashboard
+    // if Tune information is not available, remove Tune tab from the dashboard
     if (!tuneAvailability) {
       tabs.splice(3);
     }

python/ray/dashboard/client/src/pages/dashboard/logical-view/Actor.tsx

@@ -1,3 +1,5 @@
+import Collapse from "@material-ui/core/Collapse";
+import orange from "@material-ui/core/colors/orange";
 import { Theme } from "@material-ui/core/styles/createMuiTheme";
 import createStyles from "@material-ui/core/styles/createStyles";
 import withStyles, { WithStyles } from "@material-ui/core/styles/withStyles";
@@ -7,13 +9,11 @@ import {
   checkProfilingStatus,
   CheckProfilingStatusResponse,
   getProfilingResultURL,
+  launchKillActor,
   launchProfiling,
-  RayletInfoResponse,
-  launchKillActor
+  RayletInfoResponse
 } from "../../../api";
 import Actors from "./Actors";
-import Collapse from "@material-ui/core/Collapse";
-import orange from '@material-ui/core/colors/orange';
 
 const styles = (theme: Theme) =>
   createStyles({
@@ -289,11 +289,10 @@ class Actor extends React.Component<Props & WithStyles<typeof styles>, State> {
                   )
               )}
             </React.Fragment>
-          ) : actor.invalidStateType === 'infeasibleActor' ? (
+          ) : actor.invalidStateType === "infeasibleActor" ? (
             <span className={classes.invalidStateTypeInfeasible}>
-              {actor.actorTitle} is infeasible.  
-              (Infeasible actor means an actor cannot be created because 
-              Ray cluster cannot satisfy resources requirement).
+              {actor.actorTitle} is infeasible. (This actor cannot be created
+              because the Ray cluster cannot satisfy its resource requirements.)
             </span>
           ) : (
             <span className={classes.invalidStateTypePendingActor}>