Upgrade all code

Author: grigorii-horos

.eslintrc.cjs

@@ -1,52 +1,59 @@
 // @ts-nocheck
-const restrictedGlobals = require("confusing-browser-globals");
+const restrictedGlobals = require('confusing-browser-globals');
 
 module.exports = {
   root: true,
   parserOptions: {
-    ecmaVersion: "2020",
-    sourceType: "module",
+    ecmaVersion: '2020',
+    sourceType: 'module',
   },
   extends: [
     // Syntax and ~
-    "eslint:recommended",
-    "es/browser",
-    "plugin:node/recommended",
+    'eslint:recommended',
+    'es/browser',
+    'plugin:node/recommended',
 
-    "plugin:ava/recommended",
-    "standard-jsdoc",
-    "plugin:json/recommended",
+    'plugin:ava/recommended',
+    'standard-jsdoc',
+    'plugin:json/recommended',
 
     // Funny
-    "plugin:you-dont-need-lodash-underscore/compatible",
-    "plugin:unicorn/recommended",
+    'plugin:you-dont-need-lodash-underscore/compatible',
+    'plugin:unicorn/recommended',
 
     // Global config
-    "airbnb-base",
+    'airbnb-base',
   ],
   plugins: [
-    "json",
-    "no-loops",
-    "unicorn",
-    "async-await",
-    "prefer-object-spread",
+    'json',
+    'no-loops',
+    'unicorn',
+    'async-await',
+    'prefer-object-spread',
 
-    "simple-import-sort",
+    'simple-import-sort',
   ],
   env: {
     browser: true,
     es6: true,
   },
   globals: {
-    Atomics: "readonly",
-    SharedArrayBuffer: "readonly",
+    Atomics: 'readonly',
+    SharedArrayBuffer: 'readonly',
   },
   rules: {
-    "prefer-object-spread/prefer-object-spread": 2,
-    "no-restricted-globals": [2, ...restrictedGlobals],
+    'prefer-object-spread/prefer-object-spread': 2,
+    'no-restricted-globals': [2, ...restrictedGlobals],
 
-    "mocha/handle-done-callback": 0,
-    "mocha/no-global-tests": 0,
-    "mocha/valid-test-description": 0,
+    'mocha/handle-done-callback': 0,
+    'mocha/no-global-tests': 0,
+    'mocha/valid-test-description': 0,
+    'import/extensions': 0,
+    'import/prefer-default-export': 0,
+    'import/no-cycle': 0,
+    'unicorn/no-null': 0,
+    'no-underscore-dangle': 0,
+    'unicorn/no-array-reduce': 0,
+    'unicorn/no-array-callback-reference': 0,
   },
 };

.vscode/cli-html.code-workspace

@@ -0,0 +1,7 @@
+{
+	"folders": [
+		{
+			"path": ".."
+		}
+	]
+}

.vscode/launch.json

@@ -0,0 +1,18 @@
+{
+    // Use IntelliSense to learn about possible attributes.
+    // Hover to view descriptions of existing attributes.
+    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+    "version": "0.2.0",
+    "configurations": [
+        {
+            "type": "pwa-node",
+            "request": "launch",
+            "name": "Launch Program",
+            "skipFiles": [
+                "<node_internals>/**"
+            ],
+            "program": "${workspaceFolder}/bin/html.js",
+            "args": ["1.html"]
+        }
+    ]
+}

bin/html.js

@@ -1,6 +1,6 @@
 #!/usr/bin/env node
 
-import { createReadStream } from 'fs';
+import { createReadStream } from 'node:fs';
 import concat from 'concat-stream';
 
 import cliHtml from '../index.js';

examples/pre.html

@@ -1,4 +1 @@
-<p><p><p><p><p>qwe</p></p></p></p></p>
-<hr>
-<pre><p><p><p><p><p>qwe</p></p></p></p></p></pre>
-<hr>
+<pre><p>qwe</p></pre>

index.js

@@ -1,19 +1,39 @@
 import parse5 from 'parse5';
 
-import { filterAst } from './lib/utils.js';
+import { parse } from 'node-html-parser';
+import { filterAst, filterAst2 } from './lib/utils.js';
 import { html } from './lib/tags/document.js';
 
 const htmlToCli = (rawHTML) => {
   // @type Object
 
-  const document = parse5.parse(rawHTML);
+  // const document = parse5.parse(rawHTML);
+  const document2 = parse(rawHTML, {
+    blockTextElements: {
+      script: false,
+      noscript: false,
+      style: false,
+      // pre: true,
+      code: true,
+    },
+  });
 
-  // console.dir(
-  //   filterAst(document.childNodes[0].childNodes[1]),
-  //   { depth: null },
-  // );
+  // console.dir(filterAst(document.childNodes[0].childNodes[1]), { depth: null });
 
-  return `${(html(document, { pre: false, lineWidth: +(process.env.CLI_HTML_LINE_WIDTH || '120') }) || { value: '' }).value}\n`;
+  // console.log("----");
+
+  // console.dir(filterAst2(document2), {
+  //   depth: null,
+  // });
+
+  return `${
+    (
+      html(document2, {
+        pre: false,
+        lineWidth: +(process.env.CLI_HTML_LINE_WIDTH || '120'),
+      }) || { value: '' }
+    ).value
+  }\n`;
 };
 
 export default htmlToCli;

lib/tag-helpers/blockTag.js

@@ -1,57 +1,56 @@
-/* eslint-disable unicorn/consistent-function-scoping */
-import tags from "../tags.js";
-import { getAttribute } from "../utils.js";
+import tags from '../tags.js';
+import { getAttribute } from '../utils.js';
 
-import { concatTwoBlockTags } from "../utils/concatBlockTags.js";
-import { concatTwoInlineTags } from "../utils/concatInlineTags.js";
-import { inlineToBlockTag } from "../utils/inlineToBlockTag.js";
+import { concatTwoBlockTags } from '../utils/concatBlockTags.js';
+import { concatTwoInlineTags } from '../utils/concatInlineTags.js';
+import { inlineToBlockTag } from '../utils/inlineToBlockTag.js';
 
-import wrapLineWidth from "../wrapLineWidth.js";
+import wrapLineWidth from '../wrapLineWidth.js';
 
+/**
+ * @param wrapper
+ * @param localContext
+ */
 export function blockTag(wrapper, localContext) {
   return (tag, context) => {
-    const wrapFn = wrapper || ((argument) => argument);
+    const wrapFunction = wrapper || ((argument) => argument);
 
     if (!tag || !tag.childNodes) {
       return null;
     }
 
-    let liItemNumber = parseInt(getAttribute(tag, "start", "1"), 10);
+    let liItemNumber = Number.parseInt(getAttribute(tag, 'start', '1'), 10);
     const value = tag.childNodes.reduce(
       (accumulator, node) => {
-        if (!tags[node.nodeName]) {
-          return accumulator;
-        }
+        const tagFunction = tags[node.rawTagName || '#text'] || tags.span;
 
-        const nodeTag = tags[node.nodeName](node, { ...context, liItemNumber });
+        const nodeTag = tagFunction(node, { ...context, liItemNumber });
 
-        if (nodeTag == null) {
+        if (nodeTag == undefined) {
           return accumulator;
         }
 
-        if (nodeTag.nodeName === "li") {
+        if (nodeTag.rawTagName === 'li') {
           liItemNumber += 1;
         }
 
-        if (nodeTag.type === "inline") {
+        if (nodeTag.type === 'inline') {
           return {
             block: accumulator.block,
             inline: concatTwoInlineTags(accumulator.inline, nodeTag),
           };
         }
 
-        if (accumulator.inline && accumulator.inline.value != null) {
-          if (!context.pre) {
-            accumulator.inline.value = wrapLineWidth(
-              accumulator.inline.value,
-              context
-            );
-          }
+        if (accumulator.inline && accumulator.inline.value != undefined && !context.pre) {
+          accumulator.inline.value = wrapLineWidth(
+            accumulator.inline.value,
+            context,
+          );
         }
 
         accumulator.block = concatTwoBlockTags(
           accumulator.block,
-          inlineToBlockTag(accumulator.inline)
+          inlineToBlockTag(accumulator.inline),
         );
 
         accumulator.block = concatTwoBlockTags(accumulator.block, nodeTag);
@@ -64,18 +63,16 @@ export function blockTag(wrapper, localContext) {
       {
         block: null,
         inline: null,
-      }
+      },
     );
 
-    if (value.inline != null && value.inline.value != null) {
-      if (!context.pre) {
-        value.inline.value = wrapLineWidth(value.inline.value, context);
-      }
+    if (value.inline != undefined && value.inline.value != undefined && !context.pre) {
+      value.inline.value = wrapLineWidth(value.inline.value, context);
     }
 
     value.block = concatTwoBlockTags(
       value.block,
-      inlineToBlockTag(value.inline)
+      inlineToBlockTag(value.inline),
     );
 
     if (!value.block || !value.block.value) {
@@ -95,12 +92,12 @@ export function blockTag(wrapper, localContext) {
         value.block.marginTop && value.block.marginTop > topBlock
           ? value.block.marginTop
           : topBlock,
-      value: wrapFn(value.block.value, tag),
+      value: wrapFunction(value.block.value, tag),
       marginBottom:
         value.block.marginBottom && value.block.marginBottom > bottomBlock
           ? value.block.marginBottom
           : bottomBlock,
-      type: "block",
+      type: 'block',
       nodeName: tag.nodeName,
     };
   };

lib/tag-helpers/inlineTag.js

@@ -1,21 +1,18 @@
-/* eslint-disable unicorn/consistent-function-scoping */
 import tags from '../tags.js';
 
 import { concatTwoInlineTags } from '../utils/concatInlineTags.js';
 
 const inlineTag = (wrapper) => (tag, context) => {
-  const wrapFn = wrapper || ((argument) => argument);
+  const wrapFunction = wrapper || ((argument) => argument);
 
   if (!tag || !tag.childNodes) {
     return null;
   }
 
   const value = tag.childNodes.reduce((accumulator, node) => {
-    if (!tags[node.nodeName]) {
-      return accumulator;
-    }
+    const tagFunction = tags[node.rawTagName || '#text'] || tags.span;
 
-    const nodeTag = tags[node.nodeName](node, context);
+    const nodeTag = tagFunction(node, context);
 
     if (nodeTag === null) {
       return accumulator;
@@ -24,7 +21,7 @@ const inlineTag = (wrapper) => (tag, context) => {
     return {
       ...concatTwoInlineTags(accumulator, nodeTag),
       type: 'inline',
-      nodeName: tag.nodeName,
+      nodeName: tag.rawTagName,
     };
   }, null);
 
@@ -34,9 +31,9 @@ const inlineTag = (wrapper) => (tag, context) => {
 
   if (value.value) {
     return {
-      pre: value.pre ? wrapFn(value.pre, tag) : null,
-      value: value.value ? wrapFn(value.value, tag) : null,
-      post: value.post ? wrapFn(value.post, tag) : null,
+      pre: value.pre ? wrapFunction(value.pre, tag) : null,
+      value: value.value ? wrapFunction(value.value, tag) : null,
+      post: value.post ? wrapFunction(value.post, tag) : null,
       type: 'inline',
       nodeName: tag.nodeName,
     };

lib/tag-helpers/textNode.js

@@ -5,26 +5,24 @@ export const textNode = (tag, context) => {
   if (context.pre) {
     return {
       pre: null,
-      value: tag.value,
+      value: tag._rawText,
       post: null,
-      type: "inline",
-      nodeName: "#text",
+      type: 'inline',
+      nodeName: '#text',
     };
   }
   const normalized = context.pre
-    ? tag.value.split('')
-    : normalizeWhitespace(tag.value)
-      .replace(/\n/g, ' ')
-      .split('');
+    ? [...tag._rawText]
+    : [...normalizeWhitespace(tag._rawText).replace(/\n/g, ' ')];
 
   const pre = [' ', '\n'].includes(normalized[0]) ? normalized.shift() : null;
   const post = [' ', '\n'].includes(normalized[normalized.length - 1]) ? normalized.pop() : null;
 
   return {
     pre,
-    value: normalized.length > 0 ? `${he.decode(normalized.join(""))}` : null,
+    value: normalized.length > 0 ? `${he.decode(normalized.join(''))}` : null,
     post,
-    type: "inline",
-    nodeName: "#text",
+    type: 'inline',
+    nodeName: '#text',
   };
 };