Strict null handling

package.json

@@ -14,21 +14,20 @@
     "d3-selection": "^3.0.0",
     "d3-shape": "^3.2.0",
     "powerbi-visuals-api": "~3.6.0",
-    "powerbi-visuals-utils-dataviewutils": "^2.2.1"
+    "powerbi-visuals-utils-dataviewutils": "^6.0.1"
   },
   "devDependencies": {
     "@types/d3-array": "^3.0.5",
     "@types/d3-axis": "^3.0.2",
     "@types/d3-scale": "^4.0.3",
     "@types/d3-selection": "^3.0.5",
     "@types/d3-shape": "^3.1.1",
-    "@typescript-eslint/eslint-plugin": "^5.59.8",
-    "@typescript-eslint/parser": "^5.59.8",
-    "eslint": "^8.41.0",
+    "@typescript-eslint/eslint-plugin": "^6.2.0",
+    "@typescript-eslint/parser": "^6.2.0",
+    "eslint": "^8.45.0",
     "eslint-plugin-powerbi-visuals": "^0.8.1",
-    "process": "^0.11.10",
-    "ts-loader": "9.4.2",
-    "typescript": "3.6.3"
+    "ts-loader": "9.4.4",
+    "typescript": "5.1.6"
   },
   "override": {
     "powerbi-visuals-api": "$powerbi-visuals-api"

src/Classes/controlLimitsClass.ts

@@ -8,13 +8,14 @@ import checkFlagDirection from "../Functions/checkFlagDirection"
 import truncate from "../Functions/truncate";
 import { truncateInputs } from "../Functions/truncate";
 import { multiply } from "../Functions/BinaryFunctions";
+import isNotNullOrUndefined from "../Functions/isNotNullOrUndefined";
 
 type controlLimitsArgs = {
   inputSettings: settingsClass,
   keys: { x: number, id: number, label: string }[];
   values: number[];
-  numerators?: number[];
-  denominators?: number[];
+  numerators?: number[] | undefined;
+  denominators?: number[] | undefined;
   targets: number[];
   ll99: number[];
   ll95: number[];
@@ -30,7 +31,7 @@ export default class controlLimitsClass {
   numerators?: number[];
   denominators?: number[];
   targets: number[];
-  alt_targets?: number[];
+  alt_targets: number[];
   ll99: number[];
   ll95: number[];
   ul95: number[];
@@ -86,30 +87,32 @@ export default class controlLimitsClass {
     }
   }
 
-  constructor(args: controlLimitsArgs) {
-    this.keys = args.keys;
-    this.values = args.values;
-    if (args.numerators || !(args.numerators === null || args.numerators === undefined)) {
-      this.numerators = args.numerators;
-    }
-    if (args.denominators || !(args.denominators === null || args.denominators === undefined)) {
-      this.denominators = args.denominators;
-    }
-    this.targets = args.targets;
-    this.alt_targets = rep(args.inputSettings.spc.alt_target, args.values.length)
-    this.ll99 = args.ll99;
-    this.ll95 = args.ll95;
-    this.ul95 = args.ul95;
-    this.ul99 = args.ul99;
-    this.astpoint = rep("none", args.values.length);
-    this.trend = rep("none", args.values.length);
-    this.two_in_three = rep("none", args.values.length);
-    this.shift = rep("none", args.values.length);
-    if (args.count || !(args.count === null || args.count === undefined)) {
-      this.count = args.count;
-    }
+  constructor(args?: controlLimitsArgs) {
+    if (args) {
+      this.keys = args.keys;
+      this.values = args.values;
+      if (isNotNullOrUndefined(args.numerators)) {
+        this.numerators = args.numerators;
+      }
+      if (isNotNullOrUndefined(args.denominators)) {
+        this.denominators = args.denominators;
+      }
+      this.targets = args.targets;
+      this.alt_targets = rep(args.inputSettings.spc.alt_target, args.values.length)
+      this.ll99 = args.ll99;
+      this.ll95 = args.ll95;
+      this.ul95 = args.ul95;
+      this.ul99 = args.ul99;
+      this.astpoint = rep("none", args.values.length);
+      this.trend = rep("none", args.values.length);
+      this.two_in_three = rep("none", args.values.length);
+      this.shift = rep("none", args.values.length);
+      if (args.count || !(args.count === null || args.count === undefined)) {
+        this.count = args.count;
+      }
 
-    this.scaleAndTruncateLimits(args.inputSettings)
-    this.flagOutliers(args.inputSettings)
+      this.scaleAndTruncateLimits(args.inputSettings)
+      this.flagOutliers(args.inputSettings)
+    }
   }
 }

src/Classes/dataClass.ts

@@ -22,44 +22,48 @@ export default class dataClass {
   scatter_formatting: defaultSettingsType["scatter"][];
   tooltips: VisualTooltipDataItem[][];
 
-  constructor(inputView: DataViewCategorical, inputSettings: settingsClass) {
-    const numerators: number[] = extractDataColumn<number[]>(inputView, "numerators", inputSettings);
-    const denominators: number[] = extractDataColumn<number[]>(inputView, "denominators", inputSettings);
-    const xbar_sds: number[] = extractDataColumn<number[]>(inputView, "xbar_sds", inputSettings);
-    const keys: string[] = extractDataColumn<string[]>(inputView, "key", inputSettings);
-    const scatter_cond = extractConditionalFormatting(inputView, "scatter", inputSettings) as defaultSettingsType["scatter"][];
-    const tooltips = extractDataColumn<VisualTooltipDataItem[][]>(inputView, "tooltips", inputSettings);
+  constructor(inputView?: DataViewCategorical, inputSettings?: settingsClass) {
+    if (inputView && inputSettings) {
+      const numerators: number[] = extractDataColumn<number[]>(inputView, "numerators", inputSettings);
+      const denominators: number[] = extractDataColumn<number[]>(inputView, "denominators", inputSettings);
+      const xbar_sds: number[] = extractDataColumn<number[]>(inputView, "xbar_sds", inputSettings);
+      const keys: string[] = extractDataColumn<string[]>(inputView, "key", inputSettings);
+      const scatter_cond = extractConditionalFormatting(inputView, "scatter", inputSettings) as defaultSettingsType["scatter"][];
+      const tooltips = extractDataColumn<VisualTooltipDataItem[][]>(inputView, "tooltips", inputSettings);
 
-    const valid_ids: number[] = new Array<number>();
-    const valid_keys: { x: number, id: number, label: string }[] = new Array<{ x: number, id: number, label: string }>();
+      const valid_ids: number[] = new Array<number>();
+      const valid_keys: { x: number, id: number, label: string }[] = new Array<{ x: number, id: number, label: string }>();
 
-    for (let i: number = 0; i < numerators.length; i++) {
-      if (checkValidInput(numerators[i],
-                          denominators ? denominators[i] : null,
-                          xbar_sds ? xbar_sds[i] : null, inputSettings.spc.chart_type)) {
-        valid_ids.push(i);
-        valid_keys.push({ x: null, id: i, label: keys[i] })
+      let validCount: number = 0
+      for (let i: number = 0; i < numerators.length; i++) {
+        if (checkValidInput(numerators[i],
+                            denominators ? denominators[i] : null,
+                            xbar_sds ? xbar_sds[i] : null, inputSettings.spc.chart_type)) {
+          valid_ids.push(i);
+          valid_keys.push({ x: validCount, id: i, label: keys[i] })
+          validCount += 1;
+        }
+      }
+
+      let percent_labels: boolean;
+      if (inputSettings.spc.perc_labels === "Automatic") {
+        percent_labels = ["p", "pp"].includes(inputSettings.spc.chart_type) && (inputSettings.spc.multiplier === 1 || inputSettings.spc.multiplier === 100);
+      } else {
+        percent_labels = inputSettings.spc.perc_labels === "Yes";
       }
-    }
 
-    valid_keys.forEach((d, idx) => { d.x = idx });
+      const inputValues = (inputView.values as powerbi.DataViewValueColumns)[0];
 
-    let percent_labels: boolean;
-    if (inputSettings.spc.perc_labels === "Automatic") {
-      percent_labels = ["p", "pp"].includes(inputSettings.spc.chart_type) && (inputSettings.spc.multiplier === 1 || inputSettings.spc.multiplier === 100);
-    } else {
-      percent_labels = inputSettings.spc.perc_labels === "Yes";
+      this.keys = valid_keys;
+      this.numerators = extractValues(numerators, valid_ids);
+      this.denominators = extractValues(denominators, valid_ids);
+      this.xbar_sds = extractValues(xbar_sds, valid_ids);
+      this.tooltips = extractValues(tooltips, valid_ids);
+      this.highlights = inputValues.highlights ? extractValues(inputValues.highlights, valid_ids) : new Array<PrimitiveValue>;
+      this.anyHighlights = (this.highlights.length > 0)
+      this.categories = (inputView.categories as powerbi.DataViewCategoryColumn[])[0];
+      this.percentLabels = percent_labels;
+      this.scatter_formatting = extractValues(scatter_cond, valid_ids);
     }
-
-    this.keys = valid_keys;
-    this.numerators = extractValues(numerators, valid_ids);
-    this.denominators = extractValues(denominators, valid_ids);
-    this.xbar_sds = extractValues(xbar_sds, valid_ids);
-    this.tooltips = extractValues(tooltips, valid_ids);
-    this.highlights = inputView.values[0].highlights ? extractValues(inputView.values[0].highlights, valid_ids) : inputView.values[0].highlights;
-    this.anyHighlights = this.highlights ? true : false
-    this.categories = inputView.categories[0];
-    this.percentLabels = percent_labels;
-    this.scatter_formatting = extractValues(scatter_cond, valid_ids);
   }
 }

src/Classes/plotPropertiesClass.ts

@@ -6,6 +6,7 @@ import { plotData } from "./viewModelClass"
 import settingsClass from "./settingsClass";
 import dataClass from "./dataClass";
 import controlLimitsClass from "./controlLimitsClass";
+import isNotNullOrUndefined from "../Functions/isNotNullOrUndefined";
 
 export type axisProperties = {
   lower: number,
@@ -52,35 +53,38 @@ export default class plotPropertiesClass {
                       plotPoints: plotData[],
                       controlLimits: controlLimitsClass,
                       inputData: dataClass,
-                      inputSettings: settingsClass }): void {
+                      inputSettings: settingsClass,
+                    invalidDataView: boolean }): void {
 
     // Get the width and height of plotting space
     this.width = args.options.viewport.width;
     this.height = args.options.viewport.height;
 
     this.displayPlot = args.plotPoints
       ? args.plotPoints.length > 1
-      : null;
+      : false;
 
     const xLowerLimit: number = args.inputSettings.x_axis.xlimit_l;
     let xUpperLimit: number = args.inputSettings.x_axis.xlimit_u;
     let yLowerLimit: number = args.inputSettings.y_axis.ylimit_l;
     let yUpperLimit: number = args.inputSettings.y_axis.ylimit_u;
 
     // Only update data-/settings-dependent plot aesthetics if they have changed
-    if (args.inputData && args.controlLimits) {
-      xUpperLimit = xUpperLimit !== null ? xUpperLimit : d3.max(args.controlLimits.keys.map(d => d.x))
+    if (!args.invalidDataView) {
+      xUpperLimit = isNotNullOrUndefined(xUpperLimit)
+                      ? xUpperLimit
+                      : d3.max(args.controlLimits.keys.map(d => d.x));
 
       const limitMultiplier: number = args.inputSettings.y_axis.limit_multiplier;
       const chart_type: string = args.inputSettings.spc.chart_type;
       const values: number[] = args.controlLimits.values;
       const ul99: number[] = args.controlLimits.ul99;
       const ll99: number[] = args.controlLimits.ll99;
       const alt_targets: number[] = args.controlLimits.alt_targets;
-      const maxValueOrLimit: number = d3.max(values.concat(ul99).concat(alt_targets));
-      const minValueOrLimit: number = d3.min(values.concat(ll99).concat(alt_targets));
-      const maxTarget: number = d3.max(args.controlLimits.targets);
-      const minTarget: number = d3.min(args.controlLimits.targets);
+      const maxValueOrLimit: number = d3.max((values.concat(ul99).concat(alt_targets)));
+      const minValueOrLimit: number = d3.min((values.concat(ll99).concat(alt_targets)));
+      const maxTarget: number = d3.max((args.controlLimits.targets));
+      const minTarget: number = d3.min((args.controlLimits.targets));
 
       const upperLimitRaw: number = maxTarget + (maxValueOrLimit - maxTarget) * limitMultiplier;
       const lowerLimitRaw: number = minTarget - (minTarget - minValueOrLimit) * limitMultiplier;

src/Classes/settingsClass.ts

@@ -1,6 +1,5 @@
 import powerbi from "powerbi-visuals-api";
 import DataView = powerbi.DataView;
-import DataViewCategorical = powerbi.DataViewCategorical;
 import DataViewPropertyValue = powerbi.DataViewPropertyValue
 import VisualObjectInstanceEnumerationObject = powerbi.VisualObjectInstanceEnumerationObject;
 import VisualEnumerationInstanceKinds = powerbi.VisualEnumerationInstanceKinds;
@@ -10,6 +9,7 @@ import { dataViewWildcard } from "powerbi-visuals-utils-dataviewutils";
 import extractConditionalFormatting from "../Functions/extractConditionalFormatting";
 import defaultSettings from "../defaultSettings"
 import { defaultSettingsType, defaultSettingsKey, settingsPaneGroupings } from "../defaultSettings";
+import isNotNullOrUndefined from "../Functions/isNotNullOrUndefined";
 
 /**
  * This is the core class which controls the initialisation and
@@ -40,13 +40,19 @@ export default class settingsClass implements defaultSettingsType {
     const allSettingGroups: string[] = Object.getOwnPropertyNames(this);
 
     allSettingGroups.forEach(settingGroup => {
-      const categoricalView: DataViewCategorical = inputView.categorical ? inputView.categorical : null;
-      const condFormatting: defaultSettingsType[defaultSettingsKey] = extractConditionalFormatting(categoricalView, settingGroup, this)[0];
+      let condFormatting: defaultSettingsType[defaultSettingsKey] | undefined;
+      if (isNotNullOrUndefined(inputView.categorical)) {
+        if (isNotNullOrUndefined(inputView.categorical.categories)) {
+          condFormatting = extractConditionalFormatting(inputView.categorical, settingGroup, this)[0];
+        }
+      }
       // Get the names of all settings in a given class and
       // use those to extract and update the relevant values
       const settingNames: string[] = Object.getOwnPropertyNames(this[settingGroup]);
       settingNames.forEach(settingName => {
-        this[settingGroup][settingName] = condFormatting ? condFormatting[settingName] : defaultSettings[settingGroup][settingName]
+        this[settingGroup][settingName] = isNotNullOrUndefined(condFormatting)
+                                            ? (condFormatting as defaultSettingsType[defaultSettingsKey])[settingName]
+                                            : defaultSettings[settingGroup][settingName]
       })
     })
   }

src/Classes/viewModelClass.ts

@@ -18,7 +18,7 @@ import * as limitFunctions from "../Limit Calculations"
 
 export class lineData {
   x: number;
-  line_value: number;
+  line_value: number | null;
   group: string;
 }
 
@@ -46,23 +46,31 @@ export default class viewModelClass {
   firstRun: boolean;
   limitFunction: (inputData: dataClass, inputSettings: settingsClass) => controlLimitsClass;
 
+  constructor() {
+    this.inputData = new dataClass();
+    this.inputSettings = new settingsClass();
+    this.plotPoints = new Array<plotData>();
+    this.groupedLines = new Array<[string, lineData[]]>();
+    this.plotProperties = new plotPropertiesClass();
+    this.plotProperties.firstRun = true;
+    this.firstRun = true
+    this.splitIndexes = new Array<number>();
+  }
+
   update(options: VisualUpdateOptions, host: IVisualHost) {
-    if (this.firstRun) {
-      this.inputSettings = new settingsClass();
-    }
     const dv: powerbi.DataView[] = options.dataViews;
     this.inputSettings.update(dv[0]);
 
-    const split_indexes_storage: DataViewObject = dv[0].metadata.objects ? dv[0].metadata.objects.split_indexes_storage : null;
-    const split_indexes: DataViewPropertyValue = split_indexes_storage ? split_indexes_storage.split_indexes : null;
+    const split_indexes_storage: DataViewObject | null = dv[0].metadata.objects ? dv[0].metadata.objects.split_indexes_storage : null;
+    const split_indexes: DataViewPropertyValue | null = split_indexes_storage ? split_indexes_storage.split_indexes : null;
     this.splitIndexes = split_indexes ? JSON.parse(<string>(split_indexes)) : new Array<number>();
 
+    const invalidDataView: boolean = checkInvalidDataView(dv);
     // Make sure that the construction returns early with null members so
     // that the visual does not crash when trying to process invalid data
-    if (checkInvalidDataView(dv)) {
-      this.inputData = <dataClass>null;
-      this.limitFunction = null;
-      this.controlLimits = null;
+    if (invalidDataView) {
+      this.inputData = new dataClass();
+      this.controlLimits = new controlLimitsClass();
       this.plotPoints = new Array<plotData>();
       this.groupedLines = new Array<[string, lineData[]]>();
       this.splitIndexes = new Array<number>();
@@ -85,16 +93,13 @@ export default class viewModelClass {
         this.initialiseGroupedLines();
       }
     }
-    if (this.firstRun) {
-      this.plotProperties = new plotPropertiesClass();
-      this.plotProperties.firstRun = true;
-    }
     this.plotProperties.update({
       options: options,
       plotPoints: this.plotPoints,
       controlLimits: this.controlLimits,
       inputData: this.inputData,
-      inputSettings: this.inputSettings
+      inputSettings: this.inputSettings,
+      invalidDataView: invalidDataView
     })
     this.firstRun = false;
   }
@@ -167,7 +172,7 @@ export default class viewModelClass {
                       .withCategory(this.inputData.categories,
                                     this.inputData.keys[i].id)
                       .createSelectionId(),
-        highlighted: this.inputData.highlights ? (this.inputData.highlights[index] ? true : false) : false,
+        highlighted: this.inputData.anyHighlights ? (this.inputData.highlights[index] ? true : false) : false,
         tooltip: buildTooltip(i, this.controlLimits, this.inputData, this.inputSettings)
       })
       this.tickLabels.push({x: index, label: this.controlLimits.keys[i].label});
@@ -200,16 +205,4 @@ export default class viewModelClass {
     }
     this.groupedLines = d3.groups(formattedLines, d => d.group);
   }
-
-  constructor() {
-    this.inputData = <dataClass>null;
-    this.inputSettings = <settingsClass>null;
-    this.limitFunction = null;
-    this.controlLimits = null;
-    this.plotPoints = new Array<plotData>();
-    this.groupedLines = new Array<[string, lineData[]]>();
-    this.plotProperties = <plotPropertiesClass>null;
-    this.firstRun = true
-    this.splitIndexes = new Array<number>();
-  }
 }

src/D3 Plotting Functions/Assurance Icons/consistentFail.ts

@@ -1,4 +1,4 @@
-import { svgBaseType } from "../../visual"
+import { iconSelection } from "../drawIcons"
 
 /**
  * Inline function to be called by D3 for rendering the Assurance - Fail icon.
@@ -9,7 +9,7 @@ import { svgBaseType } from "../../visual"
  *
  * @param selection The D3 parent object to which the icon's SVG code will be added
  */
-export default function consistentFail(selection: svgBaseType): void {
+export default function consistentFail(selection: iconSelection): void {
   selection.append("g")
             .attr("clip-path","url(#clip2)")
             .append("g")