fix: lint command in JS adapters to use current directory, correct li…

…nt errors in templates (#947)

CHANGELOG.md

@@ -5,6 +5,10 @@
 	## __WORK IN PROGRESS__
 	(at the beginning of a new line )
 -->
+## __WORK IN PROGRESS__
+* (AlCalzone) Fix `lint` command for JS adapters · [Migration guide](docs/updates/20220908_fix_lint_command.md)
+* (Apollon77 & AlCalzone) Add disclaimer about use of names and logos to README (#957)
+
 ## 2.2.0 (2022-08-27)
 * (AlCalzone) Test Node 18, drop Node 12 from testing (#909)
 * (AlCalzone) Remove deprecated unit tests (#908) · [Migration guide](docs/updates/20220506_remove_unit_tests.md)
@@ -17,7 +21,6 @@
 * (Steiger04 & AlCalzone) Fix reactivity in VIS widget (#848)
 * (AlCalzone) Fix: Offer `Prettier` for JS adapters too (#945)
 * (AlCalzone) Remove non-functioning david-dm badge from README (#946)
-* (Apollon77 & AlCalzone) Add disclaimer about use of names and logos to README (#957)
 * (klein0r & AlCalzone) Add GitHub Actions to Dependabot config, reduce pull request limit (#948) · [Migration guide](docs/updates/20220824_dependabot_gh_actions.md)
 * (AlCalzone & klein0r) Enable syntax help for JSON Config in VSCode (#959) · [Migration guide](docs/updates/20220827_jsonconfig_vscode.md)
 * (AlCalzone & klein0r) Fix `tsconfig.json` generation in `admin` directory (#960)

docs/updates/20220908_fix_lint_command.md

@@ -0,0 +1,21 @@
+# Fixed `lint` command for JS adapters
+
+The `lint` command for JS adapters was incorrectly defined and did nothing. To fix this, open `package.json` and look for the `"lint"` script.
+
+Apply this change
+
+```diff
+-    "lint": "eslint",
++    "lint": "eslint .",
+```
+
+or this change
+
+```diff
+-    "lint": "eslint --ext .js,.jsx",
++    "lint": "eslint --ext .js,.jsx .",
+```
+
+If the script is defined differently, there should be no need to change it.
+
+**Note:** You will have to fix a couple of linting errors after doing this. Some can be automatically fixed, some require configuration changes that are too complex to describe here. If you are unable to fix some, try re-creating your adapter with the newest creator version and then copy your code over.

src/lib/tools.test.ts

@@ -91,6 +91,30 @@ fn2("'");
 
 		expect(jsFixQuotes(original, "double")).to.equal(expected);
 	});
+
+	it("should support modules (React)", () => {
+		const original = `import { foo } from "bar";
+foo("bar");
+`;
+
+		const expected = `import { foo } from 'bar';
+foo('bar');
+`;
+
+		expect(jsFixQuotes(original, "single")).to.equal(expected);
+	});
+
+	it("should support CommonJS", () => {
+		const original = `const { foo } = require("bar");
+foo("bar");
+`;
+
+		const expected = `const { foo } = require('bar');
+foo('bar');
+`;
+
+		expect(jsFixQuotes(original, "single")).to.equal(expected);
+	});
 });
 
 describe("tools/tsFixQuotes()", () => {

src/lib/tools.ts

@@ -271,6 +271,7 @@ function createESLintOptions(
 			ecmaFeatures: {
 				jsx: true,
 			},
+			sourceType: "module",
 		},
 		rules: {
 			quotes: [
@@ -285,10 +286,6 @@ function createESLintOptions(
 	};
 	if (language === "TypeScript") {
 		baseOptions.parser = "@typescript-eslint/parser";
-		baseOptions.parserOptions = {
-			...baseOptions.parserOptions,
-			sourceType: "module",
-		};
 	}
 	return baseOptions;
 }

templates/_eslintrc_javascript.json.ts

@@ -43,6 +43,13 @@ const templateFunction: TemplateFunction = answers => {
 			}
 		],
 		"no-console": "off",
+		"no-unused-vars": [
+			"error",
+			{
+				"ignoreRestSiblings": true,
+				"argsIgnorePattern": "^_",
+			}
+		],
 		"no-var": "error",
 		"no-trailing-spaces": "error",
 		"prefer-const": "error",

templates/admin/_eslintrc_js_react.json.ts

@@ -0,0 +1,29 @@
+import type { TemplateFunction } from "../../src/lib/createAdapter";
+
+const templateFunction: TemplateFunction = answers => {
+
+	const useTypeScript = answers.language === "TypeScript";
+	const useReact =
+		answers.adminUi === "react" || answers.tabReact === "yes";
+	if (useTypeScript || !useReact) return;
+
+	const template = `
+{
+	"env": {
+		"browser": true,
+		"es6": true
+	},
+	"parserOptions": {
+		"sourceType": "module",
+		"project": "./tsconfig.json"
+	},
+	"rules": {
+		"react/prop-types": "off"
+	}
+}
+`;
+	return template.trim();
+};
+
+templateFunction.customPath = "admin/.eslintrc.json";
+export = templateFunction;

templates/admin/src/app.tsx_jsx.ts

@@ -20,7 +20,7 @@ ${useTypeScript ?
 `const styles = (_theme: Theme): StyleRules => ({
 	root: {},
 });` : `/**
- * @type {(_theme: Theme) => import("@material-ui/styles").StyleRules}
+ * @type {(_theme: import("@material-ui/core/styles").Theme) => import("@material-ui/styles").StyleRules}
  */
 const styles = (_theme) => ({
 	root: {},

templates/admin/src/components/settings.tsx_jsx.ts

@@ -160,7 +160,7 @@ ${useTypeScript ? "" : `/**
 	}
 
 	${useTypeScript ? `renderCheckbox(title: AdminWord, attr: string, style?: React.CSSProperties)` : `/**
-	 * @param {string} AdminWord
+	 * @param {AdminWord} title
 	 * @param {string} attr
 	 * @param {React.CSSProperties} [style]
 	 */

templates/admin/words.js.ts

@@ -29,7 +29,9 @@ export = (async answers => {
 	}
 
 	const template = `
-/*global systemDictionary:true */${
+/* eslint no-unused-vars: off */
+/* eslint no-global-assign: off */
+/* global systemDictionary */${
 jsonI18n ? `
 /*
 +===================== DO NOT MODIFY ======================+

templates/index.ts

@@ -26,6 +26,7 @@ const templates: { name: string, templateFunction: TemplateFunction }[] = [
 	{ name: "_prettierrc.js.ts", templateFunction: require("./_prettierrc.js") },
 	{ name: "_vscode/extensions.json.ts", templateFunction: require("./_vscode/extensions.json") },
 	{ name: "_vscode/settings.json.ts", templateFunction: require("./_vscode/settings.json") },
+	{ name: "admin/_eslintrc_js_react.json.ts", templateFunction: require("./admin/_eslintrc_js_react.json") },
 	{ name: "admin/admin.d.ts.ts", templateFunction: require("./admin/admin.d.ts") },
 	{ name: "admin/custom_m.html.ts", templateFunction: require("./admin/custom_m.html") },
 	{ name: "admin/i18n/de/translations.json.ts", templateFunction: require("./admin/i18n/de/translations.json") },
@@ -72,6 +73,7 @@ const templates: { name: string, templateFunction: TemplateFunction }[] = [
 	{ name: "src/main.es6.ts", templateFunction: require("./src/main.es6") },
 	{ name: "src/main.test.ts.ts", templateFunction: require("./src/main.test.ts") },
 	{ name: "src/main.ts.ts", templateFunction: require("./src/main.ts") },
+	{ name: "test/_eslintrc.json.ts", templateFunction: require("./test/_eslintrc.json") },
 	{ name: "test/integration.js.ts", templateFunction: require("./test/integration.js") },
 	{ name: "test/mocha.setup.js.ts", templateFunction: require("./test/mocha.setup.js") },
 	{ name: "test/mocharc.custom.ts", templateFunction: require("./test/mocharc.custom") },
@@ -80,6 +82,7 @@ const templates: { name: string, templateFunction: TemplateFunction }[] = [
 	{ name: "tsconfig.build.json.ts", templateFunction: require("./tsconfig.build.json") },
 	{ name: "tsconfig.check.json.ts", templateFunction: require("./tsconfig.check.json") },
 	{ name: "tsconfig.json.ts", templateFunction: require("./tsconfig.json") },
+	{ name: "widgets/_eslintrc.json.ts", templateFunction: require("./widgets/_eslintrc.json") },
 	{ name: "widgets/style.css.ts", templateFunction: require("./widgets/style.css") },
 	{ name: "widgets/template.html.ts", templateFunction: require("./widgets/template.html") },
 	{ name: "widgets/template.js.ts", templateFunction: require("./widgets/template.js") },

templates/package.json.ts

@@ -129,11 +129,16 @@ const templateFunction: TemplateFunction = async answers => {
 		...(isAdapter ? [
 			// Web files in the admin root and all subdirectories except src/
 			"admin{,/!(src)/**}/*.{html,css,png,svg,jpg,js}",
-			// JSON files, but not tsconfig.*.json
-			"admin{,/!(src)/**}/!(tsconfig|tsconfig.*).json"
+			// JSON files, but not tsconfig.*.json or .eslintrc.json
+			"admin{,/!(src)/**}/!(tsconfig|tsconfig.*|.eslintrc).json"
 		] : []),
 		...(isAdapter && useReact ? ["admin/build/"] : []),
-		...(isWidget ? ["widgets/"] : [])
+		...(isWidget ? [
+			// Web files in the widgets folder
+			"widgets/**/*.{html,css,png,svg,jpg,js}",
+			// JSON files, but not tsconfig.*.json or .eslintrc.json
+			"widgets/**/!(tsconfig|tsconfig.*|.eslintrc).json"
+		] : [])
 	].sort((a, b) => {
 		// Put directories on top
 		const isDirA = a.includes("/");
@@ -195,7 +200,7 @@ const templateFunction: TemplateFunction = async answers => {
 			if (useTypeScript) {
 				npmScripts["lint"] = `eslint --ext .ts${useReact ? ",.tsx" : ""} src/${useReact ? " admin/src/" : ""}`;
 			} else {
-				npmScripts["lint"] = `eslint${useReact ? " --ext .js,.jsx" : ""}`;
+				npmScripts["lint"] = `eslint${useReact ? " --ext .js,.jsx" : ""} .`;
 			}
 		}
 	} else if (isWidget) {

templates/test/_eslintrc.json.ts

@@ -0,0 +1,60 @@
+import * as JSON5 from "json5";
+import type { TemplateFunction } from "../../src/lib/createAdapter";
+
+const templateFunction: TemplateFunction = answers => {
+
+	// This version is intended to make ESLint happy with the JS tests in TS adapters
+	if (answers.language !== "TypeScript") return;
+	const useESLint = answers.tools && answers.tools.indexOf("ESLint") > -1;
+	if (!useESLint) return;
+
+	const template = `
+{
+	"root": true,
+	"env": {
+		"es6": true,
+		"node": true,
+		"mocha": true
+	},
+	"extends": [
+		"eslint:recommended"
+	],
+	"rules": {
+		"indent": [
+			"error",
+			${answers.indentation === "Tab" ? `"tab"` : "4"},
+			{
+				"SwitchCase": 1
+			}
+		],
+		"no-console": "off",
+		"no-unused-vars": [
+			"error",
+			{
+				"ignoreRestSiblings": true,
+				"argsIgnorePattern": "^_",
+			}
+		],
+		"no-var": "error",
+		"no-trailing-spaces": "error",
+		"prefer-const": "error",
+		"quotes": [
+			"error",
+			"${typeof answers.quotes === "string" ? answers.quotes : "double"}",
+			{
+				"avoidEscape": true,
+				"allowTemplateLiterals": true
+			}
+		],
+		"semi": [
+			"error",
+			"always"
+		]
+	}
+}
+`;
+	return JSON.stringify(JSON5.parse(template), null, 4);
+};
+
+templateFunction.customPath = "test/.eslintrc.json";
+export = templateFunction;

templates/tsconfig.json.ts

@@ -66,7 +66,8 @@ export = (answers => {
 	"include": [${include}
 	],
 	"exclude": [${exclude}
-		"node_modules/**"
+		"node_modules/**",
+		"widgets/**"
 	]
 }`;
 	return template.trim();

templates/widgets/_eslintrc.json.ts

@@ -0,0 +1,33 @@
+import type { TemplateFunction } from "../../src/lib/createAdapter";
+
+const templateFunction: TemplateFunction = answers => {
+
+	const isWidget = answers.features.indexOf("vis") > -1;
+	if (!isWidget) return;
+
+	const template = `
+{
+	"env": {
+		"browser": true,
+		"es6": false
+	},
+	"rules": {
+		// Visualizations may run in very old browsers without \`let\` and \`const\`
+		"no-var": "off",
+		// The example code does not use some parameters. If unused variables should be
+		// an error, delete the following rule
+		"no-unused-vars": [
+			"warn",
+			{
+				"ignoreRestSiblings": true,
+				"argsIgnorePattern": "^_"
+			}
+		]
+	}
+}
+`;
+	return template.trim();
+};
+
+templateFunction.customPath = "widgets/.eslintrc.json";
+export = templateFunction;

templates/widgets/template.js.ts

@@ -17,6 +17,8 @@ const templateFunction: TemplateFunction = answers => {
 */
 "use strict";
 
+/* global $, vis, systemDictionary */
+
 // add translations for edit mode
 $.extend(
 	true,

test/baselines/JS_ES2015/.eslintrc.json

@@ -18,6 +18,13 @@
 			}
 		],
 		"no-console": "off",
+		"no-unused-vars": [
+			"error",
+			{
+				"ignoreRestSiblings": true,
+				"argsIgnorePattern": "^_"
+			}
+		],
 		"no-var": "error",
 		"no-trailing-spaces": "error",
 		"prefer-const": "error",

test/baselines/TS_Prettier/package.json

@@ -51,7 +51,7 @@
   },
   "main": "build/main.js",
   "files": [
-    "admin{,/!(src)/**}/!(tsconfig|tsconfig.*).json",
+    "admin{,/!(src)/**}/!(tsconfig|tsconfig.*|.eslintrc).json",
     "admin{,/!(src)/**}/*.{html,css,png,svg,jpg,js}",
     "build/",
     "www/",

test/baselines/adapter_JS_ES6Class_ESLint_TypeChecking_Spaces_SingleQuotes_Apache-2.0/.eslintrc.json

@@ -18,6 +18,13 @@
             }
         ],
         "no-console": "off",
+        "no-unused-vars": [
+            "error",
+            {
+                "ignoreRestSiblings": true,
+                "argsIgnorePattern": "^_"
+            }
+        ],
         "no-var": "error",
         "no-trailing-spaces": "error",
         "prefer-const": "error",

test/baselines/adapter_JS_ES6Class_ESLint_TypeChecking_Spaces_SingleQuotes_Apache-2.0/admin/words.js

@@ -1,4 +1,6 @@
-/*global systemDictionary:true */
+/* eslint no-unused-vars: off */
+/* eslint no-global-assign: off */
+/* global systemDictionary */
 'use strict';
 
 systemDictionary = {

test/baselines/adapter_JS_ES6Class_ESLint_TypeChecking_Spaces_SingleQuotes_Apache-2.0/package.json

@@ -43,7 +43,7 @@
   },
   "main": "main.js",
   "files": [
-    "admin{,/!(src)/**}/!(tsconfig|tsconfig.*).json",
+    "admin{,/!(src)/**}/!(tsconfig|tsconfig.*|.eslintrc).json",
     "admin{,/!(src)/**}/*.{html,css,png,svg,jpg,js}",
     "lib/",
     "www/",
@@ -57,7 +57,7 @@
     "test:integration": "mocha test/integration --exit",
     "test": "npm run test:js && npm run test:package",
     "check": "tsc --noEmit -p tsconfig.check.json",
-    "lint": "eslint",
+    "lint": "eslint .",
     "translate": "translate-adapter"
   },
   "bugs": {