Merge pull request #169 from vatro/major-eslint-aided-polish

Thanks to myself! 😁

.eslintrc.cjs

@@ -1,10 +1,33 @@
+const { rules } = require("eslint-config-prettier")
+
 module.exports = {
 	root: true,
 	parser: "@typescript-eslint/parser",
 	extends: ["eslint:recommended", "plugin:@typescript-eslint/recommended", "prettier"],
 	plugins: ["svelte3", "@typescript-eslint"],
-	ignorePatterns: ["*.cjs"],
-	overrides: [{ files: ["*.svelte"], processor: "svelte3/svelte3" }],
+
+	//(default) check *.svelte and *.ts files
+	// ignorePatterns: ["*.cjs"],
+
+	// check only *.svelte files
+	ignorePatterns: ["*.cjs", "*.ts"],
+
+	overrides: [
+		{
+			files: ["*.svelte"],
+			processor: "svelte3/svelte3",
+
+			// checking specific rules (set to "off" / "error")
+			// errors only
+			rules: {
+				"no-inferrable-types": "error",
+				"no-undef": "error",
+				"no-empty": "error",
+				"no-case-declarations": "error",
+				"no-prototype-builtins": "error"
+			}
+		}
+	],
 	settings: {
 		"svelte3/typescript": () => require("typescript")
 	},

.vscode/settings.json

@@ -1,4 +1,5 @@
 {
+	"eslint.validate": ["javascript", "svelte"],
 	"cSpell.enabled": false,
 	"editor.wordSeparators": "`~!@#%^&*()-=+[{]}\\|;:'\",.<>/?",
 	"todohighlight.keywords": [

package.json

@@ -10,6 +10,7 @@
 		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
 		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
 		"lint": "prettier --check . && eslint .",
+		"lint : quiet": "prettier --check . && eslint --quiet .",
 		"format": "prettier --write ."
 	},
 	"devDependencies": {

src/lib/$app/env/index.ts

@@ -1,3 +1,3 @@
 // Mimic SvelteKit's `$app/env` foor non-SSR outputs in RollUp only and Vite only setups.
 
-export const browser: boolean = true
+export const browser = true

src/lib/ani/SvelthreeAnimationManager.ts

@@ -3,11 +3,13 @@ import SvelthreeAnimationProp from "./SvelthreeAnimationProp"
 import { verbose_mode } from "../utils/SvelthreeLogger"
 
 export default class SvelthreeAnimationManager {
+	//  TODO  (ESLint -> 'no-explicit-any') see https://github.com/vatro/svelthree/issues/165
 	animation: SvelthreeAnimationProp | any
 	aniauto: boolean
 	obj: Object3D
 	scene: Scene
 
+	//  TODO  (ESLint -> 'no-explicit-any') see https://github.com/vatro/svelthree/issues/165
 	constructor(animation: SvelthreeAnimationProp | any, aniauto: boolean, obj: Object3D, scene: Scene | null) {
 		this.animation = animation
 		this.aniauto = aniauto
@@ -165,6 +167,7 @@ export default class SvelthreeAnimationManager {
 		return false
 	}
 
+	//  TODO  (ESLint -> 'no-explicit-any') see https://github.com/vatro/svelthree/issues/165
 	getAnimation(): any {
 		if (this.animationInitiated()) {
 			return this.animation

src/lib/ani/SvelthreeAnimationProp.ts

@@ -14,14 +14,14 @@ export default class SvelthreeAnimationProp {
 		try {
 			initiatedFn = this.fn(obj, args)
 
-			if (!initiatedFn.hasOwnProperty("onStart")) {
+			if (!Object.prototype.hasOwnProperty.call(initiatedFn, "onStart")) {
 				console.error("SVELTHREE > Provided animation is missing 'onStart' function!", {
 					animation: initiatedFn
 				})
 				//throw new Error("SVELTHREE Exception (see warning above)")
 			}
 
-			if (!initiatedFn.hasOwnProperty("onDestroy")) {
+			if (!Object.prototype.hasOwnProperty.call(initiatedFn, "onDestroy")) {
 				console.error("SVELTHREE > Provided animation has no 'onDestroy' function!", {
 					animation: initiatedFn
 				})

src/lib/components-internal/SvelthreeInteraction.svelte

@@ -13,6 +13,7 @@ This is a **svelthree** _SvelthreeInteraction_ Component.
 	import { onMount, beforeUpdate, afterUpdate, onDestroy, getContext } from "svelte"
 	import { get_current_component, SvelteComponentDev } from "svelte/internal"
 	import { Object3D, Raycaster, Vector3 } from "three"
+	import type { Intersection, Camera, Ray } from "three"
 	import { svelthreeStores } from "svelthree/stores"
 	import { c_dev, c_lc_int, verbose_mode, get_comp_name_int } from "../utils/SvelthreeLogger"
 	import type { LogLC, LogDEV } from "../utils/SvelthreeLogger"
@@ -49,7 +50,7 @@ This is a **svelthree** _SvelthreeInteraction_ Component.
 	const verbose: boolean = verbose_mode()
 
 	export let log_dev: { [P in keyof LogDEV]: LogDEV[P] } = undefined
-	//export let log_rs: boolean = false
+	//export let log_rs = false
 	export let log_lc: { [P in keyof LogLC]: LogLC[P] } = undefined
 
 	export let interactionEnabled: boolean
@@ -102,13 +103,13 @@ This is a **svelthree** _SvelthreeInteraction_ Component.
 
 	interface RaycasterData {
 		/** `intersections` are of the same form as those returned by [`.intersectObject`](https://threejs.org/docs/#api/en/core/Raycaster.intersectObject). */
-		intersection: { [P in keyof THREE.Intersection]: THREE.Intersection[P] }
+		intersection: { [P in keyof Intersection]: Intersection[P] }
 		/** Current `Raycaster` `.ray`, e.g. useful properties: `ray.origin: Vector3` | `ray.direction: Vector3`. */
-		ray: THREE.Ray
+		ray: Ray
 		/** The `Camera` used for raycasting. */
-		camera: THREE.Camera
+		camera: Camera
 		/** Current pointer position ( _'point' / Vector3 position_ ) in 3d world space. */
-		unprojected_point: THREE.Vector3
+		unprojected_point: Vector3
 	}
 
 	let raycaster_data: RaycasterData
@@ -145,7 +146,7 @@ This is a **svelthree** _SvelthreeInteraction_ Component.
 
 	export let shadow_dom_el: SvelthreeShadowDOMElement = undefined
 
-	let listeners: boolean = false
+	let listeners = false
 
 	// --- Reactively add listeners ---
 
@@ -156,7 +157,7 @@ This is a **svelthree** _SvelthreeInteraction_ Component.
 
 	// --- Pointer over / out of `<canvas>` element state ---
 
-	let out_of_canvas_triggered: boolean = false
+	let out_of_canvas_triggered = false
 
 	// pointer is out of / exited the `<canvas>` element.
 	$: if (obj.userData.interact && pointer.event && $pointer_over_canvas.status === false) {
@@ -802,21 +803,24 @@ This is a **svelthree** _SvelthreeInteraction_ Component.
 				if (cancel_or_stop_propagation_fn) cancel_or_stop_propagation_fn(e)
 
 				switch (e.type) {
-					case "pointermove":
+					case "pointermove": {
 						const queued_pointermove_event = () => dispatch_pointerevent_intersection_indep(e)
 						queued_pointer_move_events[0] = queued_pointermove_event
 						//queued_pointer_move_events[0] = () => dispatch_pointerevent_intersection_indep(e)
 						break
-					case "pointermoveover":
+					}
+					case "pointermoveover": {
 						const queued_pointermoveover_event = () => dispatch_pointerevent_intersection_indep(e)
 						queued_pointer_moveover_events[0] = queued_pointermoveover_event
 						//queued_pointer_moveover_events[0] = () => dispatch_pointerevent_intersection_indep(e)
 						break
-					default:
+					}
+					default: {
 						const queued_pointer_event = () => dispatch_pointerevent_intersection_dep(e)
 						pointer_events_queue.push(queued_pointer_event)
 						//pointer_events_queue.push(() => dispatch_pointerevent_intersection_dep(e))
 						break
+					}
 				}
 
 				break
@@ -840,7 +844,7 @@ This is a **svelthree** _SvelthreeInteraction_ Component.
 
 	/** intersection dependent -> has raycaster_data! */
 	function dispatch_pointerevent_intersection_dep(e: PointerEvent) {
-		const action_name: string = `on_${e.type}`
+		const action_name = `on_${e.type}`
 
 		const detail = {
 			e,
@@ -855,7 +859,7 @@ This is a **svelthree** _SvelthreeInteraction_ Component.
 
 	/** intersection independent -> no raycaster_data! */
 	function dispatch_pointerevent_intersection_indep(e: PointerEvent) {
-		const action_name: string = `on_${e.type}`
+		const action_name = `on_${e.type}`
 
 		const detail = {
 			e,
@@ -956,11 +960,12 @@ This is a **svelthree** _SvelthreeInteraction_ Component.
 		cancel_or_stop_propagation_fn(e)
 
 		switch (render_mode) {
-			case "always":
+			case "always": {
 				// QUEUED EVENT DISPATCHING: dispatch our custom event / execute handler on next render (raf aligned)
 				const queued_focus_event = () => dispatch_focusevent_intersection_indep(e)
 				focus_events_queue.push(queued_focus_event)
 				break
+			}
 			case "auto":
 				// IMMEDIATE EVENT DISPATCHING (not raf aligned) / any changes will schedule a new render (raf aligned)
 				dispatch_focusevent_intersection_indep(e)
@@ -972,7 +977,7 @@ This is a **svelthree** _SvelthreeInteraction_ Component.
 	}
 
 	function dispatch_focusevent_intersection_indep(e: FocusEvent) {
-		const action_name: string = `on_${e.type}`
+		const action_name = `on_${e.type}`
 
 		const detail = {
 			e,
@@ -1179,11 +1184,12 @@ This is a **svelthree** _SvelthreeInteraction_ Component.
 		}
 
 		switch (render_mode) {
-			case "always":
+			case "always": {
 				// QUEUED EVENT DISPATCHING: dispatch our custom event / execute handler on next render (raf aligned)
 				const queued_keyboard_event = () => dispatch_keyboardevent_intersection_indep(e)
 				keyboard_events_queue.push(queued_keyboard_event)
 				break
+			}
 			case "auto":
 				// IMMEDIATE EVENT DISPATCHING (not raf aligned) / any changes will schedule a new render (raf aligned)
 				dispatch_keyboardevent_intersection_indep(e)
@@ -1204,7 +1210,7 @@ This is a **svelthree** _SvelthreeInteraction_ Component.
 	}
 
 	function dispatch_keyboardevent_intersection_indep(e: KeyboardEvent) {
-		const action_name: string = `on_${e.type}`
+		const action_name = `on_${e.type}`
 
 		const detail = {
 			code: e.code,

src/lib/components/AmbientLight.svelte

@@ -50,7 +50,7 @@ AmbientLight cannot be used to cast shadows as it doesn't have a direction. Posi
 
 	const verbose: boolean = verbose_mode()
 
-	export let log_all: boolean = false
+	export let log_all = false
 	export let log_dev: { [P in keyof LogDEV]: LogDEV[P] } = log_all ? { all: true } : undefined
 	export let log_rs: boolean = log_all
 	export let log_lc: { [P in keyof LogLC]: LogLC[P] } = log_all ? { all: true } : undefined
@@ -86,8 +86,8 @@ AmbientLight cannot be used to cast shadows as it doesn't have a direction. Posi
 	/** Sets the `name` property of the created / injected three.js instance. */
 	export let name: string = undefined
 
-	export const is_svelthree_component: boolean = true
-	export const is_svelthree_light: boolean = true
+	export const is_svelthree_component = true
+	export const is_svelthree_light = true
 
 	//  ONCE  ON  INITIALIZATION  //
 
@@ -103,6 +103,7 @@ AmbientLight cannot be used to cast shadows as it doesn't have a direction. Posi
 	/** Executed when / if an instance was provided **on initializiation** -> only once if at all! */
 	function on_instance_provided(): void {
 		if (light.type === "AmbientLight") {
+			//nothing
 		} else {
 			throw new Error(
 				`SVELTHREE > ${c_name} provided 'light' instance has wrong type '${light.type}', should be '${c_name}'!`
@@ -201,6 +202,7 @@ AmbientLight cannot be used to cast shadows as it doesn't have a direction. Posi
 	}
 
 	// accessability -> shadow dom wai-aria
+	// eslint-disable-next-line no-undef
 	export let aria: Partial<ARIAMixin> = undefined
 
 	$: if (shadow_dom_el && aria !== undefined) {
@@ -284,7 +286,7 @@ AmbientLight cannot be used to cast shadows as it doesn't have a direction. Posi
 	/** Animation logic to be performed with the (three) object instance created by the component. */
 	export let animation: SvelthreeAnimationFunction = undefined
 
-	let animationEnabled: boolean = false
+	let animationEnabled = false
 	$: if (animation) animationEnabled = true
 
 	/** Immediately start provided animation, default: `false`. Alternative: `<component_reference>.start_animation()` or shorter `.start_ani()`. */

src/lib/components/Canvas.svelte

@@ -43,15 +43,15 @@ This is a **svelthree** _Canvas_ Component.
 
 	const dispatch: (type: string, detail?: any) => void = createEventDispatcher()
 
-	export let log_all: boolean = false
+	export let log_all = false
 	export let log_dev: { [P in keyof LogDEV]: LogDEV[P] } = log_all ? { all: true } : undefined
 	export let log_rs: boolean = log_all
 	export let log_lc: { [P in keyof LogLC]: LogLC[P] } = log_all ? { all: true } : undefined
 
 	// #endregion
 
-	export const is_svelthree_component: boolean = true
-	export const is_svelthree_canvas: boolean = true
+	export const is_svelthree_component = true
+	export const is_svelthree_canvas = true
 
 	// #region --- Required Attributes
 
@@ -70,7 +70,7 @@ This is a **svelthree** _Canvas_ Component.
 	export { clazz as class }
 
 	/** If `true` (_default_) the cursor will change automatically (_e.g. over/out canvas DOM element, **interactive** objects or when using the `OrbitControls` component_). */
-	export let change_cursor: boolean = true
+	export let change_cursor = true
 
 	export let interactive: boolean = undefined
 	$: if (interactive !== undefined) {
@@ -570,7 +570,7 @@ This is a **svelthree** _Canvas_ Component.
 	 * will also check all descendants of interactive objects.
 	 * - If set to `false` the interaction Raycaster will only check intersection with interactive objects.
 	 */
-	export let recursive: boolean = true
+	export let recursive = true
 
 	/** Updates the `all_intersections.result` array and changes the pointer appearance if the `change_cursor` prop is set to `true`.*/
 	function update_all_intersections_and_cursor(): void {
@@ -732,6 +732,7 @@ This is a **svelthree** _Canvas_ Component.
 	// --- Accessabilty ---
 
 	export let tabindex: number = undefined
+	// eslint-disable-next-line no-undef
 	export let aria: Partial<ARIAMixin> = undefined
 
 	$: if (c && browser) {

src/lib/components/CubeCamera.svelte

@@ -66,7 +66,7 @@ Renders a `CubeMap` which can be used with **non-PBR** materials having an `.env
 
 	const verbose: boolean = verbose_mode()
 
-	export let log_all: boolean = false
+	export let log_all = false
 	export let log_dev: { [P in keyof LogDEV]: LogDEV[P] } = log_all ? { all: true } : undefined
 	export let log_rs: boolean = log_all
 	export let log_lc: { [P in keyof LogLC]: LogLC[P] } = log_all ? { all: true } : undefined
@@ -76,9 +76,9 @@ Renders a `CubeMap` which can be used with **non-PBR** materials having an `.env
 	 * - `false` (default) -> `update_cubecam()` will be called **once on initialization**, further updates have to be done **manually** by calling `[CubeCamera component reference].update_cubecam()`.
 	 * - `true` -> WebGLRenderer component will update the CubeCamera (_renderTarget.texture_) on **every frame**.
 	 */
-	export let dynamic: boolean = false
+	export let dynamic = false
 
-	let camera_updated: boolean = false
+	let camera_updated = false
 
 	/** `CubeCamera` instances are always added to the `root_scene`
 	 * no matter which component the `CubeCamera` component was added to. */
@@ -119,7 +119,7 @@ Renders a `CubeMap` which can be used with **non-PBR** materials having an `.env
 	$: texture = browser ? camera.renderTarget.texture : undefined
 
 	/** Set to `true` for correct **floor reflections** (_default: `false`_). */
-	export let is_floor: boolean = false
+	export let is_floor = false
 
 	let scene: THREE_Scene = getContext("scene")
 	const sti: number = getContext("store_index")
@@ -156,8 +156,8 @@ Renders a `CubeMap` which can be used with **non-PBR** materials having an `.env
 	export let name: string = undefined
 	let index_in_cubecameras: number = undefined
 
-	export const is_svelthree_component: boolean = true
-	export const is_svelthree_camera: boolean = true
+	export const is_svelthree_component = true
+	export const is_svelthree_camera = true
 
 	//  ONCE  ON  INITIALIZATION  //
 
@@ -306,6 +306,7 @@ Renders a `CubeMap` which can be used with **non-PBR** materials having an `.env
 	}
 
 	// accessability -> shadow dom wai-aria
+	// eslint-disable-next-line no-undef
 	export let aria: Partial<ARIAMixin> = undefined
 
 	$: if (shadow_dom_el && aria !== undefined) {
@@ -403,7 +404,7 @@ Renders a `CubeMap` which can be used with **non-PBR** materials having an `.env
 		if (!bind_tex) {
 			let op: Mesh = bound_pos as Mesh
 			let op_mat: MaterialWithEnvMap = op.material as MaterialWithEnvMap
-			if (op_mat?.hasOwnProperty("envMap")) {
+			if (op_mat && Object.prototype.hasOwnProperty.call(op_mat, "envMap")) {
 				op_mat.envMap = camera.renderTarget.texture
 			}
 		}
@@ -602,7 +603,7 @@ Renders a `CubeMap` which can be used with **non-PBR** materials having an `.env
 	/** Animation logic to be performed with the (three) object instance created by the component. */
 	export let animation: SvelthreeAnimationFunction = undefined
 
-	let animationEnabled: boolean = false
+	let animationEnabled = false
 	$: if (animation) animationEnabled = true
 
 	/** Immediately start provided animation, default: `false`. Alternative: `<component_reference>.start_animation()` or shorter `.start_ani()`. */