ESLint: enable no var requires rule

visualization/.eslintrc.js

@@ -41,7 +41,6 @@ module.exports = {
 		"@typescript-eslint/explicit-function-return-type": "off",
 		"@typescript-eslint/ban-types": "off",
 		"@typescript-eslint/no-explicit-any": "off",
-		"@typescript-eslint/no-var-requires": "off",
 		"@typescript-eslint/consistent-type-assertions": "off",
 	}
 }

visualization/app/codeCharta/codeCharta.component.spec.ts

@@ -8,6 +8,8 @@ import { InjectorService } from "./state/injector.service"
 import { StoreService } from "./state/store.service"
 import { setAppSettings } from "./state/store/appSettings/appSettings.actions"
 import { ThreeCameraService } from "./ui/codeMap/threeViewer/threeCameraService"
+import sample1 from "./assets/sample1.cc.json"
+import sample2 from "./assets/sample2.cc.json"
 import { setSearchPanelMode } from "./state/store/appSettings/searchPanelMode/searchPanelMode.actions"
 import { SearchPanelMode } from "./codeCharta.model"
 
@@ -134,8 +136,8 @@ describe("codeChartaController", () => {
 
 		it("should call loadFiles with sample files", () => {
 			const expected = [
-				{ fileName: "sample1.cc.json", content: require("./assets/sample1.cc.json") },
-				{ fileName: "sample2.cc.json", content: require("./assets/sample2.cc.json") }
+				{ fileName: "sample1.cc.json", content: sample1 },
+				{ fileName: "sample2.cc.json", content: sample2 }
 			]
 
 			codeChartaController.tryLoadingSampleFiles()

visualization/app/codeCharta/codeCharta.component.ts

@@ -8,10 +8,13 @@ import { InjectorService } from "./state/injector.service"
 import { StoreService } from "./state/store.service"
 import { setAppSettings } from "./state/store/appSettings/appSettings.actions"
 import { setIsLoadingFile } from "./state/store/appSettings/isLoadingFile/isLoadingFile.actions"
-import * as codeCharta from "../../package.json"
+import packageJson from "../../package.json"
 import { setDelta, setMultiple, setSingle } from "./state/store/files/files.actions"
 import { getCCFiles } from "./model/files/files.helper"
+import sample1 from "./assets/sample1.cc.json"
+import sample2 from "./assets/sample2.cc.json"
 import { setSearchPanelMode } from "./state/store/appSettings/searchPanelMode/searchPanelMode.actions"
+import { ExportCCFile } from "./codeCharta.api.model"
 
 export class CodeChartaController {
 	private _viewModel: {
@@ -32,7 +35,7 @@ export class CodeChartaController {
 		// @ts-ignore
 		private injectorService: InjectorService // We have to inject it somewhere
 	) {
-		this._viewModel.version = codeCharta.version
+		this._viewModel.version = packageJson.version
 		this.urlUtils = new UrlExtractor(this.$location, this.$http)
 		this.storeService.dispatch(setIsLoadingFile(true))
 		this.loadFileOrSample()
@@ -61,8 +64,8 @@ export class CodeChartaController {
 			)
 		}
 		this.tryLoadingFiles([
-			{ fileName: "sample1.cc.json", content: require("./assets/sample1.cc.json") },
-			{ fileName: "sample2.cc.json", content: require("./assets/sample2.cc.json") }
+			{ fileName: "sample1.cc.json", content: sample1 as ExportCCFile },
+			{ fileName: "sample2.cc.json", content: sample2 as ExportCCFile }
 		])
 	}
 

visualization/app/codeCharta/e2e/logo.e2e.ts

@@ -1,5 +1,8 @@
 import { goto } from "../../puppeteer.helper"
 import { LogoPageObject } from "./logo.po"
+import packageJson from "../../../package.json"
+
+jest.setTimeout(20000)
 
 describe("CodeCharta logo", () => {
 	let logo: LogoPageObject
@@ -11,7 +14,7 @@ describe("CodeCharta logo", () => {
 	})
 
 	it("should have correct version", async () => {
-		expect(await logo.getVersion()).toBe(require("../../../package.json").version)
+		expect(await logo.getVersion()).toBe(packageJson.version)
 	})
 
 	it("should have correct link", async () => {

visualization/app/codeCharta/e2e/url.e2e.ts

@@ -1,6 +1,10 @@
 import { CC_URL, goto } from "../../puppeteer.helper"
 import { DialogErrorPageObject } from "../ui/dialog/dialog.error.po"
 import { FilePanelPageObject } from "../ui/filePanel/filePanel.po"
+import sample1 from "../assets/sample3.cc.json"
+import sample3 from "../assets/sample3.cc.json"
+
+jest.setTimeout(15000)
 
 describe("codecharta", () => {
 	let dialogError: DialogErrorPageObject
@@ -37,13 +41,13 @@ describe("codecharta", () => {
 				request.respond({
 					contentType: "application/json",
 					headers: { "Access-Control-Allow-Origin": "*" },
-					body: JSON.stringify(require("../assets/sample2.cc.json"))
+					body: JSON.stringify(sample1)
 				})
 			} else if (request.url().includes("/fileTwo.json")) {
 				request.respond({
 					contentType: "application/json",
 					headers: { "Access-Control-Allow-Origin": "*" },
-					body: JSON.stringify(require("../assets/sample3.cc.json"))
+					body: JSON.stringify(sample3)
 				})
 			} else {
 				request.continue()

visualization/app/codeCharta/state/store/dynamicSettings/colorRange/colorRange.reducer.ts

@@ -1,6 +1,6 @@
 import { ColorRangeAction, ColorRangeActions, setColorRange } from "./colorRange.actions"
 import { ColorRange } from "../../../../codeCharta.model"
-const clone = require("rfdc")()
+import { clone } from "../../../../util/clone"
 
 export function colorRange(state: ColorRange = setColorRange().payload, action: ColorRangeAction): ColorRange {
 	switch (action.type) {

visualization/app/codeCharta/state/store/fileSettings/attributeTypes/attributeTypes.reducer.ts

@@ -1,6 +1,6 @@
 import { AttributeTypesAction, AttributeTypesActions, setAttributeTypes, UpdateAttributeTypeAction } from "./attributeTypes.actions"
 import { AttributeTypes } from "../../../../codeCharta.model"
-const clone = require("rfdc")()
+import { clone } from "../../../../util/clone"
 
 export function attributeTypes(state: AttributeTypes = setAttributeTypes().payload, action: AttributeTypesAction): AttributeTypes {
 	switch (action.type) {

visualization/app/codeCharta/state/store/fileSettings/blacklist/blacklist.reducer.ts

@@ -1,7 +1,7 @@
 import { BlacklistItem } from "../../../../codeCharta.model"
 import { BlacklistAction, BlacklistActions, setBlacklist } from "./blacklist.actions"
 import { addItemToArray, removeItemFromArray } from "../../../../util/reduxHelper"
-const clone = require("rfdc")()
+import { clone } from "../../../../util/clone"
 
 export function blacklist(state: BlacklistItem[] = setBlacklist().payload, action: BlacklistAction): BlacklistItem[] {
 	switch (action.type) {

visualization/app/codeCharta/state/store/fileSettings/edges/edges.reducer.ts

@@ -1,7 +1,7 @@
 import { EdgesAction, EdgesActions, setEdges } from "./edges.actions"
 import { Edge } from "../../../../codeCharta.model"
 import { addItemToArray, removeItemFromArray } from "../../../../util/reduxHelper"
-const clone = require("rfdc")()
+import { clone } from "../../../../util/clone"
 
 export function edges(state: Edge[] = setEdges().payload, action: EdgesAction): Edge[] {
 	switch (action.type) {

visualization/app/codeCharta/state/store/fileSettings/markedPackages/markedPackages.reducer.ts

@@ -1,7 +1,7 @@
 import { MarkedPackagesAction, MarkedPackagesActions, setMarkedPackages } from "./markedPackages.actions"
 import { MarkedPackage } from "../../../../codeCharta.model"
 import { addItemToArray, removeItemFromArray } from "../../../../util/reduxHelper"
-const clone = require("rfdc")()
+import { clone } from "../../../../util/clone"
 
 export function markedPackages(state: MarkedPackage[] = setMarkedPackages().payload, action: MarkedPackagesAction): MarkedPackage[] {
 	switch (action.type) {

visualization/app/codeCharta/state/store/files/files.reducer.ts

@@ -1,8 +1,7 @@
 import { FilesAction, FilesSelectionActions, NewFilesImportedActions, setFiles } from "./files.actions"
 import { CCFile } from "../../../codeCharta.model"
 import { FileSelectionState, FileState } from "../../../model/files/files"
-
-const clone = require("rfdc")()
+import { clone } from "../../../util/clone"
 
 export default function files(state: FileState[] = setFiles().payload, action: FilesAction): FileState[] {
 	switch (action.type) {

visualization/app/codeCharta/ui/codeMap/codeMap.preRender.service.ts

@@ -22,7 +22,7 @@ import { SortingOptionActions } from "../../state/store/dynamicSettings/sortingO
 import { IsAttributeSideBarVisibleActions } from "../../state/store/appSettings/isAttributeSideBarVisible/isAttributeSideBarVisible.actions"
 import { fileStatesAvailable, getVisibleFileStates, isDeltaState, isPartialState, isSingleState } from "../../model/files/files.helper"
 import { FileSelectionState, FileState } from "../../model/files/files"
-const clone = require("rfdc")()
+import { clone } from "../../util/clone"
 
 export interface CodeMapPreRenderServiceSubscriber {
 	onRenderMapChanged(map: CodeMapNode)

visualization/app/codeCharta/ui/codeMap/threeViewer/threeOrbitControlsService.ts

@@ -10,6 +10,8 @@ import {
 } from "../../../state/store/dynamicSettings/focusedNodePath/focusedNodePath.service"
 import { FilesService, FilesSelectionSubscriber } from "../../../state/store/files/files.service"
 import { setCameraTarget } from "../../../state/store/appSettings/cameraTarget/cameraTarget.actions"
+import * as Three from "three"
+import oc from "three-orbit-controls"
 
 export interface CameraChangeSubscriber {
 	onCameraChanged(camera: PerspectiveCamera)
@@ -126,7 +128,7 @@ export class ThreeOrbitControlsService implements FocusNodeSubscriber, UnfocusNo
 	}
 
 	public init(domElement) {
-		const OrbitControls = require("three-orbit-controls")(require("three"))
+		const OrbitControls = oc(Three)
 		this.controls = new OrbitControls(this.threeCameraService.camera, domElement)
 		this.controls.addEventListener("change", () => {
 			this.onInput(this.threeCameraService.camera)

visualization/app/codeCharta/ui/fileChooser/fileChooser.component.ts

@@ -11,6 +11,7 @@ import { CodeChartaService } from "../../codeCharta.service"
 import { NameDataPair } from "../../codeCharta.model"
 import { StoreService } from "../../state/store.service"
 import { setIsLoadingFile } from "../../state/store/appSettings/isLoadingFile/isLoadingFile.actions"
+import zlib from "zlib"
 
 export class FileChooserController {
 	private files: NameDataPair[] = []
@@ -39,9 +40,7 @@ export class FileChooserController {
 
 				reader.onload = event => {
 					if (isCompressed) {
-						const zlib = require("zlib")
-
-						content = zlib.unzipSync(Buffer.from(event.target.result))
+						content = zlib.unzipSync(Buffer.from((<any>event.target).result))
 					} else {
 						content = event.target.result
 					}

visualization/app/codeCharta/ui/mapTreeView/mapTreeView.component.ts

@@ -8,8 +8,7 @@ import {
 } from "../../state/store/appSettings/sortingOrderAscending/sortingOrderAscending.service"
 import { SortingOptionService, SortingOptionSubscriber } from "../../state/store/dynamicSettings/sortingOption/sortingOption.service"
 import { MetricService } from "../../state/metric.service"
-
-const clone = require("rfdc")()
+import { clone } from "../../util/clone"
 
 export class MapTreeViewController implements CodeMapPreRenderServiceSubscriber, SortingOptionSubscriber, SortingOrderAscendingSubscriber {
 	private _viewModel: {

visualization/app/codeCharta/util/aggregationGenerator.ts

@@ -2,6 +2,7 @@ import { CodeMapNode, CCFile, NodeType } from "../codeCharta.model"
 import { CodeChartaService } from "../codeCharta.service"
 import { FileNameHelper } from "./fileNameHelper"
 import { getUpdatedPath } from "./nodePathHelper"
+import packageJson from "../../../package.json"
 
 export class AggregationGenerator {
 	private static projectNameArray: string[] = []
@@ -26,7 +27,7 @@ export class AggregationGenerator {
 			fileMeta: {
 				projectName: "project_aggregation_of_" + this.projectNameArray.join("_and_"),
 				fileName: "file_aggregation_of_" + this.fileNameArray.join("_and_"),
-				apiVersion: require("../../../package.json").codecharta.apiVersion
+				apiVersion: packageJson.codecharta.apiVersion
 			},
 			map: {
 				name: CodeChartaService.ROOT_NAME,

visualization/app/codeCharta/util/clone.spec.ts

@@ -0,0 +1,13 @@
+import { clone } from "./clone"
+
+describe("clone", () => {
+	it("should clone a javascript object", () => {
+		const object = { x: 1, y: 2 }
+
+		const actual = clone(object)
+
+		expect(actual).toEqual(object)
+		object.x = 2
+		expect(actual).not.toEqual(object)
+	})
+})

visualization/app/codeCharta/util/clone.ts

@@ -0,0 +1,5 @@
+import rfdc from "rfdc"
+
+export function clone(content: any): any {
+	return rfdc()(content)
+}

visualization/app/codeCharta/util/deltaGenerator.ts

@@ -3,6 +3,7 @@ import { CodeMapNode, CCFile, KeyValuePair, FileMeta } from "../codeCharta.model
 import _ from "lodash"
 import { MapBuilder } from "./mapBuilder"
 import { FileNameHelper } from "./fileNameHelper"
+import packageJson from "../../../package.json"
 
 export class DeltaGenerator {
 	public static getDeltaFile(referenceFile: CCFile, comparisonFile: CCFile): CCFile {
@@ -83,7 +84,7 @@ export class DeltaGenerator {
 				FileNameHelper.withoutCCJsonExtension(referenceFile.fileMeta.fileName) +
 				"_and_" +
 				FileNameHelper.withoutCCJsonExtension(comparisonFile.fileMeta.fileName),
-			apiVersion: require("../../../package.json").codecharta.apiVersion,
+			apiVersion: packageJson.codecharta.apiVersion,
 			projectName: "delta_between_" + referenceFile.fileMeta.projectName + "_and_" + comparisonFile.fileMeta.projectName
 		}
 	}

visualization/app/codeCharta/util/fileDownloader.ts

@@ -5,7 +5,7 @@ import { DownloadCheckboxNames } from "../ui/dialog/dialog.download.component"
 import { CodeChartaService } from "../codeCharta.service"
 import { ExportCCFile } from "../codeCharta.api.model"
 import { MetricService } from "../state/metric.service"
-const clone = require("rfdc")()
+import { clone } from "./clone"
 
 export class FileDownloader {
 	public static downloadCurrentMap(

visualization/app/codeCharta/util/fileValidator.spec.ts

@@ -6,6 +6,7 @@ import {
 	TEST_FILE_CONTENT_NO_API
 } from "./dataMocks"
 import { NodeType } from "../codeCharta.model"
+import packageJson from "../../../package.json"
 import { CCValidationResult, ERROR_MESSAGES, validate } from "./fileValidator"
 import assert from "assert"
 
@@ -18,7 +19,7 @@ describe("FileValidator", () => {
 	})
 
 	it("API version exists in package.json", () => {
-		expect(require("../../../package.json").codecharta.apiVersion).toEqual("1.1")
+		expect(packageJson.codecharta.apiVersion).toEqual("1.1")
 	})
 
 	it("should throw on null", () => {

visualization/app/codeCharta/util/fileValidator.ts

@@ -1,10 +1,11 @@
 import { CodeMapNode } from "../codeCharta.model"
 import Ajv from "ajv"
+import packageJson from "../../../package.json"
 import { ExportCCFile } from "../codeCharta.api.model"
 import _ from "lodash"
+import jsonSchema from "./generatedSchema.json"
 
-const jsonSchema = require("./generatedSchema.json")
-const latestApiVersion = require("../../../package.json").codecharta.apiVersion
+const latestApiVersion = packageJson.codecharta.apiVersion
 
 interface ApiVersion {
 	major: number

visualization/app/codeCharta/util/reduxHelper.ts

@@ -1,7 +1,6 @@
+import { clone } from "./clone"
 import _ from "lodash"
 
-const clone = require("rfdc")()
-
 export function removeItemFromArray(array: any[], item: any): any[] {
 	return array.filter(x => {
 		return !_.isEqual(x, item)

visualization/app/codeCharta/util/scenarioHelper.spec.ts

@@ -4,10 +4,11 @@ import { PARTIAL_SETTINGS, SCENARIO, SCENARIO_WITH_ONLY_HEIGHT } from "./dataMoc
 import { Vector3 } from "three"
 import { ScenarioMetricType } from "../ui/dialog/dialog.addScenarioSettings.component"
 import { ScenarioItem } from "../ui/scenarioDropDown/scenarioDropDown.component"
+import scenarioJson from "../assets/scenarios.json"
 import { ExportScenario } from "../codeCharta.api.model"
 
 describe("scenarioHelper", () => {
-	const scenarios: ExportScenario[] = require("../assets/scenarios.json")
+	const scenarios: ExportScenario[] = scenarioJson
 
 	afterEach(() => {
 		jest.resetAllMocks()

visualization/app/codeCharta/util/scenarioHelper.ts

@@ -3,6 +3,7 @@ import { AppSettings, CCLocalStorage, DynamicSettings, MetricData, RecursivePart
 import { convertToVectors } from "./settingsHelper"
 import { AddScenarioContent, ScenarioMetricType } from "../ui/dialog/dialog.addScenarioSettings.component"
 import { ScenarioItem } from "../ui/scenarioDropDown/scenarioDropDown.component"
+import scenarios from "../assets/scenarios.json"
 import { ExportScenario } from "../codeCharta.api.model"
 
 export class ScenarioHelper {
@@ -64,7 +65,7 @@ export class ScenarioHelper {
 	}
 
 	private static getPreLoadScenarios(): Map<String, RecursivePartial<Scenario>> {
-		const scenariosAsSettings: ExportScenario[] = this.importScenarios(require("../assets/scenarios.json"))
+		const scenariosAsSettings: ExportScenario[] = this.importScenarios(scenarios)
 		const scenario: Map<String, RecursivePartial<Scenario>> = new Map<String, RecursivePartial<Scenario>>()
 		scenariosAsSettings.forEach(scenarioSettings => {
 			scenario.set(scenarioSettings.name, this.transformScenarioAsSettingsToScenario(scenarioSettings))

visualization/app/puppeteer.helper.ts

@@ -1,6 +1,5 @@
 import * as path from "path"
 
-export const puppeteer = require("puppeteer")
 export const CC_URL = `file:${path.join(__dirname, "../dist/webpack/index.html")}`
 
 export async function goto(url: string = CC_URL): Promise<void> {

visualization/plop/templates/redux/reducer.ts.hbs

@@ -1,5 +1,5 @@
 import { {{properCase name}}Action, {{properCase name}}Actions, set{{properCase name}} } from "./{{camelCase name}}.actions"
-const clone = require("rfdc")()
+import { clone } from "../../../util/clone"
 
 export function {{camelCase name}}(state: {{type}} = set{{properCase name}}().payload, action: {{properCase name}}Action): {{type}} {
 	switch (action.type) {