Stricter linting for comments

.eslintignore

@@ -0,0 +1,3 @@
+node_modules
+dist
+build

.eslintrc.json

@@ -26,14 +26,36 @@
         "parser": "@typescript-eslint/parser",
         "extends":  [
             "plugin:@typescript-eslint/recommended"
-        ]
+        ],
+        "rules": {
+            "@typescript-eslint/no-explicit-any": "off",
+            "camelcase": "off",
+            "@typescript-eslint/camelcase": "off"
+
+        }    
+    }, {
+        "files": ["**/test/**/*.js"],
+        "rules": {
+            "max-len": ["warn", {
+                "code": 200,
+                "comments": 200,
+                "ignoreTrailingComments": true
+            }]
+        }    
     }],
     "rules": {
         "prettier/prettier": ["error", {
             "printWidth": 200,
             "tabWidth": 4,
             "bracketSpacing": false
         }],
+        "max-len": ["warn", {
+            "code": 200,
+            "comments": 80,
+            "ignoreTrailingComments": true
+        }],
+        "@typescript-eslint/camelcase": "off",
+        "camelcase": "off",
         "no-const-assign": "error",
         "no-this-before-super": "error",
         "no-undef": "error",

package.json

@@ -94,7 +94,8 @@
         "start": "lerna run start --stream --scope",
         "precommit": "npm run lint",
         "lint": "npm-run-all lint:* lint_python",
-        "lint:eslint": "eslint packages/*/src/**/*.js packages/*/test/**/*.js examples/*/*.js",
+        "lint:eslint": "eslint \"packages/*/src/**/*.js\" \"packages/*/test/**/*.js\" \"examples/*/*.js\"",
+        "lint_:tslint": "eslint \"packages/*/src/**/*.ts\" \"packages/*/test/**/*.ts\" \"examples/*/*.ts\"",
         "lint_python": "node scripts/lint_python.js",
         "fix:es": "npm run lint:eslint -- --fix",
         "fix:md": "prettier docs/md/*.md --prose-wrap=always --write",

packages/perspective-jupyterlab/src/ts/client.ts

@@ -20,27 +20,31 @@ export interface PerspectiveJupyterMessage {
 }
 
 /**
- * `PerspectiveJupyterClient` acts as a message bus between the frontend and backend,
- * passing messages from `perspective-viewer` (method calls, `to_format()` calls, etc.) to
- * the `PerspectiveManager` on the python side of the plugin.
+ * `PerspectiveJupyterClient` acts as a message bus between the frontend and
+ * backend, passing messages from `perspective-viewer` (method calls,
+ * `to_format()` calls, etc.) to the `PerspectiveManager` on the python side of
+ * the plugin.
  *
- * This client implements the `Client` class as defined in `@finos/perspective/api`.
+ * This client implements the `Client` class as defined in
+ * `@finos/perspective/api`.
  */
 export class PerspectiveJupyterClient extends Client {
     view: DOMWidgetView;
 
     /**
      * Create a new instance of the client.
      *
-     * @param view {DOMWidgetView} the plugin view that can send messages to the Python backend.
+     * @param view {DOMWidgetView} the plugin view that can send messages to the
+     * Python backend.
      */
     constructor(view: DOMWidgetView) {
         super();
         this.view = view;
     }
 
     /**
-     * Given a message, pass it to the `PerspectiveManager` instance on the ipywidget.
+     * Given a message, pass it to the `PerspectiveManager` instance on the
+     * ipywidget.
      *
      * The sent message conforms to the `PerspectiveJupyterMessage` interface.
      *

packages/perspective-jupyterlab/src/ts/view.ts

@@ -13,7 +13,8 @@ import {PerspectiveJupyterWidget} from "./widget";
 import {PerspectiveJupyterClient, PerspectiveJupyterMessage} from "./client";
 
 /**
- * `PerspectiveView` defines the plugin's DOM and how the plugin interacts with the DOM.
+ * `PerspectiveView` defines the plugin's DOM and how the plugin interacts with
+ * the DOM.
  */
 export class PerspectiveView extends DOMWidgetView {
     pWidget: PerspectiveWidget;
@@ -79,7 +80,8 @@ export class PerspectiveView extends DOMWidgetView {
     }
 
     /**
-     * Attach event handlers, and watch the DOM for state changes in order to reflect them back to Python.
+     * Attach event handlers, and watch the DOM for state changes in order to
+     * reflect them back to Python.
      */
     render() {
         super.render();
@@ -96,7 +98,8 @@ export class PerspectiveView extends DOMWidgetView {
         this.model.on("change:dark", this.dark_changed, this);
         this.model.on("change:editable", this.editable_changed, this);
 
-        // Watch the viewer DOM so that widget state is always synchronized with DOM attributes.
+        // Watch the viewer DOM so that widget state is always synchronized with
+        // DOM attributes.
         const observer = new MutationObserver(this._synchronize_state.bind(this));
         observer.observe(this.pWidget.viewer, {
             attributes: true,
@@ -105,9 +108,11 @@ export class PerspectiveView extends DOMWidgetView {
         });
 
         /**
-         * Request a table from the manager. If a table has been loaded, proxy it and kick off subsequent operations.
+         * Request a table from the manager. If a table has been loaded, proxy
+         * it and kick off subsequent operations.
          *
-         * If a table hasn't been loaded, the viewer won't get a response back and simply waits until it receives a table name.
+         * If a table hasn't been loaded, the viewer won't get a response back
+         * and simply waits until it receives a table name.
          */
         this.perspective_client.send({
             id: -2,
@@ -123,18 +128,21 @@ export class PerspectiveView extends DOMWidgetView {
      * @param msg {PerspectiveJupyterMessage}
      */
     _handle_message(msg: PerspectiveJupyterMessage) {
-        // If in client-only mode (no Table on the python widget), message.data is an object containing "data" and "options".
+        // If in client-only mode (no Table on the python widget), message.data
+        // is an object containing "data" and "options".
         if (msg.type === "table") {
             this._handle_load_message(msg);
         } else {
             if (msg.data["cmd"] === "delete") {
-                // Regardless of client mode, if `delete()` is called we need to clean up the Viewer.
+                // Regardless of client mode, if `delete()` is called we need to
+                // clean up the Viewer.
                 this.pWidget.delete();
                 return;
             }
 
             if (this.pWidget.client === true) {
-                // In client mode, we need to directly call the methods on the viewer
+                // In client mode, we need to directly call the methods on the
+                // viewer
                 const command = msg.data["cmd"];
                 if (command === "update") {
                     this.pWidget._update(msg.data["data"]);
@@ -144,7 +152,9 @@ export class PerspectiveView extends DOMWidgetView {
                     this.pWidget.clear();
                 }
             } else {
-                // Make a deep copy of each message - widget views share the same comm, so mutations on `msg` affect subsequent message handlers.
+                // Make a deep copy of each message - widget views share the
+                // same comm, so mutations on `msg` affect subsequent message
+                // handlers.
                 const message = JSON.parse(JSON.stringify(msg));
 
                 delete message.type;
@@ -158,8 +168,9 @@ export class PerspectiveView extends DOMWidgetView {
     }
 
     /**
-     * Given a message that commands the widget to load a dataset or table, process it.
-     * @param {PerspectiveJupyterMessage} msg 
+     * Given a message that commands the widget to load a dataset or table,
+     * process it.
+     * @param {PerspectiveJupyterMessage} msg
      */
     _handle_load_message(msg: PerspectiveJupyterMessage) {
         if (this.pWidget.client === true) {
@@ -179,7 +190,8 @@ export class PerspectiveView extends DOMWidgetView {
     }
 
     /**
-     * When traitlets are updated in python, update the corresponding value on the front-end viewer.
+     * When traitlets are updated in python, update the corresponding value on
+     * the front-end viewer.
      */
     plugin_changed() {
         this.pWidget.plugin = this.model.get("plugin");

packages/perspective-phosphor/src/ts/widget.ts

@@ -26,7 +26,8 @@ export interface PerspectiveWidgetOptions extends PerspectiveViewerOptions {
     bindto?: HTMLElement;
     plugin_config?: PerspectiveViewerOptions;
 
-    // these shouldn't exist, PerspectiveViewerOptions should be sufficient e.g. ["row-pivots"]
+    // these shouldn't exist, PerspectiveViewerOptions should be sufficient e.g.
+    // ["row-pivots"]
     column_pivots?: string[];
     row_pivots?: string[];
     computed_columns?: {[column_name: string]: string}[];
@@ -35,8 +36,7 @@ export interface PerspectiveWidgetOptions extends PerspectiveViewerOptions {
 /**
  * Class for perspective phosphor widget.
  *
- * @class PerspectiveWidget (name)
- * TODO: document
+ * @class PerspectiveWidget (name) TODO: document
  */
 export class PerspectiveWidget extends Widget {
     constructor(name = "Perspective", options: PerspectiveWidgetOptions = {}) {
@@ -140,14 +140,14 @@ export class PerspectiveWidget extends Widget {
      *
      * @param table a `perspective.table` object.
      */
-    load(table: (TableData | Table), options?: TableOptions): void {
+    load(table: TableData | Table, options?: TableOptions): void {
         this.viewer.load(table, options);
     }
 
     /**
      * Update the viewer with new data.
-     * 
-     * @param data 
+     *
+     * @param data
      */
     _update(data: TableData): void {
         this.viewer.update(data);
@@ -161,9 +161,9 @@ export class PerspectiveWidget extends Widget {
     }
 
     /**
-     * Replaces the data of the viewer's table with new data. New data must conform
-     * to the schema of the Table.
-     * 
+     * Replaces the data of the viewer's table with new data. New data must
+     * conform to the schema of the Table.
+     *
      * @param data
      */
     replace(data: TableData): void {
@@ -174,13 +174,14 @@ export class PerspectiveWidget extends Widget {
      * Deletes this element's data and clears it's internal state (but not its
      * user state). This (or the underlying `perspective.table`'s equivalent
      * method) must be called in order for its memory to be reclaimed.
-     * 
-     * If not running in client mode, delete_table defaults to false and the server should
-     * handle memory cleanup.
      *
-     * @param {boolean} delete_table Whether `delete()` should be called on the underlying `Table`.
+     * If not running in client mode, delete_table defaults to false and the
+     * server should handle memory cleanup.
+     *
+     * @param {boolean} delete_table Whether `delete()` should be called on the
+     * underlying `Table`.
      */
-    delete(delete_table: boolean = true) {
+    delete(delete_table = true) {
         this.viewer.delete(delete_table || this.client);
     }
 
@@ -301,7 +302,8 @@ export class PerspectiveWidget extends Widget {
     }
 
     /**
-     * True if the widget is in client-only mode, i.e. the browser has ownership of the widget's data.
+     * True if the widget is in client-only mode, i.e. the browser has ownership
+     * of the widget's data.
      */
     get client(): boolean {
         return this._client;
@@ -375,7 +377,7 @@ export class PerspectiveWidget extends Widget {
             console.warn("Warning: not bound to real element");
         } else {
             const resize_observer = new MutationObserver(viewer.notifyResize.bind(viewer));
-            resize_observer.observe(node, { attributes: true });
+            resize_observer.observe(node, {attributes: true});
         }
         return viewer;
     }

packages/perspective-viewer-d3fc/src/js/axis/chartFactory.js

@@ -111,7 +111,8 @@ const chartFactory = (xAxis, yAxis, cartesian, canvas) => {
                         .call(yAxisComponent);
                 });
 
-            // Render all the series using either the primary or alternate y-scales
+            // Render all the series using either the primary or alternate
+            // y-scales
             if (canvas) {
                 const drawMultiCanvasSeries = selection => {
                     const canvasPlotArea = chart.plotArea();

packages/perspective-viewer-d3fc/src/js/axis/ordinalAxis.js

@@ -98,12 +98,14 @@ export const component = settings => {
         };
     };
 
-    const pickAxis = multiLevel => {
-        if (multiLevel) {
-            return orient === "horizontal" ? multiAxisBottom : multiAxisLeft;
-        }
-        return orient === "horizontal" ? fc.axisOrdinalBottom : fc.axisOrdinalLeft;
-    };
+    // const pickAxis = multiLevel => {
+    //     if (multiLevel) {
+    //         return orient === "horizontal" ?
+    //                multiAxisBottom : multiAxisLeft;
+    //     }
+    //     return orient === "horizontal" ?
+    //                 fc.axisOrdinalBottom : fc.axisOrdinalLeft;
+    // };
 
     const getAxisSet = multiLevel => {
         if (multiLevel) {

packages/perspective-viewer-d3fc/src/js/axis/splitterLabels.js

@@ -10,7 +10,8 @@ import * as fc from "d3fc";
 import {getChartElement} from "../plugin/root";
 import {withoutOpacity} from "../series/seriesColors.js";
 
-// Render a set of labels with the little left/right arrows for moving between axes
+// Render a set of labels with the little left/right arrows for moving
+// between axes
 export const splitterLabels = settings => {
     let labels = [];
     let alt = false;

packages/perspective-viewer-d3fc/src/js/charts/area.js

@@ -74,7 +74,8 @@ function areaChart(container, settings) {
         // Create the y-axis data for the alt-axis
         const yAxis2 = yAxisFactory(splitter.altData());
         chart.altAxis(yAxis2);
-        // Give the tooltip the information (i.e. 2 datasets with different scales)
+        // Give the tooltip the information (i.e. 2 datasets with different
+        // scales)
         toolTip.data(splitter.data()).altDataWithScale({yScale: yAxis2.scale, data: splitter.altData()});
     }
 

packages/perspective-viewer-d3fc/src/js/charts/line.js

@@ -80,7 +80,8 @@ function lineChart(container, settings) {
         // Create the y-axis data for the alt-axis
         const yAxis2 = yAxisFactory(splitter.altData());
         chart.altAxis(yAxis2);
-        // Give the tooltip the information (i.e. 2 datasets with different scales)
+        // Give the tooltip the information (i.e. 2 datasets with different
+        // scales)
         toolTip.data(splitter.data()).altDataWithScale({yScale: yAxis2.scale, data: splitter.altData()});
     }
 

packages/perspective-viewer-d3fc/src/js/charts/sunburst.js

@@ -22,7 +22,10 @@ function sunburst(container, settings) {
     }
 
     const data = treeData(settings);
-    const color = treeColor(settings, data.map(d => d.extents));
+    const color = treeColor(
+        settings,
+        data.map(d => d.extents)
+    );
     const sunburstGrid = gridLayoutMultiChart().elementsPrefix("sunburst");
 
     container.datum(data).call(sunburstGrid);

packages/perspective-viewer-d3fc/src/js/charts/treemap.js

@@ -23,7 +23,10 @@ function treemap(container, settings) {
     if (!settings.treemaps) settings.treemaps = {};
 
     const data = treeData(settings);
-    const color = treeColor(settings, data.map(d => d.data));
+    const color = treeColor(
+        settings,
+        data.map(d => d.data)
+    );
     const treemapGrid = gridLayoutMultiChart().elementsPrefix("treemap");
 
     container.datum(data).call(treemapGrid);

packages/perspective-viewer-d3fc/src/js/charts/y-scatter.js

@@ -80,7 +80,8 @@ function yScatter(container, settings) {
         // Create the y-axis data for the alt-axis
         const yAxis2 = yAxisFactory(splitter.altData());
         chart.altAxis(yAxis2);
-        // Give the tooltip the information (i.e. 2 datasets with different scales)
+        // Give the tooltip the information (i.e. 2 datasets with different
+        // scales)
         toolTip.data(splitter.data()).altDataWithScale({yScale: yAxis2.scale, data: splitter.altData()});
     }
 

packages/perspective-viewer-d3fc/src/js/d3fc/axis/multi-axis.js

@@ -39,7 +39,12 @@ const multiAxis = (orient, baseAxis, scale) => {
 
             // add the domain line
             const range = scale.range();
-            const domainPathData = pathTranspose([[range[0], sign * tickSizeOuter], [range[0], 0], [range[1], 0], [range[1], sign * tickSizeOuter]]);
+            const domainPathData = pathTranspose([
+                [range[0], sign * tickSizeOuter],
+                [range[0], 0],
+                [range[1], 0],
+                [range[1], sign * tickSizeOuter]
+            ]);
 
             const domainLine = domainPathDataJoin(container, [data]);
             domainLine