diff --git a/README-in_HN.md b/README-in_HN.md index 63036ca..d256b62 100644 --- a/README-in_HN.md +++ b/README-in_HN.md @@ -390,10 +390,10 @@ patch(vnode1, vnode2); ```mjs const myModule = { - create: function (oldVnode, vnode) { + create: (oldVnode, vnode) => { // invoked whenever a new virtual node is created }, - update: function (oldVnode, vnode) { + update: (oldVnode, vnode) => { // invoked whenever a virtual node is updated } }; @@ -640,7 +640,7 @@ In particular, you should **not** do something like this: ```mjs // Does not work const sharedHandler = { - change: function (e) { + change: (e) => { console.log("you chose: " + e.target.value); } }; @@ -665,7 +665,7 @@ h("div", [ ```mjs // Works -const sharedHandler = function (e) { +const sharedHandler = (e) => { console.log("you chose: " + e.target.value); }; h("div", [ diff --git a/README-zh_CN.md b/README-zh_CN.md index 5a1b16b..340828a 100644 --- a/README-zh_CN.md +++ b/README-zh_CN.md @@ -345,10 +345,10 @@ patch(vnode1, vnode2); ```mjs const myModule = { - create: function (oldVnode, vnode) { + create: (oldVnode, vnode) => { // invoked whenever a new virtual node is created }, - update: function (oldVnode, vnode) { + update: (oldVnode, vnode) => { // invoked whenever a virtual node is updated } }; diff --git a/README.md b/README.md index 7d7f05c..8a7761f 100644 --- a/README.md +++ b/README.md @@ -395,10 +395,10 @@ Modules work by registering global listeners for [hooks](#hooks). A module is si ```mjs const myModule = { - create: function (oldVnode, vnode) { + create: (oldVnode, vnode) => { // invoked whenever a new virtual node is created }, - update: function (oldVnode, vnode) { + update: (oldVnode, vnode) => { // invoked whenever a virtual node is updated } }; @@ -648,7 +648,7 @@ In particular, you should **not** do something like this: ```mjs // Does not work const sharedHandler = { - change: function (e) { + change: (e) => { console.log("you chose: " + e.target.value); } }; @@ -673,7 +673,7 @@ Alternatively, simply make sure each node is passed unique `on` values: ```mjs // Works -const sharedHandler = function (e) { +const sharedHandler = (e) => { console.log("you chose: " + e.target.value); }; h("div", [ diff --git a/examples/hero/hero.js b/examples/hero/hero.js index 2448051..f8195f2 100644 --- a/examples/hero/hero.js +++ b/examples/hero/hero.js @@ -1,14 +1,14 @@ const raf = (typeof window !== "undefined" && window.requestAnimationFrame) || setTimeout; -const nextFrame = function (fn) { - raf(function () { +const nextFrame = (fn) => { + raf(() => { raf(fn); }); }; function setNextFrame(obj, prop, val) { - nextFrame(function () { + nextFrame(() => { obj[prop] = val; }); } @@ -193,7 +193,7 @@ function post() { `translate(${-dx}px, ${-dy}px) scale(${wRatio}, ${hRatio})` ); // scale must be on far right for translate to be correct setNextFrame(oldStyle, "opacity", "0"); - oldElm.addEventListener("transitionend", function (ev) { + oldElm.addEventListener("transitionend", (ev) => { if (ev.propertyName === "transform") { document.body.removeChild(ev.target); } diff --git a/examples/reorder-animation/index.js b/examples/reorder-animation/index.js index 7a676f0..46ffa6c 100644 --- a/examples/reorder-animation/index.js +++ b/examples/reorder-animation/index.js @@ -119,9 +119,7 @@ function add() { } function remove(movie) { - data = data.filter((m) => { - return m !== movie; - }); + data = data.filter((m) => m !== movie); render(); } diff --git a/perf/benchmarks.js b/perf/benchmarks.js index 39560c9..d536b7d 100644 --- a/perf/benchmarks.js +++ b/perf/benchmarks.js @@ -23,16 +23,16 @@ for (var n = 0; n < elms; ++n) { arr[n] = n; } -document.addEventListener("DOMContentLoaded", function () { +document.addEventListener("DOMContentLoaded", () => { var elm = (global.elm = document.getElementById("container")); // add tests suite .add("a/ insert first", { - setup: function () { + setup: () => { var vnode1 = a.h("div", arr.map(a.spanNum)); var vnode2 = a.h("div", ["new"].concat(arr).map(a.spanNum)); }, - fn: function () { + fn: () => { var emptyNode = a.emptyNodeAt(elm); a.patch(emptyNode, vnode1); a.patch(vnode1, vnode2); @@ -40,11 +40,11 @@ document.addEventListener("DOMContentLoaded", function () { } }) .add("b/ insert first", { - setup: function () { + setup: () => { var vnode1 = b.h("div", arr.map(b.spanNum)); var vnode2 = b.h("div", ["new"].concat(arr).map(b.spanNum)); }, - fn: function () { + fn: () => { var emptyNode = b.emptyNodeAt(elm); b.patch(emptyNode, vnode1); b.patch(vnode1, vnode2); @@ -52,10 +52,10 @@ document.addEventListener("DOMContentLoaded", function () { } }) // add listeners - .on("cycle", function (event) { + .on("cycle", (event) => { console.log(String(event.target)); }) - .on("complete", function () { + .on("complete", () => { console.log("Fastest is " + this.filter("fastest").pluck("name")); }) // run async diff --git a/src/init.ts b/src/init.ts index bb4920d..6ab66df 100644 --- a/src/init.ts +++ b/src/init.ts @@ -3,15 +3,6 @@ import { Key, vnode, VNode } from "./vnode"; import * as is from "./is"; import { htmlDomApi, DOMAPI } from "./htmldomapi"; -type NonUndefined = T extends undefined ? never : T; - -function isUndef(s: any): boolean { - return s === undefined; -} -function isDef(s: A): s is NonUndefined { - return s !== undefined; -} - type VNodeQueue = VNode[]; const emptyNode = vnode("", {}, [], undefined, undefined); @@ -146,22 +137,15 @@ export function init( } function createElm(vnode: VNode, insertedVnodeQueue: VNodeQueue): Node { - let i: any; - let data = vnode.data; - if (data !== undefined) { - const init = data.hook?.init; - if (isDef(init)) { - init(vnode); - data = vnode.data; - } - } + let i: number; + const data = vnode.data; + const hook = data?.hook; + hook?.init?.(vnode); const children = vnode.children; const sel = vnode.sel; if (sel === "!") { - if (isUndef(vnode.text)) { - vnode.text = ""; - } - vnode.elm = api.createComment(vnode.text!); + vnode.text ??= ""; + vnode.elm = api.createComment(vnode.text); } else if (sel === "") { // textNode has no selector vnode.elm = api.createTextNode(vnode.text!); @@ -175,10 +159,12 @@ export function init( hashIdx !== -1 || dotIdx !== -1 ? sel.slice(0, Math.min(hash, dot)) : sel; - const elm = (vnode.elm = - isDef(data) && isDef((i = data.ns)) - ? api.createElementNS(i, tag, data) - : api.createElement(tag, data)); + const ns = data?.ns; + const elm = + ns === undefined + ? api.createElement(tag, data) + : api.createElementNS(ns, tag, data); + vnode.elm = elm; if (hash < dot) elm.setAttribute("id", sel.slice(hash + 1, dot)); if (dotIdx > 0) elm.setAttribute("class", sel.slice(dot + 1).replace(/\./g, " ")); @@ -198,10 +184,9 @@ export function init( } } } - const hook = vnode.data!.hook; - if (isDef(hook)) { + if (hook !== undefined) { hook.create?.(emptyNode, vnode); - if (hook.insert) { + if (hook.insert !== undefined) { insertedVnodeQueue.push(vnode); } } @@ -265,16 +250,15 @@ export function init( ): void { for (; startIdx <= endIdx; ++startIdx) { let listeners: number; - let rm: () => void; const ch = vnodes[startIdx]; if (ch != null) { - if (isDef(ch.sel)) { + if (ch.sel !== undefined) { invokeDestroyHook(ch); listeners = cbs.remove.length + 1; - rm = createRmCb(ch.elm!, listeners); + const rm = createRmCb(ch.elm!, listeners); for (let i = 0; i < cbs.remove.length; ++i) cbs.remove[i](ch, rm); const removeHook = ch?.data?.hook?.remove; - if (isDef(removeHook)) { + if (removeHook !== undefined) { removeHook(ch, rm); } else { rm(); @@ -353,7 +337,7 @@ export function init( oldKeyToIdx = createKeyToOldIdx(oldCh, oldStartIdx, oldEndIdx); } idxInOld = oldKeyToIdx[newStartVnode.key!]; - if (isUndef(idxInOld)) { + if (idxInOld === undefined) { // `newStartVnode` is new, create and insert it in beginning api.insertBefore( parentElm, @@ -361,7 +345,7 @@ export function init( oldStartVnode.elm! ); newStartVnode = newCh[++newStartIdx]; - } else if (isUndef(oldKeyToIdx[newEndVnode.key!])) { + } else if (oldKeyToIdx[newEndVnode.key!] === undefined) { // `newEndVnode` is new, create and insert it in the end api.insertBefore( parentElm, @@ -416,7 +400,7 @@ export function init( if (oldVnode === vnode) return; if ( vnode.data !== undefined || - (isDef(vnode.text) && vnode.text !== oldVnode.text) + (vnode.text !== undefined && vnode.text !== oldVnode.text) ) { vnode.data ??= {}; oldVnode.data ??= {}; @@ -426,22 +410,22 @@ export function init( } const oldCh = oldVnode.children as VNode[]; const ch = vnode.children as VNode[]; - if (isUndef(vnode.text)) { - if (isDef(oldCh) && isDef(ch)) { + if (vnode.text === undefined) { + if (oldCh !== undefined && ch !== undefined) { if (oldCh !== ch) updateChildren(elm, oldCh, ch, insertedVnodeQueue); - } else if (isDef(ch)) { - if (isDef(oldVnode.text)) api.setTextContent(elm, ""); + } else if (ch !== undefined) { + if (oldVnode.text !== undefined) api.setTextContent(elm, ""); addVnodes(elm, null, ch, 0, ch.length - 1, insertedVnodeQueue); - } else if (isDef(oldCh)) { + } else if (oldCh !== undefined) { removeVnodes(elm, oldCh, 0, oldCh.length - 1); - } else if (isDef(oldVnode.text)) { + } else if (oldVnode.text !== undefined) { api.setTextContent(elm, ""); } } else if (oldVnode.text !== vnode.text) { - if (isDef(oldCh)) { + if (oldCh !== undefined) { removeVnodes(elm, oldCh, 0, oldCh.length - 1); } - api.setTextContent(elm, vnode.text!); + api.setTextContent(elm, vnode.text); } hook?.postpatch?.(oldVnode, vnode); } diff --git a/src/modules/style.ts b/src/modules/style.ts index 9629fa9..36a38f6 100755 --- a/src/modules/style.ts +++ b/src/modules/style.ts @@ -15,15 +15,15 @@ const raf = ? window.requestAnimationFrame.bind(window) : setTimeout; -const nextFrame = function (fn: any) { - raf(function () { +const nextFrame = (fn: any) => { + raf(() => { raf(fn); }); }; let reflowForced = false; function setNextFrame(obj: any, prop: string, val: any): void { - nextFrame(function () { + nextFrame(() => { obj[prop] = val; }); } @@ -106,13 +106,10 @@ function applyRemoveStyle(vnode: VNode, rm: () => void): void { for (; i < props.length; ++i) { if (applied.indexOf(props[i]) !== -1) amount++; } - (elm as Element).addEventListener( - "transitionend", - function (ev: TransitionEvent) { - if (ev.target === elm) --amount; - if (amount === 0) rm(); - } - ); + (elm as Element).addEventListener("transitionend", (ev: TransitionEvent) => { + if (ev.target === elm) --amount; + if (amount === 0) rm(); + }); } function forceReflow() { diff --git a/test/unit/attachto.ts b/test/unit/attachto.ts index 78e3148..b816a17 100644 --- a/test/unit/attachto.ts +++ b/test/unit/attachto.ts @@ -4,13 +4,13 @@ import { init, RemoveHook, attachTo, h } from "../../src/index"; const patch = init([]); -describe("attachTo", function () { +describe("attachTo", () => { let elm: any, vnode0: any; - beforeEach(function () { + beforeEach(() => { elm = document.createElement("div"); vnode0 = elm; }); - it("adds element to target", function () { + it("adds element to target", () => { const vnode1 = h("div", [ h("div#wrapper", [ h("div", "Some element"), @@ -20,7 +20,7 @@ describe("attachTo", function () { elm = patch(vnode0, vnode1).elm; assert.strictEqual(elm.children.length, 2); }); - it("updates element at target", function () { + it("updates element at target", () => { const vnode1 = h("div", [ h("div#wrapper", [ h("div", "Some element"), @@ -38,7 +38,7 @@ describe("attachTo", function () { elm = patch(vnode1, vnode2).elm; assert.strictEqual(elm.children[0].innerHTML, "New text"); }); - it("element can be inserted before modal", function () { + it("element can be inserted before modal", () => { const vnode1 = h("div", [ h("div#wrapper", [ h("div", "Some element"), @@ -57,7 +57,7 @@ describe("attachTo", function () { elm = patch(vnode1, vnode2).elm; assert.strictEqual(elm.children[0].innerHTML, "Text"); }); - it("removes element at target", function () { + it("removes element at target", () => { const vnode1 = h("div", [ h("div#wrapper", [ h("div", "Some element"), @@ -70,7 +70,7 @@ describe("attachTo", function () { elm = patch(vnode1, vnode2).elm; assert.strictEqual(elm.children.length, 1); }); - it("remove hook receives real element", function () { + it("remove hook receives real element", () => { const rm: RemoveHook = (vnode, cb) => { const elm = vnode.elm as HTMLDivElement; assert.strictEqual(elm.tagName, "DIV"); diff --git a/test/unit/attributes.ts b/test/unit/attributes.ts index 80c1406..aa74706 100644 --- a/test/unit/attributes.ts +++ b/test/unit/attributes.ts @@ -4,13 +4,13 @@ import { init, attributesModule, h } from "../../src/index"; const patch = init([attributesModule]); -describe("attributes", function () { +describe("attributes", () => { let elm: any, vnode0: any; - beforeEach(function () { + beforeEach(() => { elm = document.createElement("div"); vnode0 = elm; }); - it("have their provided values", function () { + it("have their provided values", () => { const vnode1 = h("div", { attrs: { href: "/foo", minlength: 1, selected: true, disabled: false } }); @@ -21,7 +21,7 @@ describe("attributes", function () { assert.strictEqual(elm.getAttribute("selected"), ""); assert.strictEqual(elm.hasAttribute("disabled"), false); }); - it("can be memoized", function () { + it("can be memoized", () => { const cachedAttrs = { href: "/foo", minlength: 1, selected: true }; const vnode1 = h("div", { attrs: cachedAttrs }); const vnode2 = h("div", { attrs: cachedAttrs }); @@ -34,7 +34,7 @@ describe("attributes", function () { assert.strictEqual(elm.getAttribute("minlength"), "1"); assert.strictEqual(elm.getAttribute("selected"), ""); }); - it("are not omitted when falsy values are provided", function () { + it("are not omitted when falsy values are provided", () => { const vnode1 = h("div", { attrs: { href: null as any, minlength: 0, value: "", title: "undefined" } }); @@ -44,7 +44,7 @@ describe("attributes", function () { assert.ok(elm.hasAttribute("value")); assert.ok(elm.hasAttribute("title")); }); - it("are set correctly when namespaced", function () { + it("are set correctly when namespaced", () => { const vnode1 = h("div", { attrs: { "xlink:href": "#foo" } }); elm = patch(vnode0, vnode1).elm; assert.strictEqual( @@ -52,7 +52,7 @@ describe("attributes", function () { "#foo" ); }); - it("should not touch class nor id fields", function () { + it("should not touch class nor id fields", () => { elm = document.createElement("div"); elm.id = "myId"; elm.className = "myClass"; @@ -64,7 +64,7 @@ describe("attributes", function () { assert.strictEqual(elm.className, "myClass"); assert.strictEqual(elm.textContent, "Hello"); }); - it("should apply legacy namespace attributes, xmlns", function () { + it("should apply legacy namespace attributes, xmlns", () => { const elmNamespaceQualifiedName = "xmlns:xlink"; const elmNamespaceValue = "http://www.w3.org/1999/xlink"; const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg"); @@ -84,8 +84,8 @@ describe("attributes", function () { elmNamespaceValue ); }); - describe("boolean attribute", function () { - it("is present and empty string if the value is truthy", function () { + describe("boolean attribute", () => { + it("is present and empty string if the value is truthy", () => { const vnode1 = h("div", { attrs: { required: true, readonly: 1, noresize: "truthy" } }); @@ -97,13 +97,13 @@ describe("attributes", function () { assert.strictEqual(elm.hasAttribute("noresize"), true); assert.strictEqual(elm.getAttribute("noresize"), "truthy"); }); - it("is omitted if the value is false", function () { + it("is omitted if the value is false", () => { const vnode1 = h("div", { attrs: { required: false } }); elm = patch(vnode0, vnode1).elm; assert.strictEqual(elm.hasAttribute("required"), false); assert.strictEqual(elm.getAttribute("required"), null); }); - it("is not omitted if the value is falsy", function () { + it("is not omitted if the value is falsy", () => { const vnode1 = h("div", { attrs: { readonly: 0, noresize: null as any } }); @@ -112,8 +112,8 @@ describe("attributes", function () { assert.ok(elm.hasAttribute("noresize")); }); }); - describe("Object.prototype property", function () { - it("is not considered as a boolean attribute and shouldn't be omitted", function () { + describe("Object.prototype property", () => { + it("is not considered as a boolean attribute and shouldn't be omitted", () => { const vnode1 = h("div", { attrs: { constructor: true } }); elm = patch(vnode0, vnode1).elm; assert.strictEqual(elm.hasAttribute("constructor"), true); diff --git a/test/unit/core.ts b/test/unit/core.ts index 7ce60da..661c5a1 100644 --- a/test/unit/core.ts +++ b/test/unit/core.ts @@ -32,7 +32,7 @@ const patch = init( ); /** Shuffle an array using Durstenfeld's version of the Fisher–Yates shuffle. */ -function shuffle(arr) { +function shuffle(arr: A[]): A[] { arr = arr.slice(); for (let i = arr.length; i--; ) { const j = Math.floor(Math.random() * (i + 1)); @@ -44,9 +44,7 @@ function shuffle(arr) { } function prop(name: string) { - return function (obj: { [index: string]: T }) { - return obj[name]; - }; + return (obj: { [index: string]: T }) => obj[name]; } function map(fn: any, list: any[]) { @@ -59,81 +57,81 @@ function map(fn: any, list: any[]) { const inner = prop("innerHTML"); -describe("snabbdom", function () { +describe("snabbdom", () => { let elm: any, vnode0: any; - beforeEach(function () { + beforeEach(() => { elm = document.createElement("div"); vnode0 = elm; }); - describe("hyperscript", function () { - it("can create vnode with proper tag", function () { + describe("hyperscript", () => { + it("can create vnode with proper tag", () => { assert.strictEqual(h("div").sel, "div"); assert.strictEqual(h("a").sel, "a"); }); - it("can create vnode with children", function () { + it("can create vnode with children", () => { const vnode = h("div", [h("span#hello"), h("b.world")]); assert.strictEqual(vnode.sel, "div"); const children = vnode.children as [VNode, VNode]; assert.strictEqual(children[0].sel, "span#hello"); assert.strictEqual(children[1].sel, "b.world"); }); - it("can create vnode with one child vnode", function () { + it("can create vnode with one child vnode", () => { const vnode = h("div", h("span#hello")); assert.strictEqual(vnode.sel, "div"); const children = vnode.children as [VNode]; assert.strictEqual(children[0].sel, "span#hello"); }); - it("can create vnode with props and one child vnode", function () { + it("can create vnode with props and one child vnode", () => { const vnode = h("div", {}, h("span#hello")); assert.strictEqual(vnode.sel, "div"); const children = vnode.children as [VNode]; assert.strictEqual(children[0].sel, "span#hello"); }); - it("can create vnode with text content", function () { + it("can create vnode with text content", () => { const vnode = h("a", ["I am a string"]); const children = vnode.children as [VNode]; assert.strictEqual(children[0].text, "I am a string"); }); - it("can create vnode with text content in string", function () { + it("can create vnode with text content in string", () => { const vnode = h("a", "I am a string"); assert.strictEqual(vnode.text, "I am a string"); }); - it("can create vnode with props and text content in string", function () { + it("can create vnode with props and text content in string", () => { const vnode = h("a", {}, "I am a string"); assert.strictEqual(vnode.text, "I am a string"); }); - it("can create vnode with String obj content", function () { + it("can create vnode with String obj content", () => { const vnode = h("a", new String("b")); assert.equal(vnode.text, "b"); }); - it("can create vnode with props and String obj content", function () { + it("can create vnode with props and String obj content", () => { const vnode = h("a", {}, new String("b")); assert.equal(vnode.text, "b"); }); - it("can create vnode with Number obj content", function () { + it("can create vnode with Number obj content", () => { const vnode = h("a", new Number(1)); assert.equal(vnode.text, "1"); }); - it("can create vnode with null props", function () { + it("can create vnode with null props", () => { let vnode = h("a", null); assert.deepEqual(vnode.data, {}); vnode = h("a", null, ["I am a string"]); const children = vnode.children as [VNode]; assert.strictEqual(children[0].text, "I am a string"); }); - it("can create vnode for comment", function () { + it("can create vnode for comment", () => { const vnode = h("!", "test"); assert.strictEqual(vnode.sel, "!"); assert.strictEqual(vnode.text, "test"); }); }); - describe("created element", function () { - it("has tag", function () { + describe("created element", () => { + it("has tag", () => { elm = patch(vnode0, h("div")).elm; assert.strictEqual(elm.tagName, "DIV"); }); - it("has different tag and id", function () { + it("has different tag and id", () => { const elm = document.createElement("div"); vnode0.appendChild(elm); const vnode1 = h("span#id"); @@ -141,11 +139,11 @@ describe("snabbdom", function () { assert.strictEqual(patched.tagName, "SPAN"); assert.strictEqual(patched.id, "id"); }); - it("has id", function () { + it("has id", () => { elm = patch(vnode0, h("div", [h("div#unique")])).elm; assert.strictEqual(elm.firstChild.id, "unique"); }); - it("has correct namespace", function () { + it("has correct namespace", () => { const SVGNamespace = "http://www.w3.org/2000/svg"; const XHTMLNamespace = "http://www.w3.org/1999/xhtml"; @@ -174,13 +172,13 @@ describe("snabbdom", function () { elm = patch(vnode0, h("svg-custom-el")).elm; assert.notStrictEqual(elm.namespaceURI, SVGNamespace); }); - it("receives classes in selector", function () { + it("receives classes in selector", () => { elm = patch(vnode0, h("div", [h("i.am.a.class")])).elm; assert(elm.firstChild.classList.contains("am")); assert(elm.firstChild.classList.contains("a")); assert(elm.firstChild.classList.contains("class")); }); - it("receives classes in class property", function () { + it("receives classes in class property", () => { elm = patch( vnode0, h("i", { class: { am: true, a: true, class: true, not: false } }) @@ -190,7 +188,7 @@ describe("snabbdom", function () { assert(elm.classList.contains("class")); assert(!elm.classList.contains("not")); }); - it("receives classes in selector when namespaced", function () { + it("receives classes in selector when namespaced", () => { if (!hasSvgClassList) { this.skip(); } else { @@ -200,7 +198,7 @@ describe("snabbdom", function () { assert(elm.firstChild.classList.contains("class")); } }); - it("receives classes in class property when namespaced", function () { + it("receives classes in class property when namespaced", () => { if (!hasSvgClassList) { this.skip(); } else { @@ -218,7 +216,7 @@ describe("snabbdom", function () { assert(!elm.firstChild.classList.contains("not")); } }); - it("handles classes from both selector and property", function () { + it("handles classes from both selector and property", () => { elm = patch( vnode0, h("div", [h("i.has", { class: { classes: true } })]) @@ -229,29 +227,29 @@ describe("snabbdom", function () { "has `classes` class" ); }); - it("can create elements with text content", function () { + it("can create elements with text content", () => { elm = patch(vnode0, h("div", ["I am a string"])).elm; assert.strictEqual(elm.innerHTML, "I am a string"); }); - it("can create elements with span and text content", function () { + it("can create elements with span and text content", () => { elm = patch(vnode0, h("a", [h("span"), "I am a string"])).elm; assert.strictEqual(elm.childNodes[0].tagName, "SPAN"); assert.strictEqual(elm.childNodes[1].textContent, "I am a string"); }); - it("can create vnode with array String obj content", function () { + it("can create vnode with array String obj content", () => { elm = patch(vnode0, h("a", ["b", new String("c")])).elm; assert.strictEqual(elm.innerHTML, "bc"); }); - it("can create elements with props", function () { + it("can create elements with props", () => { elm = patch(vnode0, h("a", { props: { src: "http://localhost/" } })).elm; assert.strictEqual(elm.src, "http://localhost/"); }); - it("can create an element created inside an iframe", function (done) { + it("can create an element created inside an iframe", (done) => { // Only run if srcdoc is supported. const frame = document.createElement("iframe"); if (typeof frame.srcdoc !== "undefined") { frame.srcdoc = "
Thing 1
"; - frame.onload = function () { + frame.onload = () => { const div0 = frame.contentDocument!.body.querySelector( "div" ) as HTMLDivElement; @@ -268,7 +266,7 @@ describe("snabbdom", function () { done(); } }); - it("is a patch of the root element", function () { + it("is a patch of the root element", () => { const elmWithIdAndClass = document.createElement("div"); elmWithIdAndClass.id = "id"; elmWithIdAndClass.className = "class"; @@ -279,14 +277,14 @@ describe("snabbdom", function () { assert.strictEqual(elm.id, "id"); assert.strictEqual(elm.className, "class"); }); - it("can create comments", function () { + it("can create comments", () => { elm = patch(vnode0, h("!", "test")).elm; assert.strictEqual(elm.nodeType, document.COMMENT_NODE); assert.strictEqual(elm.textContent, "test"); }); }); - describe("created document fragment", function () { - it("is an instance of DocumentFragment", function () { + describe("created document fragment", () => { + it("is an instance of DocumentFragment", () => { const vnode1 = fragment(["I am", h("span", [" a", " fragment"])]); elm = patch(vnode0, vnode1).elm; @@ -294,8 +292,8 @@ describe("snabbdom", function () { assert.strictEqual(elm.textContent, "I am a fragment"); }); }); - describe("patching an element", function () { - it("changes the elements classes", function () { + describe("patching an element", () => { + it("changes the elements classes", () => { const vnode1 = h("i", { class: { i: true, am: true, horse: true } }); const vnode2 = h("i", { class: { i: true, am: true, horse: false } }); patch(vnode0, vnode1); @@ -304,7 +302,7 @@ describe("snabbdom", function () { assert(elm.classList.contains("am")); assert(!elm.classList.contains("horse")); }); - it("changes classes in selector", function () { + it("changes classes in selector", () => { const vnode1 = h("i", { class: { i: true, am: true, horse: true } }); const vnode2 = h("i", { class: { i: true, am: true, horse: false } }); patch(vnode0, vnode1); @@ -313,7 +311,7 @@ describe("snabbdom", function () { assert(elm.classList.contains("am")); assert(!elm.classList.contains("horse")); }); - it("preserves memoized classes", function () { + it("preserves memoized classes", () => { const cachedClass = { i: true, am: true, horse: false }; const vnode1 = h("i", { class: cachedClass }); const vnode2 = h("i", { class: cachedClass }); @@ -326,7 +324,7 @@ describe("snabbdom", function () { assert(elm.classList.contains("am")); assert(!elm.classList.contains("horse")); }); - it("removes missing classes", function () { + it("removes missing classes", () => { const vnode1 = h("i", { class: { i: true, am: true, horse: true } }); const vnode2 = h("i", { class: { i: true, am: true } }); patch(vnode0, vnode1); @@ -335,7 +333,7 @@ describe("snabbdom", function () { assert(elm.classList.contains("am")); assert(!elm.classList.contains("horse")); }); - it("can replace non-empty node with innerHTML prop", function () { + it("can replace non-empty node with innerHTML prop", () => { const h2 = document.createElement("h2"); h2.textContent = "Hello"; const prevElm = document.createElement("div"); @@ -353,14 +351,14 @@ describe("snabbdom", function () { assert.strictEqual(elm.childNodes[0].tagName, "SPAN"); assert.strictEqual(elm.childNodes[0].textContent, "Hi"); }); - it("changes an elements props", function () { + it("changes an elements props", () => { const vnode1 = h("a", { props: { src: "http://other/" } }); const vnode2 = h("a", { props: { src: "http://localhost/" } }); patch(vnode0, vnode1); elm = patch(vnode1, vnode2).elm; assert.strictEqual(elm.src, "http://localhost/"); }); - it("can set prop value to `0`", function () { + it("can set prop value to `0`", () => { const patch = init([propsModule, styleModule]); const view = (scrollTop: number) => h( @@ -387,7 +385,7 @@ describe("snabbdom", function () { assert.strictEqual(elm.scrollTop, 0); document.body.removeChild(mountPoint); }); - it("can set prop value to empty string", function () { + it("can set prop value to empty string", () => { const vnode1 = h("p", { props: { textContent: "foo" } }); const { elm } = patch(vnode0, vnode1); if (!(elm instanceof HTMLParagraphElement)) throw new Error(); @@ -396,7 +394,7 @@ describe("snabbdom", function () { patch(vnode1, vnode2); assert.strictEqual(elm.textContent, ""); }); - it("preserves memoized props", function () { + it("preserves memoized props", () => { const cachedProps = { src: "http://other/" }; const vnode1 = h("a", { props: cachedProps }); const vnode2 = h("a", { props: cachedProps }); @@ -405,14 +403,14 @@ describe("snabbdom", function () { elm = patch(vnode1, vnode2).elm; assert.strictEqual(elm.src, "http://other/"); }); - it("removes custom props", function () { + it("removes custom props", () => { const vnode1 = h("a", { props: { src: "http://other/" } }); const vnode2 = h("a"); patch(vnode0, vnode1); patch(vnode1, vnode2); assert.strictEqual(elm.src, undefined); }); - it("cannot remove native props", function () { + it("cannot remove native props", () => { const vnode1 = h("a", { props: { href: "http://example.com/" } }); const vnode2 = h("a"); const { elm: elm1 } = patch(vnode0, vnode1); @@ -422,7 +420,7 @@ describe("snabbdom", function () { if (!(elm2 instanceof HTMLAnchorElement)) throw new Error(); assert.strictEqual(elm2.href, "http://example.com/"); }); - it("does not delete custom props", function () { + it("does not delete custom props", () => { const vnode1 = h("p", { props: { a: "foo" } }); const vnode2 = h("p"); const { elm } = patch(vnode0, vnode1); @@ -431,9 +429,9 @@ describe("snabbdom", function () { patch(vnode1, vnode2); assert.strictEqual((elm as any).a, "foo"); }); - describe("custom elements", function () { + describe("custom elements", () => { if ("customElements" in window) { - describe("customized built-in element", function () { + describe("customized built-in element", () => { const isSafari = /^((?!chrome|android).)*safari/i.test( navigator.userAgent ); @@ -442,13 +440,13 @@ describe("snabbdom", function () { class A extends HTMLParagraphElement {} class B extends HTMLParagraphElement {} - before(function () { + before(() => { if ("customElements" in window) { customElements.define("p-a", A, { extends: "p" }); customElements.define("p-b", B, { extends: "p" }); } }); - it("can create custom elements", function () { + it("can create custom elements", () => { if ("customElements" in window) { const vnode1 = h("p", { is: "p-a" }); elm = patch(vnode0, vnode1).elm; @@ -457,7 +455,7 @@ describe("snabbdom", function () { this.skip(); } }); - it("handles changing is attribute", function () { + it("handles changing is attribute", () => { const vnode1 = h("p", { is: "p-a" }); const vnode2 = h("p", { is: "p-b" }); @@ -478,8 +476,8 @@ describe("snabbdom", function () { }); } }); - describe("using toVNode()", function () { - it("can remove previous children of the root element", function () { + describe("using toVNode()", () => { + it("can remove previous children of the root element", () => { const h2 = document.createElement("h2"); h2.textContent = "Hello"; const prevElm = document.createElement("div"); @@ -496,7 +494,7 @@ describe("snabbdom", function () { assert.strictEqual(elm.childNodes[0].tagName, "SPAN"); assert.strictEqual(elm.childNodes[0].textContent, "Hi"); }); - it("can support patching in a DocumentFragment", function () { + it("can support patching in a DocumentFragment", () => { const prevElm = document.createDocumentFragment(); const nextVNode = vnode( "", @@ -516,7 +514,7 @@ describe("snabbdom", function () { assert.strictEqual(elm.childNodes[0].childNodes[0].tagName, "SPAN"); assert.strictEqual(elm.childNodes[0].childNodes[0].textContent, "Hi"); }); - it("patching textNodes, adding and removing", function () { + it("patching textNodes, adding and removing", () => { const prevElm = document.createElement("div"); const vnodeText1 = vnode("", {}, [], "Test Text 1", null); const vnodeText2 = vnode("", {}, [], "Test Text 2", null); @@ -529,7 +527,7 @@ describe("snabbdom", function () { elm = patch(toVNode(elm), vnodeH1).elm; assert.strictEqual(elm.textContent, "Test Text h1"); }); - it("can remove some children of the root element", function () { + it("can remove some children of the root element", () => { const h2 = document.createElement("h2"); h2.textContent = "Hello"; const prevElm = document.createElement("div"); @@ -551,7 +549,7 @@ describe("snabbdom", function () { assert.strictEqual(elm.childNodes[0].wholeText, "Foobar"); assert.strictEqual(elm.childNodes[0].testProperty, reference); }); - it("can remove text elements", function () { + it("can remove text elements", () => { const h2 = document.createElement("h2"); h2.textContent = "Hello"; const prevElm = document.createElement("div"); @@ -570,12 +568,10 @@ describe("snabbdom", function () { assert.strictEqual(elm.childNodes[0].nodeType, 1); assert.strictEqual(elm.childNodes[0].textContent, "Hello"); }); - it("can work with domApi", function () { + it("can work with domApi", () => { const domApi = { ...htmlDomApi, - tagName: function (elm: Element) { - return "x-" + elm.tagName.toUpperCase(); - } + tagName: (elm: Element) => "x-" + elm.tagName.toUpperCase() }; const h2 = document.createElement("h2"); h2.id = "hx"; @@ -596,7 +592,7 @@ describe("snabbdom", function () { assert.strictEqual(children[1].text, "Foobar"); }); - it("can parsing dataset and attrs", function () { + it("can parsing dataset and attrs", () => { const onlyAttrs = document.createElement("div"); onlyAttrs.setAttribute("foo", "bar"); assert.deepEqual(toVNode(onlyAttrs).data, { attrs: { foo: "bar" } }); @@ -620,7 +616,7 @@ describe("snabbdom", function () { }); }); }); - describe("updating children with keys", function () { + describe("updating children with keys", () => { function spanNum(n?: null | Key) { if (n == null) { return n; @@ -632,8 +628,8 @@ describe("snabbdom", function () { return h("span", { key: n }, "symbol"); } } - describe("addition of elements", function () { - it("appends elements", function () { + describe("addition of elements", () => { + it("appends elements", () => { const vnode1 = h("span", [1].map(spanNum)); const vnode2 = h("span", [1, 2, 3].map(spanNum)); elm = patch(vnode0, vnode1).elm; @@ -643,7 +639,7 @@ describe("snabbdom", function () { assert.strictEqual(elm.children[1].innerHTML, "2"); assert.strictEqual(elm.children[2].innerHTML, "3"); }); - it("prepends elements", function () { + it("prepends elements", () => { const vnode1 = h("span", [4, 5].map(spanNum)); const vnode2 = h("span", [1, 2, 3, 4, 5].map(spanNum)); elm = patch(vnode0, vnode1).elm; @@ -651,7 +647,7 @@ describe("snabbdom", function () { elm = patch(vnode1, vnode2).elm; assert.deepEqual(map(inner, elm.children), ["1", "2", "3", "4", "5"]); }); - it("add elements in the middle", function () { + it("add elements in the middle", () => { const vnode1 = h("span", [1, 2, 4, 5].map(spanNum)); const vnode2 = h("span", [1, 2, 3, 4, 5].map(spanNum)); elm = patch(vnode0, vnode1).elm; @@ -660,7 +656,7 @@ describe("snabbdom", function () { elm = patch(vnode1, vnode2).elm; assert.deepEqual(map(inner, elm.children), ["1", "2", "3", "4", "5"]); }); - it("add elements at begin and end", function () { + it("add elements at begin and end", () => { const vnode1 = h("span", [2, 3, 4].map(spanNum)); const vnode2 = h("span", [1, 2, 3, 4, 5].map(spanNum)); elm = patch(vnode0, vnode1).elm; @@ -668,7 +664,7 @@ describe("snabbdom", function () { elm = patch(vnode1, vnode2).elm; assert.deepEqual(map(inner, elm.children), ["1", "2", "3", "4", "5"]); }); - it("adds children to parent with no children", function () { + it("adds children to parent with no children", () => { const vnode1 = h("span", { key: "span" }); const vnode2 = h("span", { key: "span" }, [1, 2, 3].map(spanNum)); elm = patch(vnode0, vnode1).elm; @@ -676,7 +672,7 @@ describe("snabbdom", function () { elm = patch(vnode1, vnode2).elm; assert.deepEqual(map(inner, elm.children), ["1", "2", "3"]); }); - it("removes all children from parent", function () { + it("removes all children from parent", () => { const vnode1 = h("span", { key: "span" }, [1, 2, 3].map(spanNum)); const vnode2 = h("span", { key: "span" }); elm = patch(vnode0, vnode1).elm; @@ -684,7 +680,7 @@ describe("snabbdom", function () { elm = patch(vnode1, vnode2).elm; assert.strictEqual(elm.children.length, 0); }); - it("update one child with same key but different sel", function () { + it("update one child with same key but different sel", () => { const vnode1 = h("span", { key: "span" }, [1, 2, 3].map(spanNum)); const vnode2 = h("span", { key: "span" }, [ spanNum(1), @@ -699,8 +695,8 @@ describe("snabbdom", function () { assert.strictEqual(elm.children[1].tagName, "I"); }); }); - describe("removal of elements", function () { - it("removes elements from the beginning", function () { + describe("removal of elements", () => { + it("removes elements from the beginning", () => { const vnode1 = h("span", [1, 2, 3, 4, 5].map(spanNum)); const vnode2 = h("span", [3, 4, 5].map(spanNum)); elm = patch(vnode0, vnode1).elm; @@ -708,7 +704,7 @@ describe("snabbdom", function () { elm = patch(vnode1, vnode2).elm; assert.deepEqual(map(inner, elm.children), ["3", "4", "5"]); }); - it("removes elements from the end", function () { + it("removes elements from the end", () => { const vnode1 = h("span", [1, 2, 3, 4, 5].map(spanNum)); const vnode2 = h("span", [1, 2, 3].map(spanNum)); elm = patch(vnode0, vnode1).elm; @@ -719,7 +715,7 @@ describe("snabbdom", function () { assert.strictEqual(elm.children[1].innerHTML, "2"); assert.strictEqual(elm.children[2].innerHTML, "3"); }); - it("removes elements from the middle", function () { + it("removes elements from the middle", () => { const vnode1 = h("span", [1, 2, 3, 4, 5].map(spanNum)); const vnode2 = h("span", [1, 2, 4, 5].map(spanNum)); elm = patch(vnode0, vnode1).elm; @@ -733,8 +729,8 @@ describe("snabbdom", function () { assert.strictEqual(elm.children[3].innerHTML, "5"); }); }); - describe("element reordering", function () { - it("moves element forward", function () { + describe("element reordering", () => { + it("moves element forward", () => { const vnode1 = h("span", [1, 2, 3, 4].map(spanNum)); const vnode2 = h("span", [2, 3, 1, 4].map(spanNum)); elm = patch(vnode0, vnode1).elm; @@ -746,7 +742,7 @@ describe("snabbdom", function () { assert.strictEqual(elm.children[2].innerHTML, "1"); assert.strictEqual(elm.children[3].innerHTML, "4"); }); - it("moves element to end", function () { + it("moves element to end", () => { const vnode1 = h("span", [1, 2, 3].map(spanNum)); const vnode2 = h("span", [2, 3, 1].map(spanNum)); elm = patch(vnode0, vnode1).elm; @@ -757,7 +753,7 @@ describe("snabbdom", function () { assert.strictEqual(elm.children[1].innerHTML, "3"); assert.strictEqual(elm.children[2].innerHTML, "1"); }); - it("moves element backwards", function () { + it("moves element backwards", () => { const vnode1 = h("span", [1, 2, 3, 4].map(spanNum)); const vnode2 = h("span", [1, 4, 2, 3].map(spanNum)); elm = patch(vnode0, vnode1).elm; @@ -769,7 +765,7 @@ describe("snabbdom", function () { assert.strictEqual(elm.children[2].innerHTML, "2"); assert.strictEqual(elm.children[3].innerHTML, "3"); }); - it("swaps first and last", function () { + it("swaps first and last", () => { const vnode1 = h("span", [1, 2, 3, 4].map(spanNum)); const vnode2 = h("span", [4, 2, 3, 1].map(spanNum)); elm = patch(vnode0, vnode1).elm; @@ -782,8 +778,8 @@ describe("snabbdom", function () { assert.strictEqual(elm.children[3].innerHTML, "1"); }); }); - describe("combinations of additions, removals and reorderings", function () { - it("move to left and replace", function () { + describe("combinations of additions, removals and reorderings", () => { + it("move to left and replace", () => { const vnode1 = h("span", [1, 2, 3, 4, 5].map(spanNum)); const vnode2 = h("span", [4, 1, 2, 3, 6].map(spanNum)); elm = patch(vnode0, vnode1).elm; @@ -796,7 +792,7 @@ describe("snabbdom", function () { assert.strictEqual(elm.children[3].innerHTML, "3"); assert.strictEqual(elm.children[4].innerHTML, "6"); }); - it("moves to left and leaves hole", function () { + it("moves to left and leaves hole", () => { const vnode1 = h("span", [1, 4, 5].map(spanNum)); const vnode2 = h("span", [4, 6].map(spanNum)); elm = patch(vnode0, vnode1).elm; @@ -804,7 +800,7 @@ describe("snabbdom", function () { elm = patch(vnode1, vnode2).elm; assert.deepEqual(map(inner, elm.children), ["4", "6"]); }); - it("handles moved and set to undefined element ending at the end", function () { + it("handles moved and set to undefined element ending at the end", () => { const vnode1 = h("span", [2, 4, 5].map(spanNum)); const vnode2 = h("span", [4, 5, 3].map(spanNum)); elm = patch(vnode0, vnode1).elm; @@ -815,7 +811,7 @@ describe("snabbdom", function () { assert.strictEqual(elm.children[1].innerHTML, "5"); assert.strictEqual(elm.children[2].innerHTML, "3"); }); - it("moves a key in non-keyed nodes with a size up", function () { + it("moves a key in non-keyed nodes with a size up", () => { const vnode1 = h("span", [1, "a", "b", "c"].map(spanNum)); const vnode2 = h("span", ["d", "a", "b", "c", 1, "e"].map(spanNum)); elm = patch(vnode0, vnode1).elm; @@ -825,7 +821,7 @@ describe("snabbdom", function () { assert.strictEqual(elm.childNodes.length, 6); assert.strictEqual(elm.textContent, "dabc1e"); }); - it("accepts symbol as key", function () { + it("accepts symbol as key", () => { const vnode1 = h("span", [Symbol()].map(spanNum)); const vnode2 = h( "span", @@ -838,7 +834,7 @@ describe("snabbdom", function () { assert.equal(elm.children[1].innerHTML, "symbol"); assert.equal(elm.children[2].innerHTML, "symbol"); }); - it("simultaneous addition in beginning and removal in end", function () { + it("simultaneous addition in beginning and removal in end", () => { let insertCount = 0; const domApi: DOMAPI = { ...htmlDomApi, @@ -856,7 +852,7 @@ describe("snabbdom", function () { assert.deepEqual(map(inner, elm.children), ["1", "2", "3", "4"]); assert.strictEqual(insertCount, 1); }); - it("simultaneous removal in beginning and addition in end", function () { + it("simultaneous removal in beginning and addition in end", () => { let insertCount = 0; const domApi: DOMAPI = { ...htmlDomApi, @@ -877,7 +873,7 @@ describe("snabbdom", function () { assert.strictEqual(insertCount, 1); }); }); - it("reverses elements", function () { + it("reverses elements", () => { const vnode1 = h("span", [1, 2, 3, 4, 5, 6, 7, 8].map(spanNum)); const vnode2 = h("span", [8, 7, 6, 5, 4, 3, 2, 1].map(spanNum)); elm = patch(vnode0, vnode1).elm; @@ -894,7 +890,7 @@ describe("snabbdom", function () { "1" ]); }); - it("something", function () { + it("something", () => { const vnode1 = h("span", [0, 1, 2, 3, 4, 5].map(spanNum)); const vnode2 = h("span", [4, 3, 2, 1, 5, 0].map(spanNum)); elm = patch(vnode0, vnode1).elm; @@ -909,7 +905,7 @@ describe("snabbdom", function () { "0" ]); }); - it("handles random shuffles", function () { + it("handles random shuffles", () => { let n; let i; const arr = []; @@ -925,9 +921,7 @@ describe("snabbdom", function () { for (n = 0; n < samples; ++n) { const vnode1 = h( "span", - arr.map(function (n) { - return spanNumWithOpacity(n, "1"); - }) + arr.map((n) => spanNumWithOpacity(n, "1")) ); const shufArr = shuffle(arr); let elm: HTMLDivElement | HTMLSpanElement = @@ -939,9 +933,7 @@ describe("snabbdom", function () { } const vnode2 = h( "span", - arr.map(function (n) { - return spanNumWithOpacity(shufArr[n], opacities[n]); - }) + arr.map((n) => spanNumWithOpacity(shufArr[n], opacities[n])) ); elm = patch(vnode1, vnode2).elm as HTMLSpanElement; for (i = 0; i < elms; ++i) { @@ -954,7 +946,7 @@ describe("snabbdom", function () { } } }); - it("supports null/undefined children", function () { + it("supports null/undefined children", () => { const vnode1 = h("i", [0, 1, 2, 3, 4, 5].map(spanNum)); const vnode2 = h( "i", @@ -974,7 +966,7 @@ describe("snabbdom", function () { "3" ]); }); - it("supports all null/undefined children", function () { + it("supports all null/undefined children", () => { const vnode1 = h("i", [0, 1, 2, 3, 4, 5].map(spanNum)); const vnode2 = h("i", [null, null, undefined, null, null, undefined]); const vnode3 = h("i", [5, 4, 3, 2, 1, 0].map(spanNum)); @@ -991,7 +983,7 @@ describe("snabbdom", function () { "0" ]); }); - it("handles random shuffles with null/undefined children", function () { + it("handles random shuffles with null/undefined children", () => { let i; let j; let r; @@ -1014,15 +1006,13 @@ describe("snabbdom", function () { elm = patch(vnode1, vnode2).elm; assert.deepEqual( map(inner, elm.children), - arr.filter(function (x) { - return x != null; - }) + arr.filter((x) => x != null) ); } }); }); - describe("updating children without keys", function () { - it("appends elements", function () { + describe("updating children without keys", () => { + it("appends elements", () => { const vnode1 = h("div", [h("span", "Hello")]); const vnode2 = h("div", [h("span", "Hello"), h("span", "World")]); elm = patch(vnode0, vnode1).elm; @@ -1030,7 +1020,7 @@ describe("snabbdom", function () { elm = patch(vnode1, vnode2).elm; assert.deepEqual(map(inner, elm.children), ["Hello", "World"]); }); - it("handles unmoved text nodes", function () { + it("handles unmoved text nodes", () => { const vnode1 = h("div", ["Text", h("span", "Span")]); const vnode2 = h("div", ["Text", h("span", "Span")]); elm = patch(vnode0, vnode1).elm; @@ -1038,7 +1028,7 @@ describe("snabbdom", function () { elm = patch(vnode1, vnode2).elm; assert.strictEqual(elm.childNodes[0].textContent, "Text"); }); - it("handles changing text children", function () { + it("handles changing text children", () => { const vnode1 = h("div", ["Text", h("span", "Span")]); const vnode2 = h("div", ["Text2", h("span", "Span")]); elm = patch(vnode0, vnode1).elm; @@ -1046,7 +1036,7 @@ describe("snabbdom", function () { elm = patch(vnode1, vnode2).elm; assert.strictEqual(elm.childNodes[0].textContent, "Text2"); }); - it("handles unmoved comment nodes", function () { + it("handles unmoved comment nodes", () => { const vnode1 = h("div", [h("!", "Text"), h("span", "Span")]); const vnode2 = h("div", [h("!", "Text"), h("span", "Span")]); elm = patch(vnode0, vnode1).elm; @@ -1054,7 +1044,7 @@ describe("snabbdom", function () { elm = patch(vnode1, vnode2).elm; assert.strictEqual(elm.childNodes[0].textContent, "Text"); }); - it("handles changing comment text", function () { + it("handles changing comment text", () => { const vnode1 = h("div", [h("!", "Text"), h("span", "Span")]); const vnode2 = h("div", [h("!", "Text2"), h("span", "Span")]); elm = patch(vnode0, vnode1).elm; @@ -1062,7 +1052,7 @@ describe("snabbdom", function () { elm = patch(vnode1, vnode2).elm; assert.strictEqual(elm.childNodes[0].textContent, "Text2"); }); - it("handles changing empty comment", function () { + it("handles changing empty comment", () => { const vnode1 = h("div", [h("!"), h("span", "Span")]); const vnode2 = h("div", [h("!", "Test"), h("span", "Span")]); elm = patch(vnode0, vnode1).elm; @@ -1070,7 +1060,7 @@ describe("snabbdom", function () { elm = patch(vnode1, vnode2).elm; assert.strictEqual(elm.childNodes[0].textContent, "Test"); }); - it("prepends element", function () { + it("prepends element", () => { const vnode1 = h("div", [h("span", "World")]); const vnode2 = h("div", [h("span", "Hello"), h("span", "World")]); elm = patch(vnode0, vnode1).elm; @@ -1078,7 +1068,7 @@ describe("snabbdom", function () { elm = patch(vnode1, vnode2).elm; assert.deepEqual(map(inner, elm.children), ["Hello", "World"]); }); - it("prepends element of different tag type", function () { + it("prepends element of different tag type", () => { const vnode1 = h("div", [h("span", "World")]); const vnode2 = h("div", [h("div", "Hello"), h("span", "World")]); elm = patch(vnode0, vnode1).elm; @@ -1087,7 +1077,7 @@ describe("snabbdom", function () { assert.deepEqual(map(prop("tagName"), elm.children), ["DIV", "SPAN"]); assert.deepEqual(map(inner, elm.children), ["Hello", "World"]); }); - it("removes elements", function () { + it("removes elements", () => { const vnode1 = h("div", [ h("span", "One"), h("span", "Two"), @@ -1099,7 +1089,7 @@ describe("snabbdom", function () { elm = patch(vnode1, vnode2).elm; assert.deepEqual(map(inner, elm.children), ["One", "Three"]); }); - it("removes a single text node", function () { + it("removes a single text node", () => { const vnode1 = h("div", "One"); const vnode2 = h("div"); patch(vnode0, vnode1); @@ -1107,7 +1097,7 @@ describe("snabbdom", function () { patch(vnode1, vnode2); assert.strictEqual(elm.textContent, ""); }); - it("removes a single text node when children are updated", function () { + it("removes a single text node when children are updated", () => { const vnode1 = h("div", "One"); const vnode2 = h("div", [h("div", "Two"), h("span", "Three")]); patch(vnode0, vnode1); @@ -1118,7 +1108,7 @@ describe("snabbdom", function () { "Three" ]); }); - it("removes a text node among other elements", function () { + it("removes a text node among other elements", () => { const vnode1 = h("div", ["One", h("span", "Two")]); const vnode2 = h("div", [h("div", "Three")]); patch(vnode0, vnode1); @@ -1131,7 +1121,7 @@ describe("snabbdom", function () { assert.strictEqual(elm.childNodes[0].tagName, "DIV"); assert.strictEqual(elm.childNodes[0].textContent, "Three"); }); - it("reorders elements", function () { + it("reorders elements", () => { const vnode1 = h("div", [ h("span", "One"), h("div", "Two"), @@ -1152,7 +1142,7 @@ describe("snabbdom", function () { ]); assert.deepEqual(map(inner, elm.children), ["Three", "One", "Two"]); }); - it("supports null/undefined children", function () { + it("supports null/undefined children", () => { const vnode1 = h("i", [null, h("i", "1"), h("i", "2"), null]); const vnode2 = h("i", [ h("i", "2"), @@ -1177,7 +1167,7 @@ describe("snabbdom", function () { elm = patch(vnode2, vnode3).elm; assert.deepEqual(map(inner, elm.children), ["1", "2"]); }); - it("supports all null/undefined children", function () { + it("supports all null/undefined children", () => { const vnode1 = h("i", [h("i", "1"), h("i", "2")]); const vnode2 = h("i", [null, undefined]); const vnode3 = h("i", [h("i", "2"), h("i", "1")]); @@ -1189,8 +1179,8 @@ describe("snabbdom", function () { }); }); }); - describe("patching a fragment", function () { - it("can patch on document fragments", function () { + describe("patching a fragment", () => { + it("can patch on document fragments", () => { let firstChild: HTMLElement; const root = document.createElement("div"); const vnode1 = fragment(["I am", h("span", [" a", " fragment"])]); @@ -1221,7 +1211,7 @@ describe("snabbdom", function () { assert.strictEqual(firstChild.textContent, "fragment "); assert.strictEqual(elm.parent, root); }); - it("allows a document fragment as a container", function () { + it("allows a document fragment as a container", () => { const vnode0 = document.createDocumentFragment(); const vnode1 = fragment(["I", "am", "a", h("span", ["fragment"])]); const vnode2 = h("div", "I am an element"); @@ -1233,9 +1223,9 @@ describe("snabbdom", function () { assert.strictEqual(elm.tagName, "DIV"); }); }); - describe("hooks", function () { - describe("element hooks", function () { - it("calls `create` listener before inserted into parent but after children", function () { + describe("hooks", () => { + describe("element hooks", () => { + it("calls `create` listener before inserted into parent but after children", () => { const result = []; const cb: CreateHook = (empty, vnode) => { assert(vnode.elm instanceof Element); @@ -1254,7 +1244,7 @@ describe("snabbdom", function () { patch(vnode0, vnode1); assert.strictEqual(1, result.length); }); - it("calls `insert` listener after both parents, siblings and children have been inserted", function () { + it("calls `insert` listener after both parents, siblings and children have been inserted", () => { const result = []; const cb: InsertHook = (vnode) => { assert(vnode.elm instanceof Element); @@ -1273,7 +1263,7 @@ describe("snabbdom", function () { patch(vnode0, vnode1); assert.strictEqual(1, result.length); }); - it("calls `prepatch` listener", function () { + it("calls `prepatch` listener", () => { const result = []; const cb: PrePatchHook = (oldVnode, vnode) => { assert.strictEqual(oldVnode, vnode1.children![1]); @@ -1298,7 +1288,7 @@ describe("snabbdom", function () { patch(vnode1, vnode2); assert.strictEqual(result.length, 1); }); - it("calls `postpatch` after `prepatch` listener", function () { + it("calls `postpatch` after `prepatch` listener", () => { let pre = 0; let post = 0; function preCb() { @@ -1327,7 +1317,7 @@ describe("snabbdom", function () { assert.strictEqual(pre, 1); assert.strictEqual(post, 1); }); - it("calls `update` listener", function () { + it("calls `update` listener", () => { const result1: VNode[] = []; const result2: VNode[] = []; function cb(result: VNode[], oldVnode: VNode, vnode: VNode) { @@ -1357,7 +1347,7 @@ describe("snabbdom", function () { assert.strictEqual(result1.length, 1); assert.strictEqual(result2.length, 1); }); - it("calls `remove` listener", function () { + it("calls `remove` listener", () => { const result = []; const cb: RemoveHook = (vnode, rm) => { const parent = vnode.elm!.parentNode as HTMLDivElement; @@ -1380,7 +1370,7 @@ describe("snabbdom", function () { patch(vnode1, vnode2); assert.strictEqual(1, result.length); }); - it("calls `destroy` listener when patching text node over node with children", function () { + it("calls `destroy` listener when patching text node over node with children", () => { let calls = 0; function cb() { calls++; @@ -1393,7 +1383,7 @@ describe("snabbdom", function () { patch(vnode1, vnode2); assert.strictEqual(calls, 1); }); - it("calls `init` and `prepatch` listeners on root", function () { + it("calls `init` and `prepatch` listeners on root", () => { let count = 0; const init: InitHook = (vnode) => { assert.strictEqual(vnode, vnode2); @@ -1410,16 +1400,16 @@ describe("snabbdom", function () { patch(vnode1, vnode2); assert.strictEqual(2, count); }); - it("removes element when all remove listeners are done", function () { + it("removes element when all remove listeners are done", () => { let rm1, rm2, rm3; const patch = init([ { - remove: function (_, rm) { + remove: (_, rm) => { rm1 = rm; } }, { - remove: function (_, rm) { + remove: (_, rm) => { rm2 = rm; } } @@ -1427,7 +1417,7 @@ describe("snabbdom", function () { const vnode1 = h("div", [ h("a", { hook: { - remove: function (_, rm) { + remove: (_, rm) => { rm3 = rm; } } @@ -1445,7 +1435,7 @@ describe("snabbdom", function () { (rm2 as any)(); assert.strictEqual(elm.children.length, 0); }); - it("invokes remove hook on replaced root", function () { + it("invokes remove hook on replaced root", () => { const result = []; const parent = document.createElement("div"); const vnode0 = document.createElement("div"); @@ -1464,17 +1454,17 @@ describe("snabbdom", function () { assert.strictEqual(1, result.length); }); }); - describe("module hooks", function () { - it("invokes `pre` and `post` hook", function () { + describe("module hooks", () => { + it("invokes `pre` and `post` hook", () => { const result: string[] = []; const patch = init([ { - pre: function () { + pre: () => { result.push("pre"); } }, { - post: function () { + post: () => { result.push("post"); } } @@ -1483,7 +1473,7 @@ describe("snabbdom", function () { patch(vnode0, vnode1); assert.deepEqual(result, ["pre", "post"]); }); - it("invokes global `destroy` hook for all removed children", function () { + it("invokes global `destroy` hook for all removed children", () => { const result = []; const cb: DestroyHook = (vnode) => { result.push(vnode); @@ -1500,23 +1490,23 @@ describe("snabbdom", function () { patch(vnode1, vnode2); assert.strictEqual(result.length, 1); }); - it("handles text vnodes with `undefined` `data` property", function () { + it("handles text vnodes with `undefined` `data` property", () => { const vnode1 = h("div", [" "]); const vnode2 = h("div", []); patch(vnode0, vnode1); patch(vnode1, vnode2); }); - it("invokes `destroy` module hook for all removed children", function () { + it("invokes `destroy` module hook for all removed children", () => { let created = 0; let destroyed = 0; const patch = init([ { - create: function () { + create: () => { created++; } }, { - destroy: function () { + destroy: () => { destroyed++; } } @@ -1531,17 +1521,17 @@ describe("snabbdom", function () { assert.strictEqual(created, 4); assert.strictEqual(destroyed, 4); }); - it("does not invoke `create` and `remove` module hook for text nodes", function () { + it("does not invoke `create` and `remove` module hook for text nodes", () => { let created = 0; let removed = 0; const patch = init([ { - create: function () { + create: () => { created++; } }, { - remove: function () { + remove: () => { removed++; } } @@ -1557,17 +1547,17 @@ describe("snabbdom", function () { assert.strictEqual(created, 2); assert.strictEqual(removed, 2); }); - it("does not invoke `destroy` module hook for text nodes", function () { + it("does not invoke `destroy` module hook for text nodes", () => { let created = 0; let destroyed = 0; const patch = init([ { - create: function () { + create: () => { created++; } }, { - destroy: function () { + destroy: () => { destroyed++; } } @@ -1584,8 +1574,8 @@ describe("snabbdom", function () { }); }); }); - describe("short circuiting", function () { - it("does not update strictly equal vnodes", function () { + describe("short circuiting", () => { + it("does not update strictly equal vnodes", () => { const result = []; const cb: UpdateHook = (vnode) => { result.push(vnode); @@ -1598,7 +1588,7 @@ describe("snabbdom", function () { patch(vnode1, vnode1); assert.strictEqual(result.length, 0); }); - it("does not update strictly equal children", function () { + it("does not update strictly equal children", () => { const result = []; function cb(vnode: VNode) { result.push(vnode); diff --git a/test/unit/dataset.ts b/test/unit/dataset.ts index 91bfec2..5f6b170 100644 --- a/test/unit/dataset.ts +++ b/test/unit/dataset.ts @@ -4,23 +4,23 @@ import { datasetModule, init, h, toVNode } from "../../src/index"; const patch = init([datasetModule]); -describe("dataset", function () { - before(function () { +describe("dataset", () => { + before(() => { if (!Object.hasOwnProperty.call(HTMLElement.prototype, "dataset")) { this.skip(); } }); let elm: any, vnode0: any; - beforeEach(function () { + beforeEach(() => { elm = document.createElement("div"); vnode0 = elm; }); - it("is set on initial element creation", function () { + it("is set on initial element creation", () => { elm = patch(vnode0, h("div", { dataset: { foo: "foo" } })).elm; assert.strictEqual(elm.dataset.foo, "foo"); }); - it("toVNode & dataset", function () { + it("toVNode & dataset", () => { const elem1 = document.createElement("div"); elem1.innerHTML = '
'; const elem2 = document.createElement("div"); @@ -30,7 +30,7 @@ describe("dataset", function () { patch(oldNode, newNode); assert.strictEqual(elem1.innerHTML, '
'); }); - it("updates dataset", function () { + it("updates dataset", () => { const vnode1 = h("i", { dataset: { foo: "foo", bar: "bar" } }); const vnode2 = h("i", { dataset: { baz: "baz" } }); elm = patch(vnode0, vnode1).elm; @@ -40,7 +40,7 @@ describe("dataset", function () { assert.strictEqual(elm.dataset.baz, "baz"); assert.strictEqual(elm.dataset.foo, undefined); }); - it("handles falsy values", function () { + it("handles falsy values", () => { const vnode1 = h("i", { dataset: { foo: "" } }); const vnode2 = h("i", { dataset: { foo: "" } }); elm = patch(vnode0, vnode1).elm; @@ -48,7 +48,7 @@ describe("dataset", function () { elm = patch(vnode1, vnode2).elm; assert.strictEqual(elm.dataset.foo, ""); }); - it("can be memoized", function () { + it("can be memoized", () => { const cachedDataset = { foo: "foo", bar: "bar" }; const vnode1 = h("i", { dataset: cachedDataset }); const vnode2 = h("i", { dataset: cachedDataset }); @@ -59,7 +59,7 @@ describe("dataset", function () { assert.strictEqual(elm.dataset.foo, "foo"); assert.strictEqual(elm.dataset.bar, "bar"); }); - it("handles string conversions", function () { + it("handles string conversions", () => { const vnode1 = h("i", { dataset: { empty: "", diff --git a/test/unit/eventlisteners.ts b/test/unit/eventlisteners.ts index 17a4f4f..24dd10e 100644 --- a/test/unit/eventlisteners.ts +++ b/test/unit/eventlisteners.ts @@ -4,13 +4,13 @@ import { VNode, init, eventListenersModule, h } from "../../src/index"; const patch = init([eventListenersModule]); -describe("event listeners", function () { +describe("event listeners", () => { let elm: any, vnode0: any; - beforeEach(function () { + beforeEach(() => { elm = document.createElement("div"); vnode0 = elm; }); - it("attaches click event handler to element", function () { + it("attaches click event handler to element", () => { const result = []; function clicked(ev: Event) { result.push(ev); @@ -22,14 +22,14 @@ describe("event listeners", function () { elm.click(); assert.strictEqual(1, result.length); }); - it("does not attach new listener", function () { + it("does not attach new listener", () => { const result: number[] = []; // function clicked(ev) { result.push(ev); } const vnode1 = h( "div", { on: { - click: function () { + click: () => { result.push(1); } } @@ -40,7 +40,7 @@ describe("event listeners", function () { "div", { on: { - click: function () { + click: () => { result.push(2); } } @@ -53,7 +53,7 @@ describe("event listeners", function () { elm.click(); assert.deepEqual(result, [1, 2]); }); - it("detach attached click event handler to element", function () { + it("detach attached click event handler to element", () => { const result: Event[] = []; function clicked(ev: Event) { result.push(ev); @@ -69,7 +69,7 @@ describe("event listeners", function () { elm.click(); assert.strictEqual(1, result.length); }); - it("multiple event handlers for same event on same element", function () { + it("multiple event handlers for same event on same element", () => { let called = 0; function clicked(ev: Event, vnode: VNode) { ++called; @@ -91,7 +91,7 @@ describe("event listeners", function () { elm.click(); assert.strictEqual(5, called); }); - it("access to virtual node in event handler", function () { + it("access to virtual node in event handler", () => { const result: VNode[] = []; function clicked(this: VNode, ev: Event, vnode: VNode) { result.push(this); @@ -106,10 +106,10 @@ describe("event listeners", function () { assert.strictEqual(vnode1, result[0]); assert.strictEqual(vnode1, result[1]); }); - it("shared handlers in parent and child nodes", function () { + it("shared handlers in parent and child nodes", () => { const result = []; const sharedHandlers = { - click: function (ev: Event) { + click: (ev: Event) => { result.push(ev); } }; diff --git a/test/unit/htmldomapi.ts b/test/unit/htmldomapi.ts index f181700..a474dd4 100644 --- a/test/unit/htmldomapi.ts +++ b/test/unit/htmldomapi.ts @@ -4,21 +4,21 @@ import { init, h, attributesModule } from "../../src/index"; const patch = init([attributesModule]); -describe("svg", function () { +describe("svg", () => { let elm: any, vnode0: any; - beforeEach(function () { + beforeEach(() => { elm = document.createElement("svg"); vnode0 = elm; }); - it("removes child svg elements", function () { + it("removes child svg elements", () => { const a = h("svg", {}, [h("g"), h("g")]); const b = h("svg", {}, [h("g")]); const result = patch(patch(vnode0, a), b).elm as SVGElement; assert.strictEqual(result.childNodes.length, 1); }); - it("adds correctly xlink namespaced attribute", function () { + it("adds correctly xlink namespaced attribute", () => { const xlinkNS = "http://www.w3.org/1999/xlink"; const testUrl = "/test"; const a = h("svg", {}, [ @@ -38,7 +38,7 @@ describe("svg", function () { assert.strictEqual(child.getAttributeNS(xlinkNS, "href"), testUrl); }); - it("adds correctly xml namespaced attribute", function () { + it("adds correctly xml namespaced attribute", () => { const xmlNS = "http://www.w3.org/XML/1998/namespace"; const testAttrValue = "und"; const a = h("svg", { attrs: { "xml:lang": testAttrValue } }, []); diff --git a/test/unit/jsx.tsx b/test/unit/jsx.tsx index 5893947..eef124e 100644 --- a/test/unit/jsx.tsx +++ b/test/unit/jsx.tsx @@ -1,9 +1,9 @@ import { assert } from "@esm-bundle/chai"; import { jsx, Fragment, init } from "../../src/index"; -describe("snabbdom", function () { - describe("jsx", function () { - it("can be used as a jsxFactory method", function () { +describe("snabbdom", () => { + describe("jsx", () => { + it("can be used as a jsxFactory method", () => { const vnode =
Hello World
; assert.deepStrictEqual(vnode, { @@ -16,7 +16,7 @@ describe("snabbdom", function () { }); }); - it("creates text property for text only child", function () { + it("creates text property for text only child", () => { const vnode =
foo bar
; assert.deepStrictEqual(vnode, { @@ -29,7 +29,7 @@ describe("snabbdom", function () { }); }); - it("creates an array of children for multiple children", function () { + it("creates an array of children for multiple children", () => { const vnode = (
{"foo"} @@ -64,7 +64,7 @@ describe("snabbdom", function () { }); }); - it("flattens children", function () { + it("flattens children", () => { const vnode = (

A Heading

@@ -118,7 +118,7 @@ describe("snabbdom", function () { }); }); - it("removes falsey children", function () { + it("removes falsey children", () => { const showLogin = false; const showCaptcha = false; const loginAttempts = 0; @@ -188,7 +188,7 @@ describe("snabbdom", function () { }); }); - it("works with a function component", function () { + it("works with a function component", () => { // workaround linter issue // eslint-disable-next-line @typescript-eslint/no-unused-vars const Part = ({ part }: { part: string }) => {part}; @@ -273,8 +273,8 @@ describe("snabbdom", function () { }); }); - describe("Fragment", function () { - it("can be used as a jsxFragmentFactory method", function () { + describe("Fragment", () => { + it("can be used as a jsxFragmentFactory method", () => { const vnode = <>Hello World; assert.deepStrictEqual(vnode, { @@ -287,7 +287,7 @@ describe("snabbdom", function () { }); }); - it("creates text property for text only child", function () { + it("creates text property for text only child", () => { const vnode = <>foo bar; assert.deepStrictEqual(vnode, { @@ -300,7 +300,7 @@ describe("snabbdom", function () { }); }); - it("creates an array of children for multiple children", function () { + it("creates an array of children for multiple children", () => { const vnode = ( <> {"foo"} @@ -335,7 +335,7 @@ describe("snabbdom", function () { }); }); - it("flattens children", function () { + it("flattens children", () => { const vnode = ( <>

A Heading

@@ -389,7 +389,7 @@ describe("snabbdom", function () { }); }); - it("removes falsey children", function () { + it("removes falsey children", () => { const showLogin = false; const showCaptcha = false; const loginAttempts = 0; @@ -459,7 +459,7 @@ describe("snabbdom", function () { }); }); - it("works with a function component", function () { + it("works with a function component", () => { // workaround linter issue // eslint-disable-next-line @typescript-eslint/no-unused-vars const Part = ({ part }: { part: string }) => <>{part}; @@ -543,7 +543,7 @@ describe("snabbdom", function () { }); }); - it("can correctly be patched", function () { + it("can correctly be patched", () => { const patch = init([], undefined, { experimental: { fragments: true diff --git a/test/unit/style.ts b/test/unit/style.ts index a8df60a..5868c4a 100644 --- a/test/unit/style.ts +++ b/test/unit/style.ts @@ -9,17 +9,17 @@ featureDiscoveryElm.style.setProperty("--foo", "foo"); const hasCssVariables = featureDiscoveryElm.style.getPropertyValue("--foo") === "foo"; -describe("style", function () { +describe("style", () => { let elm: any, vnode0: any; - beforeEach(function () { + beforeEach(() => { elm = document.createElement("div"); vnode0 = elm; }); - it("is being styled", function () { + it("is being styled", () => { elm = patch(vnode0, h("div", { style: { fontSize: "12px" } })).elm; assert.strictEqual(elm.style.fontSize, "12px"); }); - it("can be memoized", function () { + it("can be memoized", () => { const cachedStyles = { fontSize: "14px", display: "inline" }; const vnode1 = h("i", { style: cachedStyles }); const vnode2 = h("i", { style: cachedStyles }); @@ -30,7 +30,7 @@ describe("style", function () { assert.strictEqual(elm.style.fontSize, "14px"); assert.strictEqual(elm.style.display, "inline"); }); - it("updates styles", function () { + it("updates styles", () => { const vnode1 = h("i", { style: { fontSize: "14px", display: "inline" } }); const vnode2 = h("i", { style: { fontSize: "12px", display: "block" } }); const vnode3 = h("i", { style: { fontSize: "10px", display: "block" } }); @@ -44,7 +44,7 @@ describe("style", function () { assert.strictEqual(elm.style.fontSize, "10px"); assert.strictEqual(elm.style.display, "block"); }); - it("explicialy removes styles", function () { + it("explicialy removes styles", () => { const vnode1 = h("i", { style: { fontSize: "14px" } }); const vnode2 = h("i", { style: { fontSize: "" } }); const vnode3 = h("i", { style: { fontSize: "10px" } }); @@ -55,7 +55,7 @@ describe("style", function () { patch(vnode2, vnode3); assert.strictEqual(elm.style.fontSize, "10px"); }); - it("handles falsy values", function () { + it("handles falsy values", () => { const vnode1 = h("i", { style: { flexShrink: 0 as any } }); const vnode2 = h("i", { style: { flexShrink: 0 as any } }); elm = patch(vnode0, vnode1).elm; @@ -63,7 +63,7 @@ describe("style", function () { patch(vnode1, vnode2); assert.strictEqual(elm.style.flexShrink, "0"); }); - it("implicially removes styles from element", function () { + it("implicially removes styles from element", () => { const vnode1 = h("div", [h("i", { style: { fontSize: "14px" } })]); const vnode2 = h("div", [h("i")]); const vnode3 = h("div", [h("i", { style: { fontSize: "10px" } })]); @@ -74,7 +74,7 @@ describe("style", function () { patch(vnode2, vnode3); assert.strictEqual(elm.firstChild.style.fontSize, "10px"); }); - it("updates css variables", function () { + it("updates css variables", () => { if (!hasCssVariables) { this.skip(); } else { @@ -89,7 +89,7 @@ describe("style", function () { assert.strictEqual(elm.style.getPropertyValue("--myVar"), "3"); } }); - it("explicialy removes css variables", function () { + it("explicialy removes css variables", () => { if (!hasCssVariables) { this.skip(); } else { @@ -104,7 +104,7 @@ describe("style", function () { assert.strictEqual(elm.style.getPropertyValue("--myVar"), "2"); } }); - it("implicially removes css variables from element", function () { + it("implicially removes css variables from element", () => { if (!hasCssVariables) { this.skip(); } else { @@ -119,7 +119,7 @@ describe("style", function () { assert.strictEqual(elm.firstChild.style.getPropertyValue("--myVar"), "2"); } }); - it("updates delayed styles in next frame", function (done) { + it("updates delayed styles in next frame", (done) => { const vnode1 = h("i", { style: { fontSize: "14px", delayed: { fontSize: "16px" } as any } }); @@ -142,7 +142,7 @@ describe("style", function () { }); }); }); - it("applies tranform as transition on remove", function (done) { + it("applies tranform as transition on remove", (done) => { const btn = h( "button", { @@ -160,13 +160,13 @@ describe("style", function () { patch(vnode1, vnode2); const button = document.querySelector("button") as HTMLButtonElement; assert.notStrictEqual(button, null); - button.addEventListener("transitionend", function () { + button.addEventListener("transitionend", () => { assert.strictEqual(document.querySelector("button"), null); done(); }); }); - describe("using toVNode()", function () { - it("handles (ignoring) comment nodes", function () { + describe("using toVNode()", () => { + it("handles (ignoring) comment nodes", () => { const comment = document.createComment("yolo"); const prevElm = document.createElement("div"); prevElm.appendChild(comment); diff --git a/test/unit/thunk.ts b/test/unit/thunk.ts index 9e5be97..0ccb823 100644 --- a/test/unit/thunk.ts +++ b/test/unit/thunk.ts @@ -4,12 +4,12 @@ import { init, h, thunk, VNode } from "../../src/index"; const patch = init([]); -describe("thunk", function () { +describe("thunk", () => { let elm: any, vnode0: any; - beforeEach(function () { + beforeEach(() => { elm = vnode0 = document.createElement("div"); }); - it("returns vnode with data and render function", function () { + it("returns vnode with data and render function", () => { function numberInSpan(n: number) { return h("span", `Number is ${n}`); } @@ -18,7 +18,7 @@ describe("thunk", function () { assert.deepEqual(vnode.data.key, "num"); assert.deepEqual(vnode.data.args, [22]); }); - it("calls render function once on data change", function () { + it("calls render function once on data change", () => { let called = 0; function numberInSpan(n: number) { called++; @@ -31,7 +31,7 @@ describe("thunk", function () { patch(vnode1, vnode2); assert.strictEqual(called, 2); }); - it("does not call render function on data unchanged", function () { + it("does not call render function on data unchanged", () => { let called = 0; function numberInSpan(n: number) { called++; @@ -44,7 +44,7 @@ describe("thunk", function () { patch(vnode1, vnode2); assert.strictEqual(called, 1); }); - it("calls render function once on data-length change", function () { + it("calls render function once on data-length change", () => { let called = 0; function numberInSpan(n: number) { called++; @@ -57,7 +57,7 @@ describe("thunk", function () { patch(vnode1, vnode2); assert.strictEqual(called, 2); }); - it("calls render function once on function change", function () { + it("calls render function once on function change", () => { let called = 0; function numberInSpan(n: number) { called++; @@ -74,7 +74,7 @@ describe("thunk", function () { patch(vnode1, vnode2); assert.strictEqual(called, 2); }); - it("renders correctly", function () { + it("renders correctly", () => { let called = 0; function numberInSpan(n: number) { called++; @@ -94,7 +94,7 @@ describe("thunk", function () { assert.strictEqual(elm.firstChild.innerHTML, "Number is 2"); assert.strictEqual(called, 2); }); - it("supports leaving out the `key` argument", function () { + it("supports leaving out the `key` argument", () => { function vnodeFn(s: string) { return h("span.number", "Hello " + s); } @@ -102,7 +102,7 @@ describe("thunk", function () { elm = patch(vnode0, vnode1).elm; assert.strictEqual(elm.innerText, "Hello World!"); }); - it("renders correctly when root", function () { + it("renders correctly when root", () => { let called = 0; function numberInSpan(n: number) { called++; @@ -125,7 +125,7 @@ describe("thunk", function () { assert.strictEqual(elm.innerHTML, "Number is 2"); assert.strictEqual(called, 2); }); - it("can be replaced and removed", function () { + it("can be replaced and removed", () => { function numberInSpan(n: number) { return h("span", { key: "num" }, `Number is ${n}`); } @@ -144,7 +144,7 @@ describe("thunk", function () { assert.strictEqual(elm.firstChild.tagName.toLowerCase(), "div"); assert.strictEqual(elm.firstChild.innerHTML, "Even: 4"); }); - it("can be replaced and removed when root", function () { + it("can be replaced and removed when root", () => { function numberInSpan(n: number) { return h("span", { key: "num" }, `Number is ${n}`); } @@ -163,7 +163,7 @@ describe("thunk", function () { assert.strictEqual(elm.tagName.toLowerCase(), "div"); assert.strictEqual(elm.innerHTML, "Even: 4"); }); - it("invokes destroy hook on thunks", function () { + it("invokes destroy hook on thunks", () => { let called = 0; function destroyHook() { called++; @@ -185,7 +185,7 @@ describe("thunk", function () { patch(vnode1, vnode2); assert.strictEqual(called, 1); }); - it("invokes remove hook on thunks", function () { + it("invokes remove hook on thunks", () => { let called = 0; function hook() { called++;