From 30912c34672fd1ca2ad24ca379a15aac44426f30 Mon Sep 17 00:00:00 2001 From: Eike Foken Date: Tue, 31 Oct 2023 18:25:26 +0100 Subject: [PATCH 01/12] Enable guard-for-in and symbol-description --- .eslintrc | 6 ++--- src/element/custom-element.js | 24 +++++++++++------- src/hooks/create-hooks.js | 8 +++--- src/render.js | 18 ++++++++----- src/tests/element.test.js | 2 +- src/tests/render-children.test.js | 10 ++++---- src/tests/render.test.js | 4 ++- ssr/tag.js | 42 ++++++++++++++++++------------- 8 files changed, 68 insertions(+), 46 deletions(-) diff --git a/.eslintrc b/.eslintrc index d758d36d..a5dfaeb9 100644 --- a/.eslintrc +++ b/.eslintrc @@ -16,7 +16,6 @@ "class-methods-use-this": "off", "consistent-return": "off", "eqeqeq": "off", - "guard-for-in": "off", "max-classes-per-file": "off", "new-cap": "off", "no-bitwise": "off", @@ -40,18 +39,19 @@ "prefer-destructuring": ["error", { "object": true, "array": false }], "prefer-rest-params": "off", "prefer-promise-reject-errors": "off", - "symbol-description": "off", "import/extensions": "off", + "import/no-cycle": "off", "import/no-extraneous-dependencies": "off", "import/prefer-default-export": "off" }, "overrides": [ { - "files": "types/**/*.ts", + "files": "**/*.{ts,tsx}", "extends": ["airbnb-typescript/base", "prettier"], "rules": { "@typescript-eslint/no-shadow": "off", "@typescript-eslint/no-unused-expressions": "off", + "import/extensions": "off", "import/no-cycle": "off" } } diff --git a/src/element/custom-element.js b/src/element/custom-element.js index 8b15a355..b6474648 100644 --- a/src/element/custom-element.js +++ b/src/element/custom-element.js @@ -46,7 +46,11 @@ export const c = (component, base) => { super(); this._setup(); this._render = () => component({ ...this._props }); - for (const prop in values) this[prop] = values[prop]; + for (const prop in values) { + if (Object.prototype.hasOwnProperty.call(values, prop)) { + this[prop] = values[prop]; + } + } } /** @@ -104,7 +108,7 @@ export const c = (component, base) => { }; }); - this.symbolId = this.symbolId || Symbol(); + this.symbolId = this.symbolId || Symbol(className); const hooks = createHooks( () => this.update(), @@ -229,13 +233,15 @@ export const c = (component, base) => { // @ts-ignore const superAttrs = super.observedAttributes || []; for (const prop in props) { - setPrototype( - this.prototype, - prop, - props[prop], - attrs, - values, - ); + if (Object.prototype.hasOwnProperty.call(props, prop)) { + setPrototype( + this.prototype, + prop, + props[prop], + attrs, + values, + ); + } } return Object.keys(attrs).concat(superAttrs); } diff --git a/src/hooks/create-hooks.js b/src/hooks/create-hooks.js index 79ad4840..70109503 100644 --- a/src/hooks/create-hooks.js +++ b/src/hooks/create-hooks.js @@ -87,9 +87,11 @@ export const createHooks = (update, host, id = 0) => { */ const cleanEffectsByType = (tag, unmounted) => { for (const index in hooks) { - const hook = hooks[index]; - if (hook.effect && hook.tag === tag) { - hook.value = hook.effect(hook.value, unmounted); + if (Object.prototype.hasOwnProperty.call(hooks, index)) { + const hook = hooks[index]; + if (hook.effect && hook.tag === tag) { + hook.value = hook.effect(hook.value, unmounted); + } } } }; diff --git a/src/render.js b/src/render.js index 51110b11..7c2e30bb 100644 --- a/src/render.js +++ b/src/render.js @@ -388,11 +388,15 @@ export function renderChildren(children, fragment, parent, id, hydrate, isSvg) { */ export function diffProps(node, props, nextProps, handlers, isSvg) { for (const key in props) { - !(key in nextProps) && - setProperty(node, key, props[key], null, isSvg, handlers); + if (Object.prototype.hasOwnProperty.call(props, key)) { + !(key in nextProps) && + setProperty(node, key, props[key], null, isSvg, handlers); + } } for (const key in nextProps) { - setProperty(node, key, props[key], nextProps[key], isSvg, handlers); + if (Object.prototype.hasOwnProperty.call(nextProps, key)) { + setProperty(node, key, props[key], nextProps[key], isSvg, handlers); + } } } @@ -456,9 +460,11 @@ export function setProperty(node, key, prevValue, nextValue, isSvg, handlers) { if (nextIsObject) { for (const key in nextValue) { - const value = nextValue[key]; - if (prevIsObject && prevValue[key] === value) continue; - setPropertyStyle(style, key, value); + if (Object.prototype.hasOwnProperty.call(nextValue, key)) { + const value = nextValue[key]; + if (prevIsObject && prevValue[key] === value) continue; + setPropertyStyle(style, key, value); + } } } else { style.cssText = nextValue; diff --git a/src/tests/element.test.js b/src/tests/element.test.js index 9ceb1a1f..1b8d2c0f 100644 --- a/src/tests/element.test.js +++ b/src/tests/element.test.js @@ -374,7 +374,7 @@ describe("src/element", () => { let node = customElementScope(Wc); - let value = Symbol(); + let value = Symbol("value"); document.body.appendChild(node); diff --git a/src/tests/render-children.test.js b/src/tests/render-children.test.js index feffde17..214febbe 100644 --- a/src/tests/render-children.test.js +++ b/src/tests/render-children.test.js @@ -41,7 +41,7 @@ describe("src/render#children", () => { const root = document.createElement("div"); const ref = {}; const children = [{}, {}, [{}], html``]; - const id = Symbol(); + const id = Symbol("id"); const fragment = renderChildren(children, null, root, id, false); const childNodes = fragmentToChildNodes(fragment); expect(childNodes).to.deep.equal([ref.current]); @@ -49,14 +49,14 @@ describe("src/render#children", () => { it("Render: Size", () => { const root = document.createElement("div"); const children = [...Array(10)].map(() => html``); - const id = Symbol(); + const id = Symbol("id"); const fragment = renderChildren(children, null, root, id, false); const childNodes = fragmentToChildNodes(fragment); expect(childNodes.length).to.equal(children.length); }); it("nested lists", () => { const root = document.createElement("div"); - const id = Symbol(); + const id = Symbol("id"); let count = 0; const list = [...Array(10)].map((_, index) => { const list = [...Array(5)].map( @@ -76,7 +76,7 @@ describe("src/render#children", () => { }); it("Render: Simple list rendering", () => { const root = document.createElement("div"); - const id = Symbol(); + const id = Symbol("id"); let fragment; /** * @@ -110,7 +110,7 @@ describe("src/render#children", () => { }); it("Render: Simple list rendering with keyes", () => { - const id = Symbol(); + const id = Symbol("id"); const host = document.createElement("div"); let size = 100; let fragment; diff --git a/src/tests/render.test.js b/src/tests/render.test.js index 038e9f81..4457a937 100644 --- a/src/tests/render.test.js +++ b/src/tests/render.test.js @@ -159,7 +159,9 @@ describe("src/render", () => { ); for (let key in attrs) { - expect(el.getAttribute(key)).to.equal(attrs[key].expect); + if (Object.prototype.hasOwnProperty.call(attrs, key)) { + expect(el.getAttribute(key)).to.equal(attrs[key].expect); + } } }); diff --git a/ssr/tag.js b/ssr/tag.js index ad7ef32b..c256ae60 100644 --- a/ssr/tag.js +++ b/ssr/tag.js @@ -26,27 +26,33 @@ export class Attributes { toString() { const attrs = new Map(); for (let prop in this) { - const value = this[prop]; - const type = typeof value; + if (Object.prototype.hasOwnProperty.call(this, prop)) { + const value = this[prop]; + const type = typeof value; - if (INTERNAL_PROPS[prop] || type === "function" || prop[0] === "_") - continue; + if ( + INTERNAL_PROPS[prop] || + type === "function" || + prop[0] === "_" + ) + continue; - const attr = - prop === "className" - ? "class" - : prop.replace( - /([\w])([A-Z])/g, - (all, before, after) => - `${before}-${after.toLowerCase()}`, - ); + const attr = + prop === "className" + ? "class" + : prop.replace( + /([\w])([A-Z])/g, + (all, before, after) => + `${before}-${after.toLowerCase()}`, + ); - if (type === "boolean") { - if (value) attrs.set(attr); - } else if (type === "object") { - attrs.set(attr, JSON.stringify(value)); - } else { - attrs.set(attr, value); + if (type === "boolean") { + if (value) attrs.set(attr); + } else if (type === "object") { + attrs.set(attr, JSON.stringify(value)); + } else { + attrs.set(attr, value); + } } } const list = [...attrs]; From 24574f2209773a0d96acf19b5dd7ab11dfaadaff Mon Sep 17 00:00:00 2001 From: Eike Foken Date: Tue, 31 Oct 2023 18:26:15 +0100 Subject: [PATCH 02/12] Fix ESLint errors in tsx files --- types/tests/17-schema-infer.tsx | 6 +++--- types/tests/2-basic-Component.tsx | 4 +--- 2 files changed, 4 insertions(+), 6 deletions(-) diff --git a/types/tests/17-schema-infer.tsx b/types/tests/17-schema-infer.tsx index d6e04a1f..6bfd8094 100644 --- a/types/tests/17-schema-infer.tsx +++ b/types/tests/17-schema-infer.tsx @@ -1,4 +1,4 @@ -import { Component, Props, c } from "core"; +import { Component, c } from "core"; const x1: Component<{ value1: number[]; @@ -25,7 +25,7 @@ x1.props = { const X1 = c(x1); -function x2({ value1 = [1, 2, 3] }: Props) { +function x2() { return ; } @@ -40,5 +40,5 @@ const X2 = c(x1); value2={new Date()} value3={new MouseEvent("click")} value4={document.createElement("div")} - value6={(count: number) => {}} + value6={() => {}} />; diff --git a/types/tests/2-basic-Component.tsx b/types/tests/2-basic-Component.tsx index c5d84d03..e86c01af 100644 --- a/types/tests/2-basic-Component.tsx +++ b/types/tests/2-basic-Component.tsx @@ -3,9 +3,7 @@ import { c, Component } from "core"; const myComponent: Component< { value: string }, { onChange: CustomEvent<{ id: number }>; myMethod(value: number): void } -> = ({ value }) => { - return {value}; -}; +> = ({ value }) => {value}; myComponent.props = { value: String, From f9765e8e639734018436da4a56f0839ef86b2fba Mon Sep 17 00:00:00 2001 From: Eike Foken Date: Tue, 31 Oct 2023 19:24:16 +0100 Subject: [PATCH 03/12] Update dependencies --- package-lock.json | 18 +++++++++--------- package.json | 9 +++------ 2 files changed, 12 insertions(+), 15 deletions(-) diff --git a/package-lock.json b/package-lock.json index 700494f9..4729c511 100644 --- a/package-lock.json +++ b/package-lock.json @@ -11,9 +11,9 @@ "devDependencies": { "@esm-bundle/chai": "^4.3.4-fix.0", "@rollup/plugin-node-resolve": "^13.3.0", - "@types/chai": "^4.2.18", - "@types/mocha": "^8.0.0", - "@web/test-runner": "^0.13.27", + "@types/chai": "^4.3.9", + "@types/mocha": "^8.2.3", + "@web/test-runner": "^0.13.31", "eslint": "^8.52.0", "eslint-config-airbnb-base": "^15.0.0", "eslint-config-airbnb-typescript": "^17.1.0", @@ -287,9 +287,9 @@ } }, "node_modules/@types/chai": { - "version": "4.3.5", - "resolved": "https://registry.npmjs.org/@types/chai/-/chai-4.3.5.tgz", - "integrity": "sha512-mEo1sAde+UCE6b2hxn332f1g1E8WfYRu6p5SvTKr2ZKC1f7gFJXk4h5PyGP9Dt6gCaG8y8XhwnXWC6Iy2cmBng==", + "version": "4.3.9", + "resolved": "https://registry.npmjs.org/@types/chai/-/chai-4.3.9.tgz", + "integrity": "sha512-69TtiDzu0bcmKQv3yg1Zx409/Kd7r0b5F1PfpYJfSHzLGtB53547V4u+9iqKYsTu/O2ai6KTb0TInNpvuQ3qmg==", "dev": true }, "node_modules/@types/co-body": { @@ -6041,9 +6041,9 @@ } }, "@types/chai": { - "version": "4.3.5", - "resolved": "https://registry.npmjs.org/@types/chai/-/chai-4.3.5.tgz", - "integrity": "sha512-mEo1sAde+UCE6b2hxn332f1g1E8WfYRu6p5SvTKr2ZKC1f7gFJXk4h5PyGP9Dt6gCaG8y8XhwnXWC6Iy2cmBng==", + "version": "4.3.9", + "resolved": "https://registry.npmjs.org/@types/chai/-/chai-4.3.9.tgz", + "integrity": "sha512-69TtiDzu0bcmKQv3yg1Zx409/Kd7r0b5F1PfpYJfSHzLGtB53547V4u+9iqKYsTu/O2ai6KTb0TInNpvuQ3qmg==", "dev": true }, "@types/co-body": { diff --git a/package.json b/package.json index 1b6231c4..e40cb663 100644 --- a/package.json +++ b/package.json @@ -104,9 +104,9 @@ "devDependencies": { "@esm-bundle/chai": "^4.3.4-fix.0", "@rollup/plugin-node-resolve": "^13.3.0", - "@types/chai": "^4.2.18", - "@types/mocha": "^8.0.0", - "@web/test-runner": "^0.13.27", + "@types/chai": "^4.3.9", + "@types/mocha": "^8.2.3", + "@web/test-runner": "^0.13.31", "eslint": "^8.52.0", "eslint-config-airbnb-base": "^15.0.0", "eslint-config-airbnb-typescript": "^17.1.0", @@ -118,9 +118,6 @@ "typescript": "^5.2.2" }, "prettier": { - "endOfLine": "lf", - "semi": true, - "singleQuote": false, "tabWidth": 4 } } From 8abc79d5d8eb7ffc38cabab3cf16ac86d56320b1 Mon Sep 17 00:00:00 2001 From: Eike Foken Date: Tue, 31 Oct 2023 19:25:02 +0100 Subject: [PATCH 04/12] Lint import extensions --- .eslintrc | 5 ++--- src/context.js | 5 ++++- src/hooks/tests/use-effect.test.js | 4 ++-- src/hooks/tests/use-event.test.js | 4 ++-- src/hooks/tests/use-layout-effect.test.js | 4 ++-- src/hooks/tests/use-memo.test.js | 4 ++-- src/hooks/tests/use-prop.test.js | 4 ++-- src/hooks/tests/use-reducer.test.js | 4 ++-- src/hooks/tests/use-ref.test.js | 2 +- src/hooks/tests/use-state.test.js | 4 ++-- src/tests/element-hooks.test.js | 2 +- src/tests/internal/set-prototype.test.js | 2 +- src/tests/template.test.js | 2 +- src/tests/utils.test.js | 2 +- tests/fixture.test.js | 4 ++-- tests/utils.test.js | 2 +- tsconfig.json | 3 +-- 17 files changed, 29 insertions(+), 28 deletions(-) diff --git a/.eslintrc b/.eslintrc index a5dfaeb9..4fc6c493 100644 --- a/.eslintrc +++ b/.eslintrc @@ -34,12 +34,11 @@ "no-underscore-dangle": "off", "no-unused-expressions": "off", "no-use-before-define": "off", - "no-void": "off", "prefer-const": "off", "prefer-destructuring": ["error", { "object": true, "array": false }], "prefer-rest-params": "off", "prefer-promise-reject-errors": "off", - "import/extensions": "off", + "import/extensions": ["error", "always"], "import/no-cycle": "off", "import/no-extraneous-dependencies": "off", "import/prefer-default-export": "off" @@ -51,7 +50,7 @@ "rules": { "@typescript-eslint/no-shadow": "off", "@typescript-eslint/no-unused-expressions": "off", - "import/extensions": "off", + "import/extensions": ["error", "always"], "import/no-cycle": "off" } } diff --git a/src/context.js b/src/context.js index 0ddc5229..9992224b 100644 --- a/src/context.js +++ b/src/context.js @@ -92,7 +92,10 @@ export const createContext = (value) => { /** * @type {import("context").ComponentContext} */ - const context = () => void useProvider(Context, useHost().current); + const context = () => { + useProvider(Context, useHost().current); + return undefined; + }; context.props = { value: { diff --git a/src/hooks/tests/use-effect.test.js b/src/hooks/tests/use-effect.test.js index 0fed1334..7dffaa3f 100644 --- a/src/hooks/tests/use-effect.test.js +++ b/src/hooks/tests/use-effect.test.js @@ -1,6 +1,6 @@ import { expect } from "@esm-bundle/chai"; -import { createHooks } from "../create-hooks"; -import { useEffect } from "../hooks"; +import { createHooks } from "../create-hooks.js"; +import { useEffect } from "../hooks.js"; describe("src/hooks/use-effect", () => { /** diff --git a/src/hooks/tests/use-event.test.js b/src/hooks/tests/use-event.test.js index 6e33ad65..ccf9d074 100644 --- a/src/hooks/tests/use-event.test.js +++ b/src/hooks/tests/use-event.test.js @@ -1,6 +1,6 @@ import { expect } from "@esm-bundle/chai"; -import { createHooks } from "../create-hooks"; -import { useEvent } from "../custom-hooks/use-event"; +import { createHooks } from "../create-hooks.js"; +import { useEvent } from "../custom-hooks/use-event.js"; describe("src/hooks/custom-hooks/use-event", () => { it("association of useEvent to host", (done) => { diff --git a/src/hooks/tests/use-layout-effect.test.js b/src/hooks/tests/use-layout-effect.test.js index fb5e63d2..28449699 100644 --- a/src/hooks/tests/use-layout-effect.test.js +++ b/src/hooks/tests/use-layout-effect.test.js @@ -1,6 +1,6 @@ import { expect } from "@esm-bundle/chai"; -import { createHooks } from "../create-hooks"; -import { useLayoutEffect } from "../hooks"; +import { createHooks } from "../create-hooks.js"; +import { useLayoutEffect } from "../hooks.js"; describe("src/hooks/use-effect", () => { /** diff --git a/src/hooks/tests/use-memo.test.js b/src/hooks/tests/use-memo.test.js index 54921a4c..941901c0 100644 --- a/src/hooks/tests/use-memo.test.js +++ b/src/hooks/tests/use-memo.test.js @@ -1,6 +1,6 @@ import { expect } from "@esm-bundle/chai"; -import { createHooks } from "../create-hooks"; -import { useMemo, useCallback } from "../hooks"; +import { createHooks } from "../create-hooks.js"; +import { useMemo, useCallback } from "../hooks.js"; describe("src/hooks/use-callback", () => { it("reflection of useMemo", () => { diff --git a/src/hooks/tests/use-prop.test.js b/src/hooks/tests/use-prop.test.js index ae5fe0a2..19cc53cc 100644 --- a/src/hooks/tests/use-prop.test.js +++ b/src/hooks/tests/use-prop.test.js @@ -1,6 +1,6 @@ import { expect } from "@esm-bundle/chai"; -import { createHooks } from "../create-hooks"; -import { useProp } from "../custom-hooks/use-prop"; +import { createHooks } from "../create-hooks.js"; +import { useProp } from "../custom-hooks/use-prop.js"; describe("src/hooks/custom-hooks/use-prop", () => { it("manipulation of the DOM object", () => { diff --git a/src/hooks/tests/use-reducer.test.js b/src/hooks/tests/use-reducer.test.js index cf36aace..31c23031 100644 --- a/src/hooks/tests/use-reducer.test.js +++ b/src/hooks/tests/use-reducer.test.js @@ -1,6 +1,6 @@ import { expect } from "@esm-bundle/chai"; -import { createHooks } from "../create-hooks"; -import { useReducer } from "../hooks"; +import { createHooks } from "../create-hooks.js"; +import { useReducer } from "../hooks.js"; describe("src/hooks/use-state", () => { it("initialState", () => { diff --git a/src/hooks/tests/use-ref.test.js b/src/hooks/tests/use-ref.test.js index 37016f83..2f216592 100644 --- a/src/hooks/tests/use-ref.test.js +++ b/src/hooks/tests/use-ref.test.js @@ -1,5 +1,5 @@ import { expect } from "@esm-bundle/chai"; -import { createHooks, useRef } from "../create-hooks"; +import { createHooks, useRef } from "../create-hooks.js"; describe("src/hooks/use-ref", () => { it("referencia persistente de creacion", () => { diff --git a/src/hooks/tests/use-state.test.js b/src/hooks/tests/use-state.test.js index 9a0408a8..a6567125 100644 --- a/src/hooks/tests/use-state.test.js +++ b/src/hooks/tests/use-state.test.js @@ -1,6 +1,6 @@ import { expect } from "@esm-bundle/chai"; -import { createHooks } from "../create-hooks"; -import { useState } from "../hooks"; +import { createHooks } from "../create-hooks.js"; +import { useState } from "../hooks.js"; describe("src/hooks/use-state", () => { it("single execution", () => { diff --git a/src/tests/element-hooks.test.js b/src/tests/element-hooks.test.js index b172c3d2..c4ba92a8 100644 --- a/src/tests/element-hooks.test.js +++ b/src/tests/element-hooks.test.js @@ -1,5 +1,5 @@ import { expect } from "@esm-bundle/chai"; -import { useRef } from "../hooks/create-hooks"; +import { useRef } from "../hooks/create-hooks.js"; import { customElementScope } from "./element.test.js"; import { html } from "../../html.js"; diff --git a/src/tests/internal/set-prototype.test.js b/src/tests/internal/set-prototype.test.js index e7f4f649..bc4e868a 100644 --- a/src/tests/internal/set-prototype.test.js +++ b/src/tests/internal/set-prototype.test.js @@ -4,7 +4,7 @@ import { filterValue, reflectValue, getAttr, -} from "../../element/set-prototype"; +} from "../../element/set-prototype.js"; describe("internal: getAttr", () => { it("check getAttr", () => { diff --git a/src/tests/template.test.js b/src/tests/template.test.js index 82099919..9e73d5b3 100644 --- a/src/tests/template.test.js +++ b/src/tests/template.test.js @@ -1,6 +1,6 @@ import { expect } from "@esm-bundle/chai"; import { html } from "../../html.js"; -import { template } from "../template"; +import { template } from "../template.js"; describe("src/template", () => { it("check", () => { diff --git a/src/tests/utils.test.js b/src/tests/utils.test.js index f5b76493..48160e5a 100644 --- a/src/tests/utils.test.js +++ b/src/tests/utils.test.js @@ -1,5 +1,5 @@ import { expect } from "@esm-bundle/chai"; -import { isEqualArray, isFunction, isObject } from "../utils"; +import { isEqualArray, isFunction, isObject } from "../utils.js"; describe("src/utils", () => { it("isEqualArray", () => { diff --git a/tests/fixture.test.js b/tests/fixture.test.js index 90c0149b..8cdb4ff6 100644 --- a/tests/fixture.test.js +++ b/tests/fixture.test.js @@ -1,11 +1,11 @@ import { expect } from "@esm-bundle/chai"; -import { html } from "../core"; +import { html } from "../core.js"; import { fixture, getFragment, asyncEventListener, dispatchEvent, -} from "../test-dom"; +} from "../test-dom.js"; describe("fixture", () => { it("single", () => { diff --git a/tests/utils.test.js b/tests/utils.test.js index 635ec4ec..851c8782 100644 --- a/tests/utils.test.js +++ b/tests/utils.test.js @@ -1,5 +1,5 @@ import { expect } from "@esm-bundle/chai"; -import { serialize, checkIncompatibility } from "../utils"; +import { serialize, checkIncompatibility } from "../utils.js"; describe("utils", () => { it("serialize", () => { diff --git a/tsconfig.json b/tsconfig.json index a2df392b..0d5a5b13 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,6 +1,5 @@ { "include": ["src/**/*", "types/**/*"], - // "exclude": ["src/**/tests/","tests/"], "compilerOptions": { "strict": false, "noUnusedLocals": true, @@ -9,7 +8,7 @@ "jsxImportSource": "../", "target": "ESNext", "module": "ESNext", - "moduleResolution": "node", + "moduleResolution": "Node", "allowSyntheticDefaultImports": true, "allowJs": true, "declaration": true, From 5cfa0bdb412b8c3dc518df07912087c3de1e23ec Mon Sep 17 00:00:00 2001 From: Eike Foken Date: Tue, 31 Oct 2023 19:28:57 +0100 Subject: [PATCH 05/12] Install Husky hooks --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index e40cb663..8c46c9b7 100644 --- a/package.json +++ b/package.json @@ -78,7 +78,7 @@ "ssr": "node ssr/tests/ssr.js", "test:w": "web-test-runner --watch", "build:html": "rollup -c", - "prepare": "npm run test:ts && npm run test", + "prepare": "husky install && npm run test:ts && npm run test", "lint": "eslint .", "hook:push": "npm run lint && npm run test", "hook:commit": "npm run lint" From 76add8e6a70e0f60473be719134e655c60b9445d Mon Sep 17 00:00:00 2001 From: Eike Foken Date: Tue, 31 Oct 2023 20:09:22 +0100 Subject: [PATCH 06/12] Fix permissions of Husky scripts --- .husky/pre-commit | 0 .husky/pre-push | 0 2 files changed, 0 insertions(+), 0 deletions(-) mode change 100644 => 100755 .husky/pre-commit mode change 100644 => 100755 .husky/pre-push diff --git a/.husky/pre-commit b/.husky/pre-commit old mode 100644 new mode 100755 diff --git a/.husky/pre-push b/.husky/pre-push old mode 100644 new mode 100755 From 5132a2755a08afbf742e71b3333376f1abbceb16 Mon Sep 17 00:00:00 2001 From: Eike Foken Date: Tue, 31 Oct 2023 20:10:07 +0100 Subject: [PATCH 07/12] Disable guard-for-in --- .eslintrc | 3 ++ src/element/custom-element.js | 20 +++++------ src/hooks/create-hooks.js | 8 ++--- src/render.js | 18 ++++------ src/tests/internal/set-prototype.test.js | 2 +- src/tests/render.test.js | 4 +-- ssr/tag.js | 42 ++++++++++-------------- 7 files changed, 40 insertions(+), 57 deletions(-) diff --git a/.eslintrc b/.eslintrc index 4fc6c493..27a68304 100644 --- a/.eslintrc +++ b/.eslintrc @@ -16,6 +16,7 @@ "class-methods-use-this": "off", "consistent-return": "off", "eqeqeq": "off", + "guard-for-in": "off", "max-classes-per-file": "off", "new-cap": "off", "no-bitwise": "off", @@ -25,6 +26,8 @@ "no-continue": "off", "no-multi-assign": "off", "no-nested-ternary": "off", + "no-new-object": "off", + "no-object-constructor": "error", "no-param-reassign": "off", "no-plusplus": "off", "no-restricted-syntax": "off", diff --git a/src/element/custom-element.js b/src/element/custom-element.js index b6474648..045a5d7e 100644 --- a/src/element/custom-element.js +++ b/src/element/custom-element.js @@ -47,9 +47,7 @@ export const c = (component, base) => { this._setup(); this._render = () => component({ ...this._props }); for (const prop in values) { - if (Object.prototype.hasOwnProperty.call(values, prop)) { - this[prop] = values[prop]; - } + this[prop] = values[prop]; } } @@ -233,15 +231,13 @@ export const c = (component, base) => { // @ts-ignore const superAttrs = super.observedAttributes || []; for (const prop in props) { - if (Object.prototype.hasOwnProperty.call(props, prop)) { - setPrototype( - this.prototype, - prop, - props[prop], - attrs, - values, - ); - } + setPrototype( + this.prototype, + prop, + props[prop], + attrs, + values, + ); } return Object.keys(attrs).concat(superAttrs); } diff --git a/src/hooks/create-hooks.js b/src/hooks/create-hooks.js index 70109503..79ad4840 100644 --- a/src/hooks/create-hooks.js +++ b/src/hooks/create-hooks.js @@ -87,11 +87,9 @@ export const createHooks = (update, host, id = 0) => { */ const cleanEffectsByType = (tag, unmounted) => { for (const index in hooks) { - if (Object.prototype.hasOwnProperty.call(hooks, index)) { - const hook = hooks[index]; - if (hook.effect && hook.tag === tag) { - hook.value = hook.effect(hook.value, unmounted); - } + const hook = hooks[index]; + if (hook.effect && hook.tag === tag) { + hook.value = hook.effect(hook.value, unmounted); } } }; diff --git a/src/render.js b/src/render.js index 7c2e30bb..51110b11 100644 --- a/src/render.js +++ b/src/render.js @@ -388,15 +388,11 @@ export function renderChildren(children, fragment, parent, id, hydrate, isSvg) { */ export function diffProps(node, props, nextProps, handlers, isSvg) { for (const key in props) { - if (Object.prototype.hasOwnProperty.call(props, key)) { - !(key in nextProps) && - setProperty(node, key, props[key], null, isSvg, handlers); - } + !(key in nextProps) && + setProperty(node, key, props[key], null, isSvg, handlers); } for (const key in nextProps) { - if (Object.prototype.hasOwnProperty.call(nextProps, key)) { - setProperty(node, key, props[key], nextProps[key], isSvg, handlers); - } + setProperty(node, key, props[key], nextProps[key], isSvg, handlers); } } @@ -460,11 +456,9 @@ export function setProperty(node, key, prevValue, nextValue, isSvg, handlers) { if (nextIsObject) { for (const key in nextValue) { - if (Object.prototype.hasOwnProperty.call(nextValue, key)) { - const value = nextValue[key]; - if (prevIsObject && prevValue[key] === value) continue; - setPropertyStyle(style, key, value); - } + const value = nextValue[key]; + if (prevIsObject && prevValue[key] === value) continue; + setPropertyStyle(style, key, value); } } else { style.cssText = nextValue; diff --git a/src/tests/internal/set-prototype.test.js b/src/tests/internal/set-prototype.test.js index bc4e868a..ed9445ad 100644 --- a/src/tests/internal/set-prototype.test.js +++ b/src/tests/internal/set-prototype.test.js @@ -70,7 +70,7 @@ describe("internal: filterValue", () => { }, { type: Object, - // eslint-disable-next-line no-new-object + // eslint-disable-next-line no-object-constructor success: [{}, new Object(), new (class {})()], }, { diff --git a/src/tests/render.test.js b/src/tests/render.test.js index 4457a937..038e9f81 100644 --- a/src/tests/render.test.js +++ b/src/tests/render.test.js @@ -159,9 +159,7 @@ describe("src/render", () => { ); for (let key in attrs) { - if (Object.prototype.hasOwnProperty.call(attrs, key)) { - expect(el.getAttribute(key)).to.equal(attrs[key].expect); - } + expect(el.getAttribute(key)).to.equal(attrs[key].expect); } }); diff --git a/ssr/tag.js b/ssr/tag.js index c256ae60..ad7ef32b 100644 --- a/ssr/tag.js +++ b/ssr/tag.js @@ -26,33 +26,27 @@ export class Attributes { toString() { const attrs = new Map(); for (let prop in this) { - if (Object.prototype.hasOwnProperty.call(this, prop)) { - const value = this[prop]; - const type = typeof value; + const value = this[prop]; + const type = typeof value; - if ( - INTERNAL_PROPS[prop] || - type === "function" || - prop[0] === "_" - ) - continue; + if (INTERNAL_PROPS[prop] || type === "function" || prop[0] === "_") + continue; - const attr = - prop === "className" - ? "class" - : prop.replace( - /([\w])([A-Z])/g, - (all, before, after) => - `${before}-${after.toLowerCase()}`, - ); + const attr = + prop === "className" + ? "class" + : prop.replace( + /([\w])([A-Z])/g, + (all, before, after) => + `${before}-${after.toLowerCase()}`, + ); - if (type === "boolean") { - if (value) attrs.set(attr); - } else if (type === "object") { - attrs.set(attr, JSON.stringify(value)); - } else { - attrs.set(attr, value); - } + if (type === "boolean") { + if (value) attrs.set(attr); + } else if (type === "object") { + attrs.set(attr, JSON.stringify(value)); + } else { + attrs.set(attr, value); } } const list = [...attrs]; From bec313e5ad835413a6dfec02da9af15fda365c15 Mon Sep 17 00:00:00 2001 From: Eike Foken Date: Tue, 31 Oct 2023 20:22:50 +0100 Subject: [PATCH 08/12] Cleanup some JSDoc comments --- jsx-runtime.js | 3 +-- src/context.js | 1 - src/element/custom-element.js | 2 +- src/element/errors.js | 1 - src/element/set-prototype.js | 3 ++- src/hooks/custom-hooks/use-prop.js | 1 - src/hooks/custom-hooks/use-suspense.js | 5 ++--- src/render.js | 5 ----- src/utils.js | 2 -- ssr/load.js | 1 - test-dom.js | 3 +-- 11 files changed, 7 insertions(+), 20 deletions(-) diff --git a/jsx-runtime.js b/jsx-runtime.js index 9751eef1..699aed26 100644 --- a/jsx-runtime.js +++ b/jsx-runtime.js @@ -3,10 +3,9 @@ import { createElement } from "./src/core.js"; export { Fragment } from "./src/core.js"; /** - * * @param {any} type * @param {any} props - * @param {any} [key ] + * @param {any} [key] * @returns */ export const jsx = (type, props, key) => { diff --git a/src/context.js b/src/context.js index 9992224b..30d39b55 100644 --- a/src/context.js +++ b/src/context.js @@ -65,7 +65,6 @@ export const useConsumer = (id) => { }; /** - * * @type {import("context").UseContext} */ export const useContext = (context) => { diff --git a/src/element/custom-element.js b/src/element/custom-element.js index 045a5d7e..8798d917 100644 --- a/src/element/custom-element.js +++ b/src/element/custom-element.js @@ -6,8 +6,8 @@ import { setPrototype, transformValue } from "./set-prototype.js"; export { Any, createType } from "./set-prototype.js"; let ID = 0; + /** - * * @param {Element & {dataset?:object}} node * @returns {string|number} */ diff --git a/src/element/errors.js b/src/element/errors.js index 0bc4b39e..4d1082be 100644 --- a/src/element/errors.js +++ b/src/element/errors.js @@ -1,6 +1,5 @@ export class Error { /** - * * @param {HTMLElement} target * @param {string} message * @param {string} value diff --git a/src/element/set-prototype.js b/src/element/set-prototype.js index 2a1c6d7e..4f48df6c 100644 --- a/src/element/set-prototype.js +++ b/src/element/set-prototype.js @@ -160,7 +160,6 @@ export const transformValue = (type, value) => new type(value); /** - * * @param {import("schema").TypeCustom<(...args:any)=>any>} TypeCustom * @param {*} value * @returns @@ -172,6 +171,7 @@ export const mapValue = ({ map }, value) => { return { value, error: true }; } }; + /** * Filter the values based on their type * @param {any} type @@ -211,6 +211,7 @@ export const createType = (map, serialize) => ({ map, serialize, }); + /** * Type any, used to avoid type validation. * @typedef {null} Any diff --git a/src/hooks/custom-hooks/use-prop.js b/src/hooks/custom-hooks/use-prop.js index fcc75341..8d8eb1bd 100644 --- a/src/hooks/custom-hooks/use-prop.js +++ b/src/hooks/custom-hooks/use-prop.js @@ -1,7 +1,6 @@ import { useHost } from "../create-hooks.js"; /** - * * @type {import("core").UseProp} */ export const useProp = (name) => { diff --git a/src/hooks/custom-hooks/use-suspense.js b/src/hooks/custom-hooks/use-suspense.js index 1426771c..9db8c7bd 100644 --- a/src/hooks/custom-hooks/use-suspense.js +++ b/src/hooks/custom-hooks/use-suspense.js @@ -47,19 +47,17 @@ export const useAsync = (callback, args) => { }; /** - * * @type {import("core").UseSuspense} */ - export const useSuspense = (fps = 8) => { const host = useHost(); + /** * @type {import("internal/hooks").ReturnSetStateUseSuspense} */ const [status, setStatus] = useState({ pending: true }); /** - * * @param {()=>any} callback * @param {number} deep */ @@ -94,6 +92,7 @@ export const useSuspense = (fps = 8) => { }, fps); } }; + /** * @param {Event} event */ diff --git a/src/render.js b/src/render.js index 51110b11..26d4c013 100644 --- a/src/render.js +++ b/src/render.js @@ -226,7 +226,6 @@ function diff(newVnode, node, id = ID, hydrate = false, isSvg = false) { return node; } /** - * * @param {Element|ShadowRoot} parent * @param {boolean} [hydrate] * @return {import("vnode").Fragment} @@ -379,7 +378,6 @@ export function renderChildren(children, fragment, parent, id, hydrate, isSvg) { } /** - * * @param {Element} node * @param {Object} props * @param {Object} nextProps @@ -397,7 +395,6 @@ export function diffProps(node, props, nextProps, handlers, isSvg) { } /** - * * @param {Element} node * @param {string} key * @param {any} prevValue @@ -484,7 +481,6 @@ export function setProperty(node, key, prevValue, nextValue, isSvg, handlers) { } /** - * * @param {Node} node * @param {string} type * @param {import("vnode").VNodeListener} [nextHandler] @@ -519,7 +515,6 @@ export function setEvent(node, type, nextHandler, handlers) { } /** - * * @param {*} style * @param {string} key * @param {string} value diff --git a/src/utils.js b/src/utils.js index 16d8ddab..eea6a0ee 100644 --- a/src/utils.js +++ b/src/utils.js @@ -33,7 +33,6 @@ export const isObject = (value) => typeof value == "object"; export const { isArray } = Array; /** - * * @param {Element & {dataset?:object}} node * @returns */ @@ -83,7 +82,6 @@ export function flat(list, callback) { } /** - * * @param {Element} target * @param {string} type * @param {(event:Event)=>void} handler diff --git a/ssr/load.js b/ssr/load.js index 688f9588..fc8dd7f9 100644 --- a/ssr/load.js +++ b/ssr/load.js @@ -12,7 +12,6 @@ let ID = 0; if (isServer()) setOptions(options); /** - * * @param {import("../src/options").Options} options */ function setOptions(options) { diff --git a/test-dom.js b/test-dom.js index cdac2e4d..74450530 100644 --- a/test-dom.js +++ b/test-dom.js @@ -30,7 +30,6 @@ if (window.beforeEach) { } /** - * * @param {Element} node * @param {string|symbol} [id] * @returns @@ -52,8 +51,8 @@ export const getFragment = (node, id) => { } return children; }; + /** - * * @param {any} Vnode * @returns {HTMLDivElement} */ From 4b00e4f8f6b47bac207abb4edf2a6b91e328e505 Mon Sep 17 00:00:00 2001 From: Eike Foken Date: Wed, 1 Nov 2023 09:10:36 +0100 Subject: [PATCH 09/12] Update .eslintrc --- .eslintrc | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/.eslintrc b/.eslintrc index 27a68304..719ef1fa 100644 --- a/.eslintrc +++ b/.eslintrc @@ -12,6 +12,7 @@ "globals": { "globalThis": false }, + "reportUnusedDisableDirectives": true, "rules": { "class-methods-use-this": "off", "consistent-return": "off", @@ -30,7 +31,7 @@ "no-object-constructor": "error", "no-param-reassign": "off", "no-plusplus": "off", - "no-restricted-syntax": "off", + "no-restricted-syntax": ["error", "LabeledStatement", "WithStatement"], "no-return-assign": "off", "no-shadow": "off", "no-throw-literal": "off", @@ -39,10 +40,7 @@ "no-use-before-define": "off", "prefer-const": "off", "prefer-destructuring": ["error", { "object": true, "array": false }], - "prefer-rest-params": "off", - "prefer-promise-reject-errors": "off", "import/extensions": ["error", "always"], - "import/no-cycle": "off", "import/no-extraneous-dependencies": "off", "import/prefer-default-export": "off" }, @@ -53,6 +51,7 @@ "rules": { "@typescript-eslint/no-shadow": "off", "@typescript-eslint/no-unused-expressions": "off", + "@typescript-eslint/no-use-before-define": "off", "import/extensions": ["error", "always"], "import/no-cycle": "off" } From 81378c80676dde44734f236cb1db8f4ef46c6468 Mon Sep 17 00:00:00 2001 From: Eike Foken Date: Wed, 1 Nov 2023 14:16:50 +0100 Subject: [PATCH 10/12] Fix some more ESLint errors and cleanup --- html.js | 4 ++-- html/html.js | 4 ++-- src/css.js | 2 +- src/hooks/tests/use-promise.test.js | 1 + src/render.js | 2 +- utils.js | 2 +- 6 files changed, 8 insertions(+), 7 deletions(-) diff --git a/html.js b/html.js index 04b4faa4..19c78199 100644 --- a/html.js +++ b/html.js @@ -203,13 +203,13 @@ const build = function(statics) { const CACHE = new Map(); -function html(statics) { +function html(statics, ...values) { let tmp = CACHE; tmp = evaluate( createElement, tmp.get(statics) || (tmp.set(statics, (tmp = build(statics))), tmp), - arguments, + [statics, ...values], [], ); diff --git a/html/html.js b/html/html.js index 824ca7aa..1061ee43 100644 --- a/html/html.js +++ b/html/html.js @@ -3,13 +3,13 @@ import { createElement } from "../src/core.js"; const CACHE = new Map(); -export function html(statics) { +export function html(statics, ...values) { let tmp = CACHE; tmp = evaluate( createElement, tmp.get(statics) || (tmp.set(statics, (tmp = build(statics))), tmp), - arguments, + [statics, ...values], [], ); diff --git a/src/css.js b/src/css.js index 18779817..155a5df4 100644 --- a/src/css.js +++ b/src/css.js @@ -11,7 +11,7 @@ const SHEETS = {}; /** * Create a Style from a string * @param {TemplateStringsArray} template - * @param {...any} args + * @param {...any} args */ export function css(template, ...args) { const cssText = (template.raw || template).reduce( diff --git a/src/hooks/tests/use-promise.test.js b/src/hooks/tests/use-promise.test.js index 45e91306..d63e32ec 100644 --- a/src/hooks/tests/use-promise.test.js +++ b/src/hooks/tests/use-promise.test.js @@ -72,6 +72,7 @@ describe("usePromise", () => { const load = () => { useAbortController(); + // eslint-disable-next-line prefer-promise-reject-errors const promise = usePromise(() => Promise.reject(10), []); switch (cycle++) { case 0: diff --git a/src/render.js b/src/render.js index 26d4c013..91e73cf3 100644 --- a/src/render.js +++ b/src/render.js @@ -299,7 +299,7 @@ export function renderChildren(children, fragment, parent, id, hydrate, isSvg) { children && flat(children, (child) => { - if (typeof child == "object" && child.$$ != $$) { + if (isObject(child) && child.$$ != $$) { return; } diff --git a/utils.js b/utils.js index d440ddc5..6e992b6c 100644 --- a/utils.js +++ b/utils.js @@ -12,7 +12,7 @@ const COMPATIBILITY_LIST = [ /** * serialize a string - * @param {...any} args + * @param {...any} args * @returns {string} */ export const serialize = (...args) => args.filter((value) => value).join(" "); From 6b3de71a3d8283f015b88eba30f557719b990750 Mon Sep 17 00:00:00 2001 From: Eike Foken Date: Wed, 1 Nov 2023 16:38:44 +0100 Subject: [PATCH 11/12] Change JSDoc comments to use consistent TypeScript syntax --- jsx-runtime.js | 1 - src/css.js | 4 +- src/element/custom-element.js | 12 ++--- src/element/set-prototype.js | 62 ++++++++++++------------ src/hooks/create-hooks.js | 2 +- src/hooks/custom-hooks/use-suspense.js | 2 +- src/hooks/use-effect.js | 2 +- src/render.js | 11 +++-- src/tests/internal/set-prototype.test.js | 4 +- src/tests/render-children.test.js | 5 +- src/utils.js | 6 +-- ssr/load.js | 2 +- test-dom.js | 10 ++-- types/core.d.ts | 6 +-- types/hooks.d.ts | 2 +- types/test-hooks.d.ts | 4 +- utils.js | 2 +- 17 files changed, 67 insertions(+), 70 deletions(-) diff --git a/jsx-runtime.js b/jsx-runtime.js index 699aed26..c0aceaa7 100644 --- a/jsx-runtime.js +++ b/jsx-runtime.js @@ -6,7 +6,6 @@ export { Fragment } from "./src/core.js"; * @param {any} type * @param {any} props * @param {any} [key] - * @returns */ export const jsx = (type, props, key) => { if (props == undefined) { diff --git a/src/css.js b/src/css.js index 155a5df4..8e0a1910 100644 --- a/src/css.js +++ b/src/css.js @@ -4,14 +4,14 @@ import { options } from "./options.js"; /** * It is used only if the browser supports adoptedStyleSheets. * caches the CSSStyleSheet using the css as a reference to the instance - * @type {{[id:string]:import("core").Sheet}} + * @type {{ [id: string]: import("core").Sheet }} */ const SHEETS = {}; /** * Create a Style from a string * @param {TemplateStringsArray} template - * @param {...any} args + * @param {any[]} args */ export function css(template, ...args) { const cssText = (template.raw || template).reduce( diff --git a/src/element/custom-element.js b/src/element/custom-element.js index 8798d917..82644b14 100644 --- a/src/element/custom-element.js +++ b/src/element/custom-element.js @@ -8,8 +8,8 @@ export { Any, createType } from "./set-prototype.js"; let ID = 0; /** - * @param {Element & {dataset?:object}} node - * @returns {string|number} + * @param {Element & { dataset?: object }} node + * @returns {string | number} */ const getHydrateId = (node) => { const id = (node?.dataset || {})?.hydrate || ""; @@ -24,11 +24,11 @@ const getHydrateId = (node) => { */ export const c = (component, base) => { /** - * @type {import("./set-prototype").Attrs} + * @type {import("./set-prototype.js").Attrs} */ const attrs = {}; /** - * @type {import("./set-prototype").Values} + * @type {import("./set-prototype.js").Values} */ const values = {}; @@ -194,8 +194,8 @@ export const c = (component, base) => { /** * @this {import("dom").AtomicoThisInternal} * @param {string} attr - * @param {(string|null)} oldValue - * @param {(string|null)} value + * @param {string | null} oldValue + * @param {string | null} value */ attributeChangedCallback(attr, oldValue, value) { if (attrs[attr]) { diff --git a/src/element/set-prototype.js b/src/element/set-prototype.js index 4f48df6c..c2a8b6aa 100644 --- a/src/element/set-prototype.js +++ b/src/element/set-prototype.js @@ -2,6 +2,7 @@ import { isFunction, isObject } from "../utils.js"; import { PropError } from "./errors.js"; export const CUSTOM_TYPE_NAME = "Custom"; + /** * The Any type avoids the validation of prop types * @type {null} @@ -16,11 +17,11 @@ const TRUE_VALUES = { true: 1, "": 1, 1: 1 }; /** * Constructs the setter and getter of the associated property * only if it is not defined in the prototype - * @param {Object} prototype - CustomElement prototype - * @param {string} prop - Name of the reactive property to associate with the customElement - * @param {any} schema - Structure to be evaluated for the definition of the property - * @param {Attrs} attrs - Dictionary of attributes to properties - * @param {Values} values - Values to initialize the customElements + * @param {object} prototype CustomElement prototype + * @param {string} prop Name of the reactive property to associate with the customElement + * @param {any} schema Structure to be evaluated for the definition of the property + * @param {Attrs} attrs Dictionary of attributes to properties + * @param {Values} values Values to initialize the customElements */ export function setPrototype(prototype, prop, schema, attrs, values) { /** @type {Schema} */ @@ -103,8 +104,8 @@ export function setPrototype(prototype, prop, schema, attrs, values) { /** * Dispatch an event - * @param {Element} node - DOM node to dispatch the event - * @param {InternalEvent & InternalEventInit} event - Event to dispatch on node + * @param {Element} node DOM node to dispatch the event + * @param {InternalEvent & InternalEventInit} event Event to dispatch on node */ export const dispatchEvent = ( node, @@ -113,7 +114,7 @@ export const dispatchEvent = ( /** * Transform a Camel Case string to a Kebab case - * @param {string} prop - string to apply the format + * @param {string} prop string to apply the format * @returns {string} */ export const getAttr = (prop) => prop.replace(/([A-Z])/g, "-$1").toLowerCase(); @@ -160,9 +161,8 @@ export const transformValue = (type, value) => new type(value); /** - * @param {import("schema").TypeCustom<(...args:any)=>any>} TypeCustom - * @param {*} value - * @returns + * @param {import("schema").TypeCustom<(...args: any[]) => any>} TypeCustom + * @param {any} value */ export const mapValue = ({ map }, value) => { try { @@ -176,7 +176,7 @@ export const mapValue = ({ map }, value) => { * Filter the values based on their type * @param {any} type * @param {any} value - * @returns {{error?:boolean,value:any}} + * @returns {{ error?: boolean, value: any }} */ export const filterValue = (type, value) => type == null || value == null @@ -202,9 +202,9 @@ export const filterValue = (type, value) => : { value, error: true }; /** - * @param {(...args:any[])=>any} map - * @param {(...args:any[])=>any} [serialize] - * @returns {import("schema").TypeCustom<(...args:any)=>any>} + * @param {(...args: any[]) => any} map + * @param {(...args: any[]) => any} [serialize] + * @returns {import("schema").TypeCustom<(...args: any[]) => any>} */ export const createType = (map, serialize) => ({ name: CUSTOM_TYPE_NAME, @@ -218,33 +218,33 @@ export const createType = (map, serialize) => ({ */ /** - * @typedef {Object} InternalEventInit - * @property {typeof CustomEvent|typeof Event} [base] - Optional constructor to initialize the event - * @property {boolean} [bubbles] - indicating whether the event bubbles. The default is false. - * @property {boolean} [cancelable] - indicating whether the event will trigger listeners outside of a shadow root. - * @property {boolean} [composed] - indicating whether the event will trigger listeners outside of a shadow root. - * @property {any} [detail] - indicating whether the event will trigger listeners outside of a shadow root. + * @typedef {object} InternalEventInit + * @property {typeof CustomEvent | typeof Event} [base] Optional constructor to initialize the event + * @property {boolean} [bubbles] indicating whether the event bubbles. The default is false. + * @property {boolean} [cancelable] indicating whether the event will trigger listeners outside of a shadow root. + * @property {boolean} [composed] indicating whether the event will trigger listeners outside of a shadow root. + * @property {any} [detail] indicating whether the event will trigger listeners outside of a shadow root. */ /** * Interface used by dispatchEvent to automate event firing - * @typedef {Object} InternalEvent - * @property {string} type - type of event to dispatch. + * @typedef {object} InternalEvent + * @property {string} type type of event to dispatch. */ /** - * @typedef {Object} Attrs + * @typedef {{ [attr: string]: { prop: string, type: Function } }} Attrs */ /** - * @typedef {Object} Values + * @typedef {{ [prop: string]: any }} Values */ /** - * @typedef {Object} Schema - * @property {any} [type] - data type to be worked as property and attribute - * @property {string} [attr] - allows customizing the name as an attribute by skipping the camelCase format - * @property {boolean} [reflect] - reflects property as attribute of node - * @property {InternalEvent & InternalEventInit} [event] - Allows to emit an event every time the property changes - * @property {any} [value] - defines a default value when instantiating the component + * @typedef {object} Schema + * @property {any} [type] data type to be worked as property and attribute + * @property {string} [attr] allows customizing the name as an attribute by skipping the camelCase format + * @property {boolean} [reflect] reflects property as attribute of node + * @property {InternalEvent & InternalEventInit} [event] Allows to emit an event every time the property changes + * @property {any} [value] defines a default value when instantiating the component */ diff --git a/src/hooks/create-hooks.js b/src/hooks/create-hooks.js index 79ad4840..e753ff98 100644 --- a/src/hooks/create-hooks.js +++ b/src/hooks/create-hooks.js @@ -5,7 +5,7 @@ const ID = Symbol.for("atomico.hooks"); globalThis[ID] = globalThis[ID] || {}; /** - * @type {{c:import("internal/hooks").SCOPE}} + * @type {{ c: import("internal/hooks").SCOPE }} */ let SCOPE = globalThis[ID]; diff --git a/src/hooks/custom-hooks/use-suspense.js b/src/hooks/custom-hooks/use-suspense.js index 9db8c7bd..f3b785ac 100644 --- a/src/hooks/custom-hooks/use-suspense.js +++ b/src/hooks/custom-hooks/use-suspense.js @@ -58,7 +58,7 @@ export const useSuspense = (fps = 8) => { const [status, setStatus] = useState({ pending: true }); /** - * @param {()=>any} callback + * @param {() => any} callback * @param {number} deep */ const delay = (callback, deep) => diff --git a/src/hooks/use-effect.js b/src/hooks/use-effect.js index 88d9030e..b3bd4bec 100644 --- a/src/hooks/use-effect.js +++ b/src/hooks/use-effect.js @@ -9,7 +9,7 @@ import { isEqualArray, isFunction } from "../utils.js"; /** * useLayoutEffect and useEffect have a similar algorithm * in that the position of the callback varies. - * @param {IdLayoutEffect|IdEffect|IdInsertionEffect} type + * @param {IdLayoutEffect | IdEffect | IdInsertionEffect} type * @return {import("internal/hooks").UseAnyEffect} */ const createEffect = (type) => (currentEffect, currentArgs) => { diff --git a/src/render.js b/src/render.js index 91e73cf3..3e24d9e2 100644 --- a/src/render.js +++ b/src/render.js @@ -56,6 +56,7 @@ export const Fragment = () => {}; export function RENDER(node, id, hydrate) { return diff(this, node, id, hydrate); } + /** * @type {import("vnode").H} */ @@ -226,7 +227,7 @@ function diff(newVnode, node, id = ID, hydrate = false, isSvg = false) { return node; } /** - * @param {Element|ShadowRoot} parent + * @param {Element | ShadowRoot} parent * @param {boolean} [hydrate] * @return {import("vnode").Fragment} */ @@ -269,7 +270,7 @@ function createFragment(parent, hydrate) { * it allows rendering the children of the virtual-dom * @param {any} children * @param {import("vnode").Fragment} fragment - * @param {Element|ShadowRoot} parent + * @param {Element | ShadowRoot} parent * @param {any} id * @param {boolean} [hydrate] * @param {boolean} [isSvg] @@ -379,8 +380,8 @@ export function renderChildren(children, fragment, parent, id, hydrate, isSvg) { /** * @param {Element} node - * @param {Object} props - * @param {Object} nextProps + * @param {object} props + * @param {object} nextProps * @param {boolean} isSvg * @param {import("vnode").Handlers} handlers */ @@ -515,7 +516,7 @@ export function setEvent(node, type, nextHandler, handlers) { } /** - * @param {*} style + * @param {any} style * @param {string} key * @param {string} value */ diff --git a/src/tests/internal/set-prototype.test.js b/src/tests/internal/set-prototype.test.js index ed9445ad..d907055b 100644 --- a/src/tests/internal/set-prototype.test.js +++ b/src/tests/internal/set-prototype.test.js @@ -151,7 +151,7 @@ describe("internal: setPrototype", () => { it("declare basic", () => { class MyElement extends HTMLElement {} /** - * @type {Object} + * @type {import("../../element/set-prototype.js").Attrs} */ const attrs = {}; const values = {}; @@ -164,7 +164,7 @@ describe("internal: setPrototype", () => { it("declare shema", () => { class MyElement extends HTMLElement {} /** - * @type {Object} + * @type {import("../../element/set-prototype.js").Attrs} */ const attrs = {}; const values = {}; diff --git a/src/tests/render-children.test.js b/src/tests/render-children.test.js index 214febbe..768dd340 100644 --- a/src/tests/render-children.test.js +++ b/src/tests/render-children.test.js @@ -2,7 +2,7 @@ import { expect } from "@esm-bundle/chai"; import { renderChildren } from "../render.js"; import { html } from "../../html.js"; /** - * @param {import("../render").Fragment} fragment + * @param {import("vnode").Fragment} fragment * @returns {Node[]} */ const fragmentToChildNodes = ({ markStart, markEnd }) => { @@ -13,14 +13,12 @@ const fragmentToChildNodes = ({ markStart, markEnd }) => { return list; }; /** - * * @param {number} min * @param {number} max * @returns {number} */ const random = (min, max) => Math.floor(Math.random() * (max - min + 1)) + min; /** - * * @param {number} size * @returns {number[]} */ @@ -79,7 +77,6 @@ describe("src/render#children", () => { const id = Symbol("id"); let fragment; /** - * * @param {number} size */ let update = (size) => { diff --git a/src/utils.js b/src/utils.js index eea6a0ee..74dbd4f5 100644 --- a/src/utils.js +++ b/src/utils.js @@ -33,7 +33,7 @@ export const isObject = (value) => typeof value == "object"; export const { isArray } = Array; /** - * @param {Element & {dataset?:object}} node + * @param {Element & { dataset?: object }} node * @returns */ export const isHydrate = (node) => "hydrate" in (node?.dataset || {}); @@ -41,7 +41,7 @@ export const isHydrate = (node) => "hydrate" in (node?.dataset || {}); /** * @template {any[]} T * @param {T} list - * @param {(value:T[0])=>void} callback + * @param {(value: T[0]) => void} callback */ export function flat(list, callback) { let last; @@ -84,7 +84,7 @@ export function flat(list, callback) { /** * @param {Element} target * @param {string} type - * @param {(event:Event)=>void} handler + * @param {(event: Event) => void} handler */ export const addListener = (target, type, handler) => { target.addEventListener(type, handler); diff --git a/ssr/load.js b/ssr/load.js index fc8dd7f9..4f366214 100644 --- a/ssr/load.js +++ b/ssr/load.js @@ -12,7 +12,7 @@ let ID = 0; if (isServer()) setOptions(options); /** - * @param {import("../src/options").Options} options + * @param {import("core").Options} options */ function setOptions(options) { if (!isServer()) return; diff --git a/test-dom.js b/test-dom.js index 74450530..336ede3a 100644 --- a/test-dom.js +++ b/test-dom.js @@ -2,7 +2,7 @@ import { h, render, Mark } from "./src/core.js"; import { isArray } from "./src/utils.js"; /** - * @type {Object} + * @type {{ [id: string]: { ref: HTMLDivElement, id: number, mount?: boolean } }} */ const TEST_HOST = {}; @@ -31,7 +31,7 @@ if (window.beforeEach) { /** * @param {Element} node - * @param {string|symbol} [id] + * @param {string | symbol} [id] * @returns */ export const getFragment = (node, id) => { @@ -53,7 +53,7 @@ export const getFragment = (node, id) => { }; /** - * @param {any} Vnode + * @param {any} vnode * @returns {HTMLDivElement} */ export function fixture(vnode) { @@ -84,7 +84,7 @@ export function fixture(vnode) { } /** - * @param {ChildNode | typeof window } node + * @param {ChildNode | typeof window} node * @param {string} type * @param {boolean | AddEventListenerOptions} [options] * @returns {Promise} @@ -95,7 +95,7 @@ export const asyncEventListener = (node, type, options) => }); /** - * @type {import("./types/test-dom").DispatchEvent} + * @type {import("./types/test-dom.js").DispatchEvent} */ export const dispatchEvent = (currentTarget, event, target) => { if (target != null) { diff --git a/types/core.d.ts b/types/core.d.ts index 360cf6a7..3515b9e0 100644 --- a/types/core.d.ts +++ b/types/core.d.ts @@ -165,9 +165,9 @@ export const useUpdate: Hooks.UseUpdate; /** * This hook is low level, it allows to know the render cycles of the hooks - * @param render - callback that runs between renders - * @param layoutEffect - callback that is executed after rendering - * @param effect - callback that is executed after layoutEffect + * @param render callback that runs between renders + * @param layoutEffect callback that is executed after rendering + * @param effect callback that is executed after layoutEffect */ export const useHook: Hooks.UseHook; diff --git a/types/hooks.d.ts b/types/hooks.d.ts index a0df12f5..f3cf2fd5 100644 --- a/types/hooks.d.ts +++ b/types/hooks.d.ts @@ -197,7 +197,7 @@ export type ReturnUseSuspense = }; /** - * @param fps - allows to delay in FPS the update of states + * @param fps allows to delay in FPS the update of states */ export type UseSuspense = (fps?: number) => ReturnUseSuspense; diff --git a/types/test-hooks.d.ts b/types/test-hooks.d.ts index 1eafa7cf..ec010682 100644 --- a/types/test-hooks.d.ts +++ b/types/test-hooks.d.ts @@ -4,7 +4,7 @@ export interface Hooks { } /** * create a scope for executing hooks without the need for components - * @param render - function that receives updates dispatched by useState or useReducer - * @param host - current for the useHost hook + * @param render function that receives updates dispatched by useState or useReducer + * @param host current for the useHost hook */ export function createHooks(render?: (result?: any) => any, host?: any): Hooks; diff --git a/utils.js b/utils.js index 6e992b6c..b1723c0a 100644 --- a/utils.js +++ b/utils.js @@ -12,7 +12,7 @@ const COMPATIBILITY_LIST = [ /** * serialize a string - * @param {...any} args + * @param {any[]} args * @returns {string} */ export const serialize = (...args) => args.filter((value) => value).join(" "); From 41ceb457deeb1ceb36b0999c6f376d35c2d1f5b8 Mon Sep 17 00:00:00 2001 From: Eike Foken Date: Wed, 1 Nov 2023 16:47:59 +0100 Subject: [PATCH 12/12] Update .npmignore --- .npmignore | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/.npmignore b/.npmignore index bbcdd4e2..da7109e4 100644 --- a/.npmignore +++ b/.npmignore @@ -1,4 +1,6 @@ -/.circleci +/.github +/.husky +/.vscode /*.log /node_modules /docs @@ -7,4 +9,5 @@ /jsconfig.json /karma.conf.js /rollup.config.js +/web-test-runner.config.mjs **/tests/