feat: support plain HTML files (not served)

fixes #2

.eslintignore

@@ -1,5 +0,0 @@
-build
-node_modules
-coverage
-package.json
-package-lock.json

.eslintrc.json

@@ -1,6 +1,6 @@
 {
-  "extends": ["standard-with-typescript", "prettier"],
+  "extends": ["conventions", "prettier"],
-  "plugins": ["unicorn", "import", "prettier"],
+  "plugins": ["prettier", "import", "unicorn"],
   "parserOptions": {
     "project": "./tsconfig.json"
   },
@@ -10,12 +10,7 @@
   },
   "rules": {
     "prettier/prettier": "error",
-    "import/order": [
-      "error",
-      { "groups": ["builtin", "external", "internal"] }
-    ],
     "import/extensions": ["error", "always"],
-    "unicorn/prefer-node-protocol": "error",
     "unicorn/prevent-abbreviations": "error"
   }
 }

.gitattributes

@@ -0,0 +1 @@
+* text=auto eol=lf

.github/workflows/build.yml

@@ -2,7 +2,7 @@ name: 'Build'
 
 on:
   push:
-    branches: [master, develop]
+    branches: [develop]
   pull_request:
     branches: [master, develop]
 
@@ -15,7 +15,7 @@ jobs:
       - name: 'Use Node.js'
         uses: 'actions/setup-node@v2.5.1'
         with:
-          node-version: '16.x'
+          node-version: 'lts/*'
           cache: 'npm'
 
       - name: 'Install'

.github/workflows/lint.yml

@@ -2,7 +2,7 @@ name: 'Lint'
 
 on:
   push:
-    branches: [master, develop]
+    branches: [develop]
   pull_request:
     branches: [master, develop]
 
@@ -15,23 +15,14 @@ jobs:
       - name: 'Use Node.js'
         uses: 'actions/setup-node@v2.5.1'
         with:
-          node-version: '16.x'
+          node-version: 'lts/*'
           cache: 'npm'
 
       - name: 'Install'
         run: 'npm install'
 
-      - name: 'lint:commit'
+      - run: 'npm run lint:commit -- --to "${{ github.sha }}"'
-        run: 'npm run lint:commit -- --to "${{ github.sha }}"'
+      - run: 'npm run lint:editorconfig'
-
+      - run: 'npm run lint:markdown'
-      - name: 'lint:editorconfig'
+      - run: 'npm run lint:typescript'
-        run: 'npm run lint:editorconfig'
+      - run: 'npm run lint:prettier'
-
-      - name: 'lint:markdown'
-        run: 'npm run lint:markdown'
-
-      - name: 'lint:typescript'
-        run: 'npm run lint:typescript'
-
-      - name: 'lint:prettier'
-        run: 'npm run lint:prettier'

.github/workflows/release.yml

@@ -16,7 +16,7 @@ jobs:
       - name: 'Use Node.js'
         uses: 'actions/setup-node@v2.5.1'
         with:
-          node-version: '16.x'
+          node-version: 'lts/*'
           cache: 'npm'
 
       - name: 'Install'

.github/workflows/test.yml

@@ -2,7 +2,7 @@ name: 'Test'
 
 on:
   push:
-    branches: [master, develop]
+    branches: [develop]
   pull_request:
     branches: [master, develop]
 
@@ -15,7 +15,7 @@ jobs:
       - name: 'Use Node.js'
         uses: 'actions/setup-node@v2.5.1'
         with:
-          node-version: '16.x'
+          node-version: 'lts/*'
           cache: 'npm'
 
       - name: 'Install'

.lintstagedrc.json

@@ -6,5 +6,5 @@
     "jest --findRelatedTests"
   ],
   "*.{yml,json}": ["prettier --write"],
-  "*.{md}": ["prettier --write", "markdownlint --dot --fix"]
+  "*.md": ["prettier --write", "markdownlint --dot --fix"]
 }

.npmrc

@@ -1,2 +1 @@
 save-exact=true
-engine-strict=true

.prettierignore

@@ -1,5 +0,0 @@
-/build
-node_modules
-coverage
-package.json
-package-lock.json

.vscode/settings.json

@@ -1,33 +1,10 @@
 {
   "typescript.tsdk": "node_modules/typescript/lib",
   "typescript.preferences.importModuleSpecifierEnding": "js",
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
   "prettier.configPath": ".prettierrc.json",
   "editor.formatOnSave": true,
   "editor.codeActionsOnSave": {
     "source.fixAll": true
-  },
-  "[markdown]": {
-    "editor.autoClosingBrackets": "always",
-    "editor.defaultFormatter": "esbenp.prettier-vscode"
-  },
-  "[yaml]": {
-    "editor.autoClosingBrackets": "always",
-    "editor.defaultFormatter": "esbenp.prettier-vscode"
-  },
-  "[json]": {
-    "editor.autoClosingBrackets": "always",
-    "editor.defaultFormatter": "esbenp.prettier-vscode"
-  },
-  "[jsonc]": {
-    "editor.autoClosingBrackets": "always",
-    "editor.defaultFormatter": "esbenp.prettier-vscode"
-  },
-  "[typescript]": {
-    "editor.autoClosingBrackets": "always",
-    "editor.defaultFormatter": "esbenp.prettier-vscode"
-  },
-  "[javascript]": {
-    "editor.autoClosingBrackets": "always",
-    "editor.defaultFormatter": "esbenp.prettier-vscode"
   }
 }

README.md

@@ -24,7 +24,7 @@
 
 **html-w3c-validator** is a CLI tool to validate multiple html pages using [validator.w3.org](https://validator.w3.org/).
 
-You might use a JavaScript framework or simply use HTML: **you should validate your production HTML** and this validation should be part of your CI/CD pipeline (tests, linting, etc.).
+You might use a JavaScript framework or simply use HTML but **you should always validate your production HTML** and this validation should be part of your CI/CD pipeline (tests, linting, etc.).
 
 ### Why should I validate my HTML pages?
 
@@ -56,19 +56,22 @@ npm install --save-dev html-w3c-validator start-server-and-test
 {
   "scripts": {
     // Command to start the server serving your HTML pages (e.g: using vercel/serve)
-    "start": "serve ./build",
+    "start": "serve \"./build\"",
 
     // Command to validate your HTML pages
-    "test:html-w3c-validator": "start-server-and-test 'start' 'http://localhost:3000' 'html-w3c-validator'"
+    "test:html-w3c-validator": "start-server-and-test \"start\" \"http://localhost:3000\" \"html-w3c-validator\""
   }
 }
 ```
 
 ### `.html-w3c-validatorrc.json`
 
-```json
+```jsonc
 {
-  "urls": ["http://localhost:3000/", "http://localhost:3000/about"]
+  "urls": ["http://localhost:3000/", "http://localhost:3000/about"],
+
+  // You can also specify HTML files instead of URLs
+  "files": ["./index.html", "./about.html"]
 }
 ```
 

example/.html-w3c-validatorrc.json

@@ -1,3 +1,4 @@
 {
-  "urls": ["http://localhost:3000/", "http://localhost:3000/about"]
+  "urls": ["http://localhost:3000/", "http://localhost:3000/about"],
+  "files": ["./build/index.html", "./build/about.html"]
 }

example/package.json

@@ -2,8 +2,8 @@
   "name": "example",
   "private": true,
   "scripts": {
-    "start": "serve ./build",
+    "start": "serve \"./build\"",
-    "test:html-w3c-validator": "start-server-and-test 'start' 'http://localhost:3000' 'html-w3c-validator'"
+    "test:html-w3c-validator": "start-server-and-test \"start\" \"http://localhost:3000\" \"html-w3c-validator\""
   },
   "devDependencies": {
     "serve": "13.0.2",

package.json

@@ -1,6 +1,7 @@
 {
   "name": "html-w3c-validator",
   "version": "0.0.0-development",
+  "public": true,
   "description": "CLI for validating multiple html pages using validator.w3.org.",
   "author": "Divlo <contact@divlo.fr>",
   "license": "MIT",
@@ -31,9 +32,9 @@
     "build": "rimraf ./build && swc ./src --out-dir ./build && tsc",
     "lint:commit": "commitlint",
     "lint:editorconfig": "editorconfig-checker",
-    "lint:markdown": "markdownlint '**/*.md' --dot --ignore node_modules",
+    "lint:markdown": "markdownlint \"**/*.md\" --dot --ignore-path \".gitignore\"",
-    "lint:typescript": "eslint '**/*.{js,ts,jsx,tsx}'",
+    "lint:typescript": "eslint \"**/*.{js,jsx,ts,tsx}\" --ignore-path \".gitignore\"",
-    "lint:prettier": "prettier '.' --check",
+    "lint:prettier": "prettier \".\" --check --ignore-path \".gitignore\"",
     "lint:staged": "lint-staged",
     "test": "jest",
     "release": "semantic-release",
@@ -50,38 +51,37 @@
     "table": "6.8.0"
   },
   "devDependencies": {
-    "@commitlint/cli": "16.0.1",
+    "@commitlint/cli": "16.2.1",
-    "@commitlint/config-conventional": "16.0.0",
+    "@commitlint/config-conventional": "16.2.1",
     "@swc/cli": "0.1.55",
-    "@swc/core": "1.2.127",
+    "@swc/core": "1.2.144",
-    "@swc/jest": "0.2.15",
+    "@swc/jest": "0.2.17",
     "@types/html-validator": "5.0.2",
-    "@types/jest": "27.4.0",
+    "@types/jest": "27.4.1",
     "@types/mock-fs": "4.13.1",
-    "@types/node": "17.0.8",
+    "@types/node": "17.0.21",
+    "@typescript-eslint/eslint-plugin": "5.12.1",
     "editorconfig-checker": "4.0.2",
-    "eslint": "7.32.0",
+    "eslint": "8.9.0",
-    "eslint-config-prettier": "8.3.0",
+    "eslint-config-conventions": "1.1.0",
-    "eslint-config-standard-with-typescript": "21.0.1",
+    "eslint-config-prettier": "8.4.0",
     "eslint-plugin-import": "2.25.4",
-    "eslint-plugin-node": "11.1.0",
     "eslint-plugin-prettier": "4.0.0",
-    "eslint-plugin-promise": "5.1.1",
+    "eslint-plugin-promise": "6.0.0",
-    "eslint-plugin-unicorn": "40.0.0",
+    "eslint-plugin-unicorn": "41.0.0",
     "execa": "5.1.1",
     "husky": "7.0.4",
-    "jest": "27.4.7",
+    "jest": "27.5.1",
     "jest-mock-extended": "2.0.4",
     "jest-ts-webcompat-resolver": "1.0.0",
-    "lint-staged": "12.1.5",
+    "lint-staged": "12.3.4",
-    "markdownlint-cli": "0.30.0",
+    "markdownlint-cli": "0.31.1",
     "mock-fs": "5.1.2",
-    "npm": "8.3.0",
+    "pinst": "3.0.0",
-    "pinst": "2.1.6",
     "prettier": "2.5.1",
     "rimraf": "3.0.2",
-    "semantic-release": "18.0.1",
+    "semantic-release": "19.0.2",
     "serve": "13.0.2",
-    "typescript": "4.5.4"
+    "typescript": "4.5.5"
   }
 }

src/HTMLValidatorCommand.ts

@@ -4,7 +4,10 @@ import fs from 'node:fs'
 import { Command } from 'clipanion'
 import chalk from 'chalk'
 import ora from 'ora'
-import validateHTML, { ValidationMessageLocationObject } from 'html-validator'
+import validateHTML, {
+  ValidationMessageLocationObject,
+  ParsedJsonAsValidationResults
+} from 'html-validator'
 import { table } from 'table'
 
 import { isExistingPath } from './utils/isExistingPath.js'
@@ -13,11 +16,12 @@ const CURRENT_DIRECTORY = process.cwd()
 const CONFIG_FILE_NAME = '.html-w3c-validatorrc.json'
 
 interface Config {
-  urls: string[]
+  urls?: string[]
+  files?: string[]
 }
 
 interface Error {
-  url: string
+  data: string
   messagesTable: string[][]
 }
 
@@ -39,59 +43,104 @@ export class HTMLValidatorCommand extends Command {
       const configData = await fs.promises.readFile(configPath, {
         encoding: 'utf-8'
       })
-      let config: Config = { urls: [] }
+      let config: Config = { urls: [], files: [] }
       let isValidConfig = true
       try {
         config = JSON.parse(configData)
       } catch {
         isValidConfig = false
       }
-      isValidConfig = isValidConfig && Array.isArray(config.urls)
+      isValidConfig =
+        isValidConfig &&
+        (Array.isArray(config.urls) || Array.isArray(config.urls))
       if (!isValidConfig) {
         throw new Error(
           `Invalid config file at ${configPath}. Please check the syntax.`
         )
       }
-
+      const urls =
+        config.urls == null
+          ? []
+          : config.urls.map((url) => {
+              return { type: 'url', data: url }
+            })
+      const files =
+        config.files == null
+          ? []
+          : config.files.map((file) => {
+              return { type: 'file', data: file }
+            })
+      const dataToValidate = [...urls, ...files]
       const errors: Error[] = []
       let isValid = true
-      for (const url of config.urls) {
+      for (const { data, type } of dataToValidate) {
-        const loader = ora(`Validating ${url}`).start()
+        const loader = ora(`Validating ${data}`).start()
-        const result = await validateHTML({
+        try {
-          url,
+          const options = {
-          format: 'json',
+            format: 'json' as 'json' | undefined
-          isLocal: true
+          }
-        })
+          let result: ParsedJsonAsValidationResults | undefined
-        const isValidHTML = result.messages.length === 0
+          if (type === 'url') {
-        if (isValidHTML) {
+            result = await validateHTML({
-          loader.succeed()
+              url: data,
-        } else {
+              isLocal: true,
-          loader.fail()
+              ...options
-          const messagesTable: string[][] = []
+            })
-          for (const message of result.messages) {
+          } else if (type === 'file') {
-            const row: string[] = []
+            const htmlPath = path.resolve(CURRENT_DIRECTORY, data)
-            if (message.type === 'error') {
+            if (!(await isExistingPath(htmlPath))) {
-              row.push(chalk.red(message.type))
+              throw new Error(
-            } else {
+                `No file found at ${htmlPath}. Please check the path.`
-              row.push(chalk.yellow(message.type))
-            }
-            row.push(message.message)
-            const violation = message as ValidationMessageLocationObject
-            if (violation.extract != null) {
-              row.push(
-                `line: ${violation.lastLine}, column: ${violation.firstColumn}-${violation.lastColumn}`
               )
             }
-            messagesTable.push(row)
+            const html = await fs.promises.readFile(htmlPath, {
+              encoding: 'utf-8'
+            })
+            result = await validateHTML({
+              data: html,
+              ...options
+            })
+          } else {
+            throw new Error('Invalid type')
           }
-          errors.push({ url, messagesTable })
+          const isValidHTML = result.messages.length === 0
+          if (isValidHTML) {
+            loader.succeed()
+          } else {
+            loader.fail()
+            const messagesTable: string[][] = []
+            for (const message of result.messages) {
+              const row: string[] = []
+              if (message.type === 'error') {
+                row.push(chalk.red(message.type))
+              } else {
+                row.push(chalk.yellow(message.type))
+              }
+              row.push(message.message)
+              const violation = message as ValidationMessageLocationObject
+              if (violation.extract != null) {
+                row.push(
+                  `line: ${violation.lastLine}, column: ${violation.firstColumn}-${violation.lastColumn}`
+                )
+              }
+              messagesTable.push(row)
+            }
+            errors.push({ data, messagesTable })
+            isValid = false
+          }
+        } catch (error) {
+          loader.fail()
           isValid = false
+          if (error instanceof Error) {
+            const messagesTable: string[][] = [[error.message]]
+            errors.push({ data, messagesTable })
+          }
         }
       }
 
       if (!isValid) {
         for (const error of errors) {
-          console.error(`\n${error.url}`)
+          console.error(`\n${error.data}`)
           console.error(table(error.messagesTable))
           console.error('------------------------------')
         }

src/__test__/HTMLValidatorCommand.test.ts

@@ -10,7 +10,7 @@ describe('html-w3c-validator', () => {
     jest.clearAllMocks()
   })
 
-  it('should be instance of the command', async () => {
+  it('should be instance of the command', () => {
     const command = cli.process([])
     expect(command).toBeInstanceOf(HTMLValidatorCommand)
   })

src/utils/__test__/isExistingPath.test.ts

@@ -3,7 +3,7 @@ import fsMock from 'mock-fs'
 import { isExistingPath } from '../isExistingPath.js'
 
 describe('utils/isExistingFile', () => {
-  afterEach(async () => {
+  afterEach(() => {
     fsMock.restore()
   })