fix: handle loading js-files via `extends` again

.prettierignore

@@ -17,6 +17,7 @@
 
 # will contain errors
 /test-files/**/*.html
+/tests/**/*.html
 
 # local test files
 /sites

src/config/config.spec.ts

@@ -183,9 +183,31 @@ describe("config", () => {
 	});
 
 	describe("fromFile()", () => {
-		it("should support JSON", () => {
+		const fileDir = path.resolve(__dirname, "../../test-files");
+
+		it("should support JSON file", () => {
+			expect.assertions(1);
+			const config = Config.fromFile(path.join(fileDir, "config.json"));
+			expect(Array.from(config.getRules().entries())).toEqual([
+				["foo", [Severity.ERROR, {}]],
+				["bar", [Severity.WARN, {}]],
+				["baz", [Severity.DISABLED, {}]],
+			]);
+		});
+
+		it("should support js file", () => {
+			expect.assertions(1);
+			const config = Config.fromFile(path.join(fileDir, "config.js"));
+			expect(Array.from(config.getRules().entries())).toEqual([
+				["foo", [Severity.ERROR, {}]],
+				["bar", [Severity.WARN, {}]],
+				["baz", [Severity.DISABLED, {}]],
+			]);
+		});
+
+		it("should support js file without extension", () => {
 			expect.assertions(1);
-			const config = Config.fromFile(`${process.cwd()}/test-files/config.json`);
+			const config = Config.fromFile(path.join(fileDir, "config"));
 			expect(Array.from(config.getRules().entries())).toEqual([
 				["foo", [Severity.ERROR, {}]],
 				["bar", [Severity.WARN, {}]],

src/config/config.ts

@@ -64,8 +64,12 @@ function mergeInternal(base: ConfigData, rhs: ConfigData): ConfigData {
 function loadFromFile(filename: string): ConfigData {
 	let json;
 	try {
-		const data = fs.readFileSync(filename, "utf-8");
-		json = JSON.parse(data);
+		/* remove cached copy so we always load a fresh copy, important for editors
+		 * which keep a long-running instance of [[HtmlValidate]] around. */
+		delete require.cache[require.resolve(filename)];
+
+		/* load using require as it can process both js and json */
+		json = require(filename); // eslint-disable-line import/no-dynamic-require
 	} catch (err) {
 		throw new ConfigError(
 			`Failed to read configuration from "${filename}"`,

test-files/config.js

+module.exports = {
+	rules: {
+		foo: "error",
+		bar: "warn",
+		baz: "off",
+	},
+};

tests/README.md

+# Integration tests
+
+Each folder contains a set of tests.

tests/elements-js/.htmlvalidate.json

+{
+  "elements": ["./elements.js"],
+  "rules": {
+    "deprecated": "error",
+    "no-unknown-elements": "error"
+  }
+}

tests/elements-js/README.md

+# Elements JS
+
+This test ensures `elements` in `.htmlvalidate.json` can load a javascript file.

tests/elements-js/elements-js.spec.ts

+import path from "path";
+import HtmlValidate from "../../src/htmlvalidate";
+import "../../src/matchers";
+
+it("should handle elements js file", () => {
+	expect.assertions(2);
+	const htmlvalidate = new HtmlValidate();
+	const report = htmlvalidate.validateFile(
+		path.join(__dirname, "my-file.html")
+	);
+	expect(report).toBeInvalid();
+	expect(report.results[0].messages).toMatchInlineSnapshot(`
+		Array [
+		  Object {
+		    "column": 2,
+		    "context": Object {
+		      "tagName": "my-element",
+		    },
+		    "line": 1,
+		    "message": "<my-element> is deprecated",
+		    "offset": 1,
+		    "ruleId": "deprecated",
+		    "selector": "my-element",
+		    "severity": 2,
+		    "size": 10,
+		  },
+		]
+	`);
+});

tests/elements-js/elements.js

+module.exports = {
+	"my-element": {
+		deprecated: true,
+	},
+};

tests/elements-js/my-file.html

+<my-element></my-element>

tests/elements-json/.htmlvalidate.json

+{
+  "elements": ["./elements.json"],
+  "rules": {
+    "deprecated": "error",
+    "no-unknown-elements": "error"
+  }
+}

tests/elements-json/README.md

+# Elements JS
+
+This test ensures `elements` in `.htmlvalidate.json` can load a javascript file.

tests/elements-json/elements-json.spec.ts

+import path from "path";
+import HtmlValidate from "../../src/htmlvalidate";
+import "../../src/matchers";
+
+it("should handle elements json file", () => {
+	expect.assertions(2);
+	const htmlvalidate = new HtmlValidate();
+	const report = htmlvalidate.validateFile(
+		path.join(__dirname, "my-file.html")
+	);
+	expect(report).toBeInvalid();
+	expect(report.results[0].messages).toMatchInlineSnapshot(`
+		Array [
+		  Object {
+		    "column": 2,
+		    "context": Object {
+		      "tagName": "my-element",
+		    },
+		    "line": 1,
+		    "message": "<my-element> is deprecated",
+		    "offset": 1,
+		    "ruleId": "deprecated",
+		    "selector": "my-element",
+		    "severity": 2,
+		    "size": 10,
+		  },
+		]
+	`);
+});

tests/elements-json/elements.json

+{
+  "my-element": {
+    "deprecated": true
+  }
+}

tests/elements-json/my-file.html

+<my-element></my-element>

tests/extend-js/.htmlvalidate.json

+{
+  "extends": ["./config.js"]
+}

tests/extend-js/README.md

+# Extend JS
+
+This test ensures `extend` in `.htmlvalidate.json` can load a javascript file.

tests/extend-js/config.js

+module.exports = {
+	rules: {
+		"close-order": "error",
+	},
+};

tests/extend-js/extend-js.spec.ts

+import path from "path";
+import HtmlValidate from "../../src/htmlvalidate";
+import "../../src/matchers";
+
+it("should handle extending js file", () => {
+	expect.assertions(2);
+	const htmlvalidate = new HtmlValidate();
+	const report = htmlvalidate.validateFile(
+		path.join(__dirname, "my-file.html")
+	);
+	expect(report).toBeInvalid();
+	expect(report.results[0].messages).toMatchInlineSnapshot(`
+		Array [
+		  Object {
+		    "column": 16,
+		    "context": undefined,
+		    "line": 1,
+		    "message": "Mismatched close-tag, expected '</p>' but found '</i>'.",
+		    "offset": 15,
+		    "ruleId": "close-order",
+		    "selector": null,
+		    "severity": 2,
+		    "size": 2,
+		  },
+		]
+	`);
+});

tests/extend-js/my-file.html

+<p>lorem ipsum</i>