chore(tools): apply prettier-format to all files (#1077)

Co-authored-by: chris <chris@bumblehead.com>
pull/1062/head
iambumblehead 1 year ago committed by GitHub
parent 49c01df531
commit f5fcde33ec
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -4,36 +4,36 @@ export default {
browserName: "chrome",
browser_version: "latest",
os: "Windows",
os_version: "10",
os_version: "10"
},
BS_Firefox_Current: {
browserName: "firefox",
browser_version: "latest",
os: "Windows",
os_version: "10",
os_version: "10"
},
BS_Safari_Current: {
browserName: "safari",
browser_version: "latest",
os: "OS X",
os_version: "Big Sur",
os_version: "Big Sur"
},
BS_Android_Current: {
browserName: "chrome",
device: "Samsung Galaxy S23",
os: "Android",
os_version: "13.0",
os_version: "13.0"
},
BS_Android_10: {
browserName: "Android",
device: "OnePlus 8",
os: "Android",
os_version: "10.0",
os_version: "10.0"
},
BS_MS_Edge: {
browserName: "edge",
browser_version: "latest",
os: "Windows",
os_version: "10",
},
os_version: "10"
}
};

@ -1,4 +1,4 @@
<!DOCTYPE html>
<!doctype html>
<html>
<head>
<meta

@ -3,7 +3,7 @@ import {
attributesModule,
styleModule,
eventListenersModule,
h,
h
} from "../../build/index.js";
const patch = init([attributesModule, styleModule, eventListenersModule]);
@ -11,7 +11,7 @@ const patch = init([attributesModule, styleModule, eventListenersModule]);
let vnode;
let data = {
degRotation: 0,
degRotation: 0
};
function gRotation() {
@ -45,13 +45,13 @@ const hTriangle = (id, degRotation) =>
attrs: {
points: "-50,-88 0,-175 50,-88",
transform: "rotate(" + degRotation + ")",
"stroke-width": 3,
"stroke-width": 3
},
on: {
click: () => {
triangleClick(id);
},
},
}
}
});
const view = () =>
@ -64,7 +64,7 @@ const view = () =>
h(
"g#carousel",
{
style: { "-webkit-transform": gRotation(), transform: gRotation() },
style: { "-webkit-transform": gRotation(), transform: gRotation() }
},
[
hTriangle("yellow", 0),
@ -72,9 +72,9 @@ const view = () =>
hTriangle("magenta", 120),
hTriangle("red", 180),
hTriangle("cyan", 240),
hTriangle("blue", 300),
hTriangle("blue", 300)
]
),
)
]
),
h(
@ -83,8 +83,8 @@ const view = () =>
on: {
click: () => {
handleRotate(60);
},
},
}
}
},
"Rotate Clockwise"
),
@ -94,8 +94,8 @@ const view = () =>
on: {
click: () => {
handleRotate(-60);
},
},
}
}
},
"Rotate Anticlockwise"
),
@ -105,11 +105,11 @@ const view = () =>
on: {
click: () => {
handleReset(0);
},
},
}
}
},
"Reset"
),
)
]);
window.addEventListener("DOMContentLoaded", () => {

@ -1,4 +1,4 @@
<!DOCTYPE html>
<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

@ -3,7 +3,7 @@ import {
classModule,
styleModule,
eventListenersModule,
h,
h
} from "../../build/index.js";
import { heroModule } from "./hero.js";
@ -12,7 +12,7 @@ const patch = init([
classModule,
heroModule,
styleModule,
eventListenersModule,
eventListenersModule
]);
let vnode;
@ -23,54 +23,54 @@ const data = {
{
rank: 1,
title: "This is an",
desc: "Lorem ipsum dolor sit amet, sed pede integer vitae bibendum, accumsan sit, vulputate aenean tempora ipsum. Lorem sed id et metus, eros posuere suspendisse nec nunc justo, fusce augue placerat nibh purus suspendisse. Aliquam aliquam, ut eget. Mollis a eget sed nibh tincidunt nec, mi integer, proin magna lacus iaculis tortor. Aliquam vel arcu arcu, vivamus a urna fames felis vel wisi, cursus tortor nec erat dignissim cras sem, mauris ac venenatis tellus elit.",
desc: "Lorem ipsum dolor sit amet, sed pede integer vitae bibendum, accumsan sit, vulputate aenean tempora ipsum. Lorem sed id et metus, eros posuere suspendisse nec nunc justo, fusce augue placerat nibh purus suspendisse. Aliquam aliquam, ut eget. Mollis a eget sed nibh tincidunt nec, mi integer, proin magna lacus iaculis tortor. Aliquam vel arcu arcu, vivamus a urna fames felis vel wisi, cursus tortor nec erat dignissim cras sem, mauris ac venenatis tellus elit."
},
{
rank: 2,
title: "example of",
desc: "Consequuntur ipsum nulla, consequat curabitur in magnis risus. Taciti mattis bibendum tellus nibh, at dui neque eget, odio pede ut, sapien pede, ipsum ut. Sagittis dui, sodales sem, praesent ipsum conubia eget lorem lobortis wisi.",
desc: "Consequuntur ipsum nulla, consequat curabitur in magnis risus. Taciti mattis bibendum tellus nibh, at dui neque eget, odio pede ut, sapien pede, ipsum ut. Sagittis dui, sodales sem, praesent ipsum conubia eget lorem lobortis wisi."
},
{
rank: 3,
title: "Snabbdom",
desc: "Quam lorem aliquam fusce wisi, urna purus ipsum pharetra sed, at cras sodales enim vestibulum odio cras, luctus integer phasellus.",
desc: "Quam lorem aliquam fusce wisi, urna purus ipsum pharetra sed, at cras sodales enim vestibulum odio cras, luctus integer phasellus."
},
{
rank: 4,
title: "doing hero transitions",
desc: "Et orci hac ultrices id in. Diam ultrices luctus egestas, sem aliquam auctor molestie odio laoreet. Pede nam cubilia, diam vestibulum ornare natoque, aenean etiam fusce id, eget dictum blandit et mauris mauris. Metus amet ad, elit porttitor a aliquet commodo lacus, integer neque imperdiet augue laoreet, nonummy turpis lacus sed pulvinar condimentum platea. Wisi eleifend quis, tristique dictum, ac dictumst. Sem nec tristique vel vehicula fringilla, nibh eu et posuere mi rhoncus.",
desc: "Et orci hac ultrices id in. Diam ultrices luctus egestas, sem aliquam auctor molestie odio laoreet. Pede nam cubilia, diam vestibulum ornare natoque, aenean etiam fusce id, eget dictum blandit et mauris mauris. Metus amet ad, elit porttitor a aliquet commodo lacus, integer neque imperdiet augue laoreet, nonummy turpis lacus sed pulvinar condimentum platea. Wisi eleifend quis, tristique dictum, ac dictumst. Sem nec tristique vel vehicula fringilla, nibh eu et posuere mi rhoncus."
},
{
rank: 5,
title: "using the",
desc: "Pede nam cubilia, diam vestibulum ornare natoque, aenean etiam fusce id, eget dictum blandit et mauris mauris. Metus amet ad, elit porttitor a aliquet commodo lacus, integer neque imperdiet augue laoreet, nonummy turpis lacus sed pulvinar condimentum platea. Wisi eleifend quis, tristique dictum, ac dictumst. Sem nec tristique vel vehicula fringilla, nibh eu et posuere mi rhoncus.",
desc: "Pede nam cubilia, diam vestibulum ornare natoque, aenean etiam fusce id, eget dictum blandit et mauris mauris. Metus amet ad, elit porttitor a aliquet commodo lacus, integer neque imperdiet augue laoreet, nonummy turpis lacus sed pulvinar condimentum platea. Wisi eleifend quis, tristique dictum, ac dictumst. Sem nec tristique vel vehicula fringilla, nibh eu et posuere mi rhoncus."
},
{
rank: 6,
title: "module for hero transitions",
desc: "Sapien laoreet, ligula elit tortor nulla pellentesque, maecenas enim turpis, quae duis venenatis vivamus ultricies, nunc imperdiet sollicitudin ipsum malesuada. Ut sem. Wisi fusce nullam nibh enim. Nisl hymenaeos id sed sed in. Proin leo et, pulvinar nunc pede laoreet.",
desc: "Sapien laoreet, ligula elit tortor nulla pellentesque, maecenas enim turpis, quae duis venenatis vivamus ultricies, nunc imperdiet sollicitudin ipsum malesuada. Ut sem. Wisi fusce nullam nibh enim. Nisl hymenaeos id sed sed in. Proin leo et, pulvinar nunc pede laoreet."
},
{
rank: 7,
title: "click on ar element in",
desc: "Accumsan quia, id nascetur dui et congue erat, id excepteur, primis ratione nec. At nulla et. Suspendisse lobortis, lobortis in tortor fringilla, duis adipiscing vestibulum voluptates sociosqu auctor.",
desc: "Accumsan quia, id nascetur dui et congue erat, id excepteur, primis ratione nec. At nulla et. Suspendisse lobortis, lobortis in tortor fringilla, duis adipiscing vestibulum voluptates sociosqu auctor."
},
{
rank: 8,
title: "the list",
desc: "Ante tellus egestas vel hymenaeos, ut viverra nibh ut, ipsum nibh donec donec dolor. Eros ridiculus vel egestas convallis ipsum, commodo ut venenatis nullam porta iaculis, suspendisse ante proin leo, felis risus etiam.",
desc: "Ante tellus egestas vel hymenaeos, ut viverra nibh ut, ipsum nibh donec donec dolor. Eros ridiculus vel egestas convallis ipsum, commodo ut venenatis nullam porta iaculis, suspendisse ante proin leo, felis risus etiam."
},
{
rank: 9,
title: "to witness",
desc: "Metus amet ad, elit porttitor a aliquet commodo lacus, integer neque imperdiet augue laoreet, nonummy turpis lacus sed pulvinar condimentum platea. Wisi eleifend quis, tristique dictum, ac dictumst.",
desc: "Metus amet ad, elit porttitor a aliquet commodo lacus, integer neque imperdiet augue laoreet, nonummy turpis lacus sed pulvinar condimentum platea. Wisi eleifend quis, tristique dictum, ac dictumst."
},
{
rank: 10,
title: "the effect",
desc: "Et orci hac ultrices id in. Diam ultrices luctus egestas, sem aliquam auctor molestie odio laoreet. Pede nam cubilia, diam vestibulum ornare natoque, aenean etiam fusce id, eget dictum blandit et mauris mauris",
},
],
desc: "Et orci hac ultrices id in. Diam ultrices luctus egestas, sem aliquam auctor molestie odio laoreet. Pede nam cubilia, diam vestibulum ornare natoque, aenean etiam fusce id, eget dictum blandit et mauris mauris"
}
]
};
function select(m) {
@ -85,7 +85,7 @@ function render() {
const fadeInOutStyle = {
opacity: "0",
delayed: { opacity: "1" },
remove: { opacity: "0" },
remove: { opacity: "0" }
};
const detailView = (movie) =>
@ -94,7 +94,7 @@ const detailView = (movie) =>
h(
"div.header-content.detail",
{
style: { opacity: "1", remove: { opacity: "0" } },
style: { opacity: "1", remove: { opacity: "0" } }
},
[
h("div.rank", [
@ -107,9 +107,9 @@ const detailView = (movie) =>
style: {
transform: "scale(0)",
delayed: { transform: "scale(1)" },
destroy: { transform: "scale(0)" },
},
}),
destroy: { transform: "scale(0)" }
}
})
]),
h(
"div.hero.header-title",
@ -123,18 +123,18 @@ const detailView = (movie) =>
on: {
click: () => {
select(undefined);
},
}
},
style: {
transform: "scale(0)",
delayed: { transform: "scale(1)" },
destroy: { transform: "scale(0)" },
},
destroy: { transform: "scale(0)" }
}
},
"x"
),
)
]
),
)
]),
h("div.page-content", [
h(
@ -149,13 +149,13 @@ const detailView = (movie) =>
position: "absolute",
top: "0",
left: "0",
transform: "translateX(3em)",
},
},
transform: "translateX(3em)"
}
}
},
[h("h2", "Description:"), h("span", movie.desc)]
),
]),
)
])
]);
const overviewView = (movies) =>
@ -164,7 +164,7 @@ const overviewView = (movies) =>
h(
"div.header-content.overview",
{
style: fadeInOutStyle,
style: fadeInOutStyle
},
[
h(
@ -173,14 +173,14 @@ const overviewView = (movies) =>
style: {
transform: "translateY(-2em)",
delayed: { transform: "translate(0)" },
destroy: { transform: "translateY(-2em)" },
},
destroy: { transform: "translateY(-2em)" }
}
},
"Top 10 movies"
),
h("div.spacer"),
h("div.spacer")
]
),
)
]),
h("div.page-content", [
h(
@ -189,8 +189,8 @@ const overviewView = (movies) =>
style: {
opacity: "0",
delayed: { opacity: "1" },
remove: { opacity: "0", position: "absolute", top: "0", left: "0" },
},
remove: { opacity: "0", position: "absolute", top: "0", left: "0" }
}
},
movies.map((movie) =>
h(
@ -199,8 +199,8 @@ const overviewView = (movies) =>
on: {
click: () => {
select(movie);
},
},
}
}
},
[
h("div.hero.rank", [
@ -208,19 +208,19 @@ const overviewView = (movies) =>
"span.hero",
{ hero: { id: "rank" + movie.rank } },
movie.rank
),
)
]),
h("div.hero", { hero: { id: movie.title } }, movie.title),
h("div.hero", { hero: { id: movie.title } }, movie.title)
]
)
)
),
]),
)
])
]);
const view = (data) =>
h("div.page-container", [
data.selected ? detailView(data.selected) : overviewView(data.movies),
data.selected ? detailView(data.selected) : overviewView(data.movies)
]);
window.addEventListener("DOMContentLoaded", () => {

@ -1,4 +1,4 @@
<!DOCTYPE html>
<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
@ -27,7 +27,9 @@
.btn:active,
.active,
.active:hover {
box-shadow: 0 0 1px rgba(0, 0, 0, 0.2), inset 0 0 4px rgba(0, 0, 0, 0.1);
box-shadow:
0 0 1px rgba(0, 0, 0, 0.2),
inset 0 0 4px rgba(0, 0, 0, 0.1);
}
.add {
float: right;
@ -49,9 +51,13 @@
padding: 1em;
background: #fff;
box-shadow: 0 0 1px rgba(0, 0, 0, 0.2);
transition: transform 0.5s ease-in-out, opacity 0.5s ease-out,
transition:
transform 0.5s ease-in-out,
opacity 0.5s ease-out,
left 0.5s ease-in-out;
-webkit-transition: transform 0.5s ease-in-out, opacity 0.5s ease-out,
-webkit-transition:
transform 0.5s ease-in-out,
opacity 0.5s ease-out,
left 0.5s ease-in-out;
}
.row div {

@ -4,14 +4,14 @@ import {
propsModule,
styleModule,
eventListenersModule,
h,
h
} from "../../build/index.js";
const patch = init([
classModule,
propsModule,
styleModule,
eventListenersModule,
eventListenersModule
]);
let vnode;
@ -25,62 +25,62 @@ const originalData = [
rank: 1,
title: "The Shawshank Redemption",
desc: "Two imprisoned men bond over a number of years, finding solace and eventual redemption through acts of common decency.",
elmHeight: 0,
elmHeight: 0
},
{
rank: 2,
title: "The Godfather",
desc: "The aging patriarch of an organized crime dynasty transfers control of his clandestine empire to his reluctant son.",
elmHeight: 0,
elmHeight: 0
},
{
rank: 3,
title: "The Godfather: Part II",
desc: "The early life and career of Vito Corleone in 1920s New York is portrayed while his son, Michael, expands and tightens his grip on his crime syndicate stretching from Lake Tahoe, Nevada to pre-revolution 1958 Cuba.",
elmHeight: 0,
elmHeight: 0
},
{
rank: 4,
title: "The Dark Knight",
desc: "When the menace known as the Joker wreaks havoc and chaos on the people of Gotham, the caped crusader must come to terms with one of the greatest psychological tests of his ability to fight injustice.",
elmHeight: 0,
elmHeight: 0
},
{
rank: 5,
title: "Pulp Fiction",
desc: "The lives of two mob hit men, a boxer, a gangster's wife, and a pair of diner bandits intertwine in four tales of violence and redemption.",
elmHeight: 0,
elmHeight: 0
},
{
rank: 6,
title: "Schindler's List",
desc: "In Poland during World War II, Oskar Schindler gradually becomes concerned for his Jewish workforce after witnessing their persecution by the Nazis.",
elmHeight: 0,
elmHeight: 0
},
{
rank: 7,
title: "12 Angry Men",
desc: "A dissenting juror in a murder trial slowly manages to convince the others that the case is not as obviously clear as it seemed in court.",
elmHeight: 0,
elmHeight: 0
},
{
rank: 8,
title: "The Good, the Bad and the Ugly",
desc: "A bounty hunting scam joins two men in an uneasy alliance against a third in a race to find a fortune in gold buried in a remote cemetery.",
elmHeight: 0,
elmHeight: 0
},
{
rank: 9,
title: "The Lord of the Rings: The Return of the King",
desc: "Gandalf and Aragorn lead the World of Men against Sauron's army to draw his gaze from Frodo and Sam as they approach Mount Doom with the One Ring.",
elmHeight: 0,
elmHeight: 0
},
{
rank: 10,
title: "Fight Club",
desc: "An insomniac office worker looking for a way to change his life crosses paths with a devil-may-care soap maker and they form an underground fight club that evolves into something much, much more...",
elmHeight: 0,
},
elmHeight: 0
}
];
let data = [
originalData[0],
@ -92,7 +92,7 @@ let data = [
originalData[6],
originalData[7],
originalData[8],
originalData[9],
originalData[9]
];
function changeSort(prop) {
@ -112,7 +112,7 @@ function changeSort(prop) {
function add() {
const n = originalData[Math.floor(Math.random() * 10)];
data = [
{ rank: nextKey++, title: n.title, desc: n.desc, elmHeight: 0 },
{ rank: nextKey++, title: n.title, desc: n.desc, elmHeight: 0 }
].concat(data);
render();
render();
@ -136,14 +136,14 @@ function movieView(movie) {
delayed: { transform: `translateY(${movie.offset}px)`, opacity: "1" },
remove: {
opacity: "0",
transform: `translateY(${movie.offset}px) translateX(200px)`,
},
transform: `translateY(${movie.offset}px) translateX(200px)`
}
},
hook: {
insert: (vnode) => {
movie.elmHeight = vnode.elm.offsetHeight;
},
},
}
}
},
[
h("div", { style: { fontWeight: "bold" } }, movie.rank),
@ -155,11 +155,11 @@ function movieView(movie) {
on: {
click: () => {
remove(movie);
},
},
}
}
},
"x"
),
)
]
);
}
@ -191,8 +191,8 @@ function view(data) {
on: {
click: () => {
changeSort("rank");
},
},
}
}
},
"Rank"
),
@ -203,8 +203,8 @@ function view(data) {
on: {
click: () => {
changeSort("title");
},
},
}
}
},
"Title"
),
@ -215,18 +215,18 @@ function view(data) {
on: {
click: () => {
changeSort("desc");
},
},
}
}
},
"Description"
),
]),
)
])
]),
h(
"div.list",
{ style: { height: totalHeight + "px" } },
data.map(movieView)
),
)
]);
}

@ -1,4 +1,4 @@
<!DOCTYPE html>
<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
@ -27,7 +27,9 @@
.btn:active,
.active,
.active:hover {
box-shadow: 0 0 1px rgba(0, 0, 0, 0.2), inset 0 0 4px rgba(0, 0, 0, 0.1);
box-shadow:
0 0 1px rgba(0, 0, 0, 0.2),
inset 0 0 4px rgba(0, 0, 0, 0.1);
}
.add {
float: right;
@ -49,9 +51,13 @@
padding: 1em;
background: #fff;
box-shadow: 0 0 1px rgba(0, 0, 0, 0.2);
transition: transform 0.5s ease-in-out, opacity 0.5s ease-out,
transition:
transform 0.5s ease-in-out,
opacity 0.5s ease-out,
left 0.5s ease-in-out;
-webkit-transition: transform 0.5s ease-in-out, opacity 0.5s ease-out,
-webkit-transition:
transform 0.5s ease-in-out,
opacity 0.5s ease-out,
left 0.5s ease-in-out;
}
.row div {

@ -13,10 +13,10 @@ window.addEventListener("DOMContentLoaded", () => {
r: 40,
stroke: "green",
"stroke-width": 4,
fill: "yellow",
},
}),
]),
fill: "yellow"
}
})
])
]);
patch(container, vnode);
});

@ -37,7 +37,7 @@ document.addEventListener("DOMContentLoaded", function () {
a.patch(emptyNode, vnode1);
a.patch(vnode1, vnode2);
a.patch(vnode2, a.emptyNode);
},
}
})
.add("b/ insert first", {
setup: function () {
@ -49,7 +49,7 @@ document.addEventListener("DOMContentLoaded", function () {
b.patch(emptyNode, vnode1);
b.patch(vnode1, vnode2);
b.patch(vnode2, b.emptyNode);
},
}
})
// add listeners
.on("cycle", function (event) {

@ -1,4 +1,4 @@
<!DOCTYPE html>
<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

@ -16,7 +16,7 @@ export type VNodeChildren = ArrayOrElement<VNodeChildElement>;
export function addNS(
data: any,
children: Array<VNode | string> | undefined,
sel: string | undefined,
sel: string | undefined
): void {
data.ns = "http://www.w3.org/2000/svg";
if (sel !== "foreignObject" && children !== undefined) {
@ -37,7 +37,7 @@ export function h(sel: string, children: VNodeChildren): VNode;
export function h(
sel: string,
data: VNodeData | null,
children: VNodeChildren,
children: VNodeChildren
): VNode;
export function h(sel: any, b?: any, c?: any): VNode {
let data: VNodeData = {};
@ -74,7 +74,7 @@ export function h(sel: any, b?: any, c?: any): VNode {
undefined,
undefined,
children[i],
undefined,
undefined
);
}
}

@ -184,5 +184,5 @@ export const htmlDomApi: DOMAPI = {
isElement,
isText,
isComment,
isDocumentFragment,
isDocumentFragment
};

@ -20,7 +20,7 @@ export type {
VNodes,
VNodeChildElement,
ArrayOrElement,
VNodeChildren,
VNodeChildren
} from "./h";
// types

@ -37,14 +37,14 @@ function documentFragmentIsNotSupported(): never {
function isElement(
api: DOMAPI,
vnode: Element | DocumentFragment | VNode,
vnode: Element | DocumentFragment | VNode
): vnode is Element {
return api.isElement(vnode as any);
}
function isDocumentFragment(
api: DOMAPI,
vnode: DocumentFragment | VNode,
vnode: DocumentFragment | VNode
): vnode is DocumentFragment {
return api.isDocumentFragment!(vnode as any);
}
@ -60,7 +60,7 @@ type ModuleHooks = ArraysOf<Required<Module>>;
function createKeyToOldIdx(
children: VNode[],
beginIdx: number,
endIdx: number,
endIdx: number
): KeyToIndexMap {
const map: KeyToIndexMap = {};
for (let i = beginIdx; i <= endIdx; ++i) {
@ -78,7 +78,7 @@ const hooks: Array<keyof Module> = [
"remove",
"destroy",
"pre",
"post",
"post"
];
// TODO Should `domApi` be put into this in the next major version bump?
@ -91,7 +91,7 @@ export type Options = {
export function init(
modules: Array<Partial<Module>>,
domApi?: DOMAPI,
options?: Options,
options?: Options
) {
const cbs: ModuleHooks = {
create: [],
@ -99,7 +99,7 @@ export function init(
remove: [],
destroy: [],
pre: [],
post: [],
post: []
};
const api: DOMAPI = domApi !== undefined ? domApi : htmlDomApi;
@ -126,7 +126,7 @@ export function init(
{},
[],
undefined,
elm,
elm
);
}
@ -205,7 +205,7 @@ export function init(
if (ch != null) {
api.appendChild(
vnode.elm,
createElm(ch as VNode, insertedVnodeQueue),
createElm(ch as VNode, insertedVnodeQueue)
);
}
}
@ -221,7 +221,7 @@ export function init(
vnodes: VNode[],
startIdx: number,
endIdx: number,
insertedVnodeQueue: VNodeQueue,
insertedVnodeQueue: VNodeQueue
) {
for (; startIdx <= endIdx; ++startIdx) {
const ch = vnodes[startIdx];
@ -251,7 +251,7 @@ export function init(
parentElm: Node,
vnodes: VNode[],
startIdx: number,
endIdx: number,
endIdx: number
): void {
for (; startIdx <= endIdx; ++startIdx) {
let listeners: number;
@ -276,7 +276,7 @@ export function init(
parentElm,
ch.children as VNode[],
0,
ch.children.length - 1,
ch.children.length - 1
);
} else {
// Text node
@ -290,7 +290,7 @@ export function init(
parentElm: Node,
oldCh: VNode[],
newCh: VNode[],
insertedVnodeQueue: VNodeQueue,
insertedVnodeQueue: VNodeQueue
) {
let oldStartIdx = 0;
let newStartIdx = 0;
@ -328,7 +328,7 @@ export function init(
api.insertBefore(
parentElm,
oldStartVnode.elm!,
api.nextSibling(oldEndVnode.elm!),
api.nextSibling(oldEndVnode.elm!)
);
oldStartVnode = oldCh[++oldStartIdx];
newEndVnode = newCh[--newEndIdx];
@ -348,7 +348,7 @@ export function init(
api.insertBefore(
parentElm,
createElm(newStartVnode, insertedVnodeQueue),
oldStartVnode.elm!,
oldStartVnode.elm!
);
} else {
elmToMove = oldCh[idxInOld];
@ -356,7 +356,7 @@ export function init(
api.insertBefore(
parentElm,
createElm(newStartVnode, insertedVnodeQueue),
oldStartVnode.elm!,
oldStartVnode.elm!
);
} else {
patchVnode(elmToMove, newStartVnode, insertedVnodeQueue);
@ -376,7 +376,7 @@ export function init(
newCh,
newStartIdx,
newEndIdx,
insertedVnodeQueue,
insertedVnodeQueue
);
}
if (oldStartIdx <= oldEndIdx) {
@ -387,7 +387,7 @@ export function init(
function patchVnode(
oldVnode: VNode,
vnode: VNode,
insertedVnodeQueue: VNodeQueue,
insertedVnodeQueue: VNodeQueue
) {
const hook = vnode.data?.hook;
hook?.prepatch?.(oldVnode, vnode);
@ -427,7 +427,7 @@ export function init(
return function patch(
oldVnode: VNode | Element | DocumentFragment,
vnode: VNode,
vnode: VNode
): VNode {
let i: number, elm: Node, parent: Node;
const insertedVnodeQueue: VNodeQueue = [];

@ -14,7 +14,7 @@ export type JsxVNodeChildren = ArrayOrElement<JsxVNodeChild>;
export type FunctionComponent = (
props: { [prop: string]: any } | null,
children?: VNode[],
children?: VNode[]
) => VNode;
export function Fragment(
@ -34,7 +34,7 @@ export function Fragment(
undefined,
undefined,
flatChildren[0].text,
undefined,
undefined
);
} else {
return vnode(undefined, data ?? {}, flatChildren, undefined, undefined);
@ -43,7 +43,7 @@ export function Fragment(
function flattenAndFilter(
children: JsxVNodeChildren[],
flattened: VNode[],
flattened: VNode[]
): VNode[] {
for (const child of children) {
// filter out falsey children, except 0 since zero can be a valid value e.g inside a chart
@ -61,7 +61,7 @@ function flattenAndFilter(
typeof child === "boolean"
) {
flattened.push(
vnode(undefined, undefined, undefined, String(child), undefined),
vnode(undefined, undefined, undefined, String(child), undefined)
);
} else {
flattened.push(child);

@ -59,5 +59,5 @@ function updateAttrs(oldVnode: VNode, vnode: VNode): void {
export const attributesModule: Module = {
create: updateAttrs,
update: updateAttrs,
update: updateAttrs
};

@ -46,5 +46,5 @@ function updateDataset(oldVnode: VNode, vnode: VNode): void {
export const datasetModule: Module = {
create: updateDataset,
update: updateDataset,
update: updateDataset
};

@ -106,5 +106,5 @@ function updateEventListeners(oldVnode: VNode, vnode?: VNode): void {
export const eventListenersModule: Module = {
create: updateEventListeners,
update: updateEventListeners,
destroy: updateEventListeners,
destroy: updateEventListeners
};

@ -4,7 +4,7 @@ import {
UpdateHook,
DestroyHook,
RemoveHook,
PostHook,
PostHook
} from "../hooks";
export type Module = Partial<{

@ -120,5 +120,5 @@ export const styleModule: Module = {
create: updateStyle,
update: updateStyle,
destroy: applyDestroyStyle,
remove: applyRemoveStyle,
remove: applyRemoveStyle
};

@ -66,6 +66,6 @@ export const thunk = function thunk(
key: key,
hook: { init, prepatch },
fn: fn,
args: args,
args: args
});
} as ThunkFn;

@ -14,8 +14,8 @@ describe("attachTo", function () {
const vnode1 = h("div", [
h("div#wrapper", [
h("div", "Some element"),
attachTo(elm, h("div#attached", "Test")),
]),
attachTo(elm, h("div#attached", "Test"))
])
]);
elm = patch(vnode0, vnode1).elm;
assert.strictEqual(elm.children.length, 2);
@ -24,14 +24,14 @@ describe("attachTo", function () {
const vnode1 = h("div", [
h("div#wrapper", [
h("div", "Some element"),
attachTo(elm, h("div#attached", "First text")),
]),
attachTo(elm, h("div#attached", "First text"))
])
]);
const vnode2 = h("div", [
h("div#wrapper", [
h("div", "Some element"),
attachTo(elm, h("div#attached", "New text")),
]),
attachTo(elm, h("div#attached", "New text"))
])
]);
elm = patch(vnode0, vnode1).elm;
assert.strictEqual(elm.children[0].innerHTML, "First text");
@ -42,15 +42,15 @@ describe("attachTo", function () {
const vnode1 = h("div", [
h("div#wrapper", [
h("div", "Some element"),
attachTo(elm, h("div#attached", "Text")),
]),
attachTo(elm, h("div#attached", "Text"))
])
]);
const vnode2 = h("div", [
h("div#wrapper", [
h("div", "Some element"),
h("div", "A new element"),
attachTo(elm, h("div#attached", "Text")),
]),
attachTo(elm, h("div#attached", "Text"))
])
]);
elm = patch(vnode0, vnode1).elm;
assert.strictEqual(elm.children[0].innerHTML, "Text");
@ -61,8 +61,8 @@ describe("attachTo", function () {
const vnode1 = h("div", [
h("div#wrapper", [
h("div", "Some element"),
attachTo(elm, h("div#attached", "First text")),
]),
attachTo(elm, h("div#attached", "First text"))
])
]);
const vnode2 = h("div", [h("div#wrapper", [h("div", "Some element")])]);
elm = patch(vnode0, vnode1).elm;
@ -80,11 +80,8 @@ describe("attachTo", function () {
const vnode1 = h("div", [
h("div#wrapper", [
h("div", "Some element"),
attachTo(
elm,
h("div#attached", { hook: { remove: rm } }, "First text"),
),
]),
attachTo(elm, h("div#attached", { hook: { remove: rm } }, "First text"))
])
]);
const vnode2 = h("div", [h("div#wrapper", [h("div", "Some element")])]);
elm = patch(vnode0, vnode1).elm;

@ -12,7 +12,7 @@ describe("attributes", function () {
});
it("have their provided values", function () {
const vnode1 = h("div", {
attrs: { href: "/foo", minlength: 1, selected: true, disabled: false },
attrs: { href: "/foo", minlength: 1, selected: true, disabled: false }
});
elm = patch(vnode0, vnode1).elm;
assert.strictEqual(elm.getAttribute("href"), "/foo");
@ -36,7 +36,7 @@ describe("attributes", function () {
});
it("are not omitted when falsy values are provided", function () {
const vnode1 = h("div", {
attrs: { href: null as any, minlength: 0, value: "", title: "undefined" },
attrs: { href: null as any, minlength: 0, value: "", title: "undefined" }
});
elm = patch(vnode0, vnode1).elm;
assert.ok(elm.hasAttribute("href"));
@ -49,7 +49,7 @@ describe("attributes", function () {
elm = patch(vnode0, vnode1).elm;
assert.strictEqual(
elm.getAttributeNS("http://www.w3.org/1999/xlink", "href"),
"#foo",
"#foo"
);
});
it("should not touch class nor id fields", function () {
@ -69,7 +69,7 @@ describe("attributes", function () {
const elmNamespaceValue = "http://www.w3.org/1999/xlink";
const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
const vnodeSVG = h("svg", {
attrs: { [elmNamespaceQualifiedName]: elmNamespaceValue },
attrs: { [elmNamespaceQualifiedName]: elmNamespaceValue }
});
elm = patch(svg, vnodeSVG).elm;
@ -81,13 +81,13 @@ describe("attributes", function () {
// and namespaces are a legacy feature, no longer supported
assert.strictEqual(
elm.getAttribute(elmNamespaceQualifiedName),
elmNamespaceValue,
elmNamespaceValue
);
});
describe("boolean attribute", function () {
it("is present and empty string if the value is truthy", function () {
const vnode1 = h("div", {
attrs: { required: true, readonly: 1, noresize: "truthy" },
attrs: { required: true, readonly: 1, noresize: "truthy" }
});
elm = patch(vnode0, vnode1).elm;
assert.strictEqual(elm.hasAttribute("required"), true);
@ -105,7 +105,7 @@ describe("attributes", function () {
});
it("is not omitted if the value is falsy", function () {
const vnode1 = h("div", {
attrs: { readonly: 0, noresize: null as any },
attrs: { readonly: 0, noresize: null as any }
});
elm = patch(vnode0, vnode1).elm;
assert.ok(elm.hasAttribute("readonly"));

@ -19,7 +19,7 @@ import {
DestroyHook,
UpdateHook,
Key,
fragment,
fragment
} from "../../src/index";
const hasSvgClassList = "classList" in SVGElement.prototype;
@ -27,7 +27,7 @@ const hasSvgClassList = "classList" in SVGElement.prototype;
const patch = init(
[classModule, propsModule, eventListenersModule],
undefined,
{ experimental: { fragments: true } },
{ experimental: { fragments: true } }
);
/** Shuffle an array using Durstenfeld's version of the FisherYates shuffle. */
@ -155,14 +155,14 @@ describe("snabbdom", function () {
elm = patch(
vnode0,
h("svg", [
h("foreignObject", [h("div", ["I am HTML embedded in SVG"])]),
]),
h("foreignObject", [h("div", ["I am HTML embedded in SVG"])])
])
).elm;
assert.strictEqual(elm.namespaceURI, SVGNamespace);
assert.strictEqual(elm.firstChild.namespaceURI, SVGNamespace);
assert.strictEqual(
elm.firstChild.firstChild.namespaceURI,
XHTMLNamespace,
XHTMLNamespace
);
// verify that svg tag with extra selectors gets svg namespace
@ -182,7 +182,7 @@ describe("snabbdom", function () {
it("receives classes in class property", function () {
elm = patch(
vnode0,
h("i", { class: { am: true, a: true, class: true, not: false } }),
h("i", { class: { am: true, a: true, class: true, not: false } })
).elm;
assert(elm.classList.contains("am"));
assert(elm.classList.contains("a"));
@ -207,9 +207,9 @@ describe("snabbdom", function () {
vnode0,
h("svg", [
h("g", {
class: { am: true, a: true, class: true, not: false, too: true },
}),
]),
class: { am: true, a: true, class: true, not: false, too: true }
})
])
).elm;
assert(elm.firstChild.classList.contains("am"));
assert(elm.firstChild.classList.contains("a"));
@ -220,12 +220,12 @@ describe("snabbdom", function () {
it("handles classes from both selector and property", function () {
elm = patch(
vnode0,
h("div", [h("i.has", { class: { classes: true } })]),
h("div", [h("i.has", { class: { classes: true } })])
).elm;
assert(elm.firstChild.classList.contains("has"), "has `has` class");
assert(
elm.firstChild.classList.contains("classes"),
"has `classes` class",
"has `classes` class"
);
});
it("can create elements with text content", function () {
@ -252,11 +252,11 @@ describe("snabbdom", function () {
frame.srcdoc = "<div>Thing 1</div>";
frame.onload = function () {
const div0 = frame.contentDocument!.body.querySelector(
"div",
"div"
) as HTMLDivElement;
patch(div0, h("div", "Thing 2"));
const div1 = frame.contentDocument!.body.querySelector(
"div",
"div"
) as HTMLDivElement;
assert.strictEqual(div1.textContent, "Thing 2");
frame.remove();
@ -348,13 +348,13 @@ describe("snabbdom", function () {
"div",
{
style: { height: "100px", overflowY: "scroll" },
props: { scrollTop },
props: { scrollTop }
},
[h("div", { style: { height: "200px" } })],
[h("div", { style: { height: "200px" } })]
);
const vnode1 = view(0);
const mountPoint = document.body.appendChild(
document.createElement("div"),
document.createElement("div")
);
const { elm } = patch(mountPoint, vnode1);
if (!(elm instanceof HTMLDivElement)) throw new Error();
@ -416,7 +416,7 @@ describe("snabbdom", function () {
if ("customElements" in window) {
describe("customized built-in element", function () {
const isSafari = /^((?!chrome|android).)*safari/i.test(
navigator.userAgent,
navigator.userAgent
);
if (!isSafari) {
@ -484,7 +484,7 @@ describe("snabbdom", function () {
{},
[h("div#id.class", [h("span", "Hi")])],
undefined,
prevElm as any,
prevElm as any
);
elm = patch(toVNode(prevElm), nextVNode).elm;
assert.strictEqual(elm, prevElm);
@ -543,7 +543,7 @@ describe("snabbdom", function () {
...htmlDomApi,
tagName: function (elm: Element) {
return "x-" + elm.tagName.toUpperCase();
},
}
};
const h2 = document.createElement("h2");
h2.id = "hx";
@ -571,12 +571,12 @@ describe("snabbdom", function () {
const onlyDataset = document.createElement("div");
onlyDataset.setAttribute("data-foo", "bar");
assert.deepEqual(toVNode(onlyDataset).data, {
dataset: { foo: "bar" },
dataset: { foo: "bar" }
});
const onlyDatasets2 = document.createElement("div");
onlyDatasets2.dataset.foo = "bar";
assert.deepEqual(toVNode(onlyDatasets2).data, {
dataset: { foo: "bar" },
dataset: { foo: "bar" }
});
const bothAttrsAndDatasets = document.createElement("div");
bothAttrsAndDatasets.setAttribute("foo", "bar");
@ -584,7 +584,7 @@ describe("snabbdom", function () {
bothAttrsAndDatasets.dataset.again = "again";
assert.deepEqual(toVNode(bothAttrsAndDatasets).data, {
attrs: { foo: "bar" },
dataset: { foo: "bar", again: "again" },
dataset: { foo: "bar", again: "again" }
});
});
});
@ -657,7 +657,7 @@ describe("snabbdom", function () {
const vnode2 = h("span", { key: "span" }, [
spanNum(1),
h("i", { key: 2 }, "2"),
spanNum(3),
spanNum(3)
]);
elm = patch(vnode0, vnode1).elm;
assert.deepEqual(map(inner, elm.children), ["1", "2", "3"]);
@ -797,7 +797,7 @@ describe("snabbdom", function () {
const vnode1 = h("span", [Symbol()].map(spanNum));
const vnode2 = h(
"span",
[Symbol("1"), Symbol("2"), Symbol("3")].map(spanNum),
[Symbol("1"), Symbol("2"), Symbol("3")].map(spanNum)
);
elm = patch(vnode0, vnode1).elm;
assert.equal(elm.children.length, 1);
@ -821,7 +821,7 @@ describe("snabbdom", function () {
"4",
"3",
"2",
"1",
"1"
]);
});
it("something", function () {
@ -836,7 +836,7 @@ describe("snabbdom", function () {
"2",
"1",
"5",
"0",
"0"
]);
});
it("handles random shuffles", function () {
@ -857,7 +857,7 @@ describe("snabbdom", function () {
"span",
arr.map(function (n) {
return spanNumWithOpacity(n, "1");
}),
})
);
const shufArr = shuffle(arr);
let elm: HTMLDivElement | HTMLSpanElement =
@ -871,13 +871,13 @@ describe("snabbdom", function () {
"span",
arr.map(function (n) {
return spanNumWithOpacity(shufArr[n], opacities[n]);
}),
})
);
elm = patch(vnode1, vnode2).elm as HTMLSpanElement;
for (i = 0; i < elms; ++i) {
assert.strictEqual(
elm.children[i].innerHTML,
shufArr[i].toString(),
shufArr[i].toString()
);
const opacity = (elm.children[i] as HTMLSpanElement).style.opacity;
assert.strictEqual(opacities[i].indexOf(opacity), 0);
@ -889,8 +889,8 @@ describe("snabbdom", function () {
const vnode2 = h(
"i",
[null, 2, undefined, null, 1, 0, null, 5, 4, null, 3, undefined].map(
spanNum,
),
spanNum
)
);
elm = patch(vnode0, vnode1).elm;
assert.strictEqual(elm.children.length, 6);
@ -901,7 +901,7 @@ describe("snabbdom", function () {
"0",
"5",
"4",
"3",
"3"
]);
});
it("supports all null/undefined children", function () {
@ -918,7 +918,7 @@ describe("snabbdom", function () {
"3",
"2",
"1",
"0",
"0"
]);
});
it("handles random shuffles with null/undefined children", function () {
@ -946,7 +946,7 @@ describe("snabbdom", function () {
map(inner, elm.children),
arr.filter(function (x) {
return x != null;
}),
})
);
}
});
@ -1021,7 +1021,7 @@ describe("snabbdom", function () {
const vnode1 = h("div", [
h("span", "One"),
h("span", "Two"),
h("span", "Three"),
h("span", "Three")
]);
const vnode2 = h("div", [h("span", "One"), h("span", "Three")]);
elm = patch(vnode0, vnode1).elm;
@ -1045,7 +1045,7 @@ describe("snabbdom", function () {
patch(vnode1, vnode2);
assert.deepEqual(map(prop("textContent"), elm.childNodes), [
"Two",
"Three",
"Three"
]);
});
it("removes a text node among other elements", function () {
@ -1054,7 +1054,7 @@ describe("snabbdom", function () {
patch(vnode0, vnode1);
assert.deepEqual(map(prop("textContent"), elm.childNodes), [
"One",
"Two",
"Two"
]);
patch(vnode1, vnode2);
assert.strictEqual(elm.childNodes.length, 1);
@ -1065,12 +1065,12 @@ describe("snabbdom", function () {
const vnode1 = h("div", [
h("span", "One"),
h("div", "Two"),
h("b", "Three"),
h("b", "Three")
]);
const vnode2 = h("div", [
h("b", "Three"),
h("span", "One"),
h("div", "Two"),
h("div", "Two")
]);
elm = patch(vnode0, vnode1).elm;
assert.deepEqual(map(inner, elm.children), ["One", "Two", "Three"]);
@ -1078,7 +1078,7 @@ describe("snabbdom", function () {
assert.deepEqual(map(prop("tagName"), elm.children), [
"B",
"SPAN",
"DIV",
"DIV"
]);
assert.deepEqual(map(inner, elm.children), ["Three", "One", "Two"]);
});
@ -1089,7 +1089,7 @@ describe("snabbdom", function () {
undefined,
undefined,
h("i", "1"),
undefined,
undefined
]);
const vnode3 = h("i", [
null,
@ -1098,7 +1098,7 @@ describe("snabbdom", function () {
null,
h("i", "2"),
undefined,
null,
null
]);
elm = patch(vnode0, vnode1).elm;
assert.deepEqual(map(inner, elm.children), ["1", "2"]);
@ -1177,9 +1177,9 @@ describe("snabbdom", function () {
h("span", "First sibling"),
h("div", { hook: { create: cb } }, [
h("span", "Child 1"),
h("span", "Child 2"),
h("span", "Child 2")
]),
h("span", "Can't touch me"),
h("span", "Can't touch me")
]);
patch(vnode0, vnode1);
assert.strictEqual(1, result.length);
@ -1196,9 +1196,9 @@ describe("snabbdom", function () {
h("span", "First sibling"),
h("div", { hook: { insert: cb } }, [
h("span", "Child 1"),
h("span", "Child 2"),
h("span", "Child 2")
]),
h("span", "Can touch me"),
h("span", "Can touch me")
]);
patch(vnode0, vnode1);
assert.strictEqual(1, result.length);
@ -1214,15 +1214,15 @@ describe("snabbdom", function () {
h("span", "First sibling"),
h("div", { hook: { prepatch: cb } }, [
h("span", "Child 1"),
h("span", "Child 2"),
]),
h("span", "Child 2")
])
]);
const vnode2 = h("div", [
h("span", "First sibling"),
h("div", { hook: { prepatch: cb } }, [
h("span", "Child 1"),
h("span", "Child 2"),
]),
h("span", "Child 2")
])
]);
patch(vnode0, vnode1);
patch(vnode1, vnode2);
@ -1242,15 +1242,15 @@ describe("snabbdom", function () {
h("span", "First sibling"),
h("div", { hook: { prepatch: preCb, postpatch: postCb } }, [
h("span", "Child 1"),
h("span", "Child 2"),
]),
h("span", "Child 2")
])
]);
const vnode2 = h("div", [
h("span", "First sibling"),
h("div", { hook: { prepatch: preCb, postpatch: postCb } }, [
h("span", "Child 1"),
h("span", "Child 2"),
]),
h("span", "Child 2")
])
]);
patch(vnode0, vnode1);
patch(vnode1, vnode2);
@ -1272,15 +1272,15 @@ describe("snabbdom", function () {
h("span", "First sibling"),
h("div", { hook: { update: cb.bind(null, result1) } }, [
h("span", "Child 1"),
h("span", { hook: { update: cb.bind(null, result2) } }, "Child 2"),
]),
h("span", { hook: { update: cb.bind(null, result2) } }, "Child 2")
])
]);
const vnode2 = h("div", [
h("span", "First sibling"),
h("div", { hook: { update: cb.bind(null, result1) } }, [
h("span", "Child 1"),
h("span", { hook: { update: cb.bind(null, result2) } }, "Child 2"),
]),
h("span", { hook: { update: cb.bind(null, result2) } }, "Child 2")
])
]);
patch(vnode0, vnode1);
patch(vnode1, vnode2);
@ -1302,8 +1302,8 @@ describe("snabbdom", function () {
h("span", "First sibling"),
h("div", { hook: { remove: cb } }, [
h("span", "Child 1"),
h("span", "Child 2"),
]),
h("span", "Child 2")
])
]);
const vnode2 = h("div", [h("span", "First sibling")]);
patch(vnode0, vnode1);
@ -1316,7 +1316,7 @@ describe("snabbdom", function () {
calls++;
}
const vnode1 = h("div", [
h("div", { hook: { destroy: cb } }, [h("span", "Child 1")]),
h("div", { hook: { destroy: cb } }, [h("span", "Child 1")])
]);
const vnode2 = h("div", "Text node");
patch(vnode0, vnode1);
@ -1346,22 +1346,22 @@ describe("snabbdom", function () {
{
remove: function (_, rm) {
rm1 = rm;
},
}
},
{
remove: function (_, rm) {
rm2 = rm;
},
},
}
}
]);
const vnode1 = h("div", [
h("a", {
hook: {
remove: function (_, rm) {
rm3 = rm;
},
},
}),
}
}
})
]);
const vnode2 = h("div", []);
elm = patch(vnode0, vnode1).elm;
@ -1386,7 +1386,7 @@ describe("snabbdom", function () {
};
const vnode1 = h("div", { hook: { remove: cb } }, [
h("b", "Child 1"),
h("i", "Child 2"),
h("i", "Child 2")
]);
const vnode2 = h("span", [h("b", "Child 1"), h("i", "Child 2")]);
patch(vnode0, vnode1);
@ -1401,13 +1401,13 @@ describe("snabbdom", function () {
{
pre: function () {
result.push("pre");
},
}
},
{
post: function () {
result.push("post");
},
},
}
}
]);
const vnode1 = h("div");
patch(vnode0, vnode1);
@ -1422,8 +1422,8 @@ describe("snabbdom", function () {
h("span", "First sibling"),
h("div", [
h("span", { hook: { destroy: cb } }, "Child 1"),
h("span", "Child 2"),
]),
h("span", "Child 2")
])
]);
const vnode2 = h("div");
patch(vnode0, vnode1);
@ -1443,17 +1443,17 @@ describe("snabbdom", function () {
{
create: function () {
created++;
},
}
},
{
destroy: function () {
destroyed++;
},
},
}
}
]);
const vnode1 = h("div", [
h("span", "First sibling"),
h("div", [h("span", "Child 1"), h("span", "Child 2")]),
h("div", [h("span", "Child 1"), h("span", "Child 2")])
]);
const vnode2 = h("div");
patch(vnode0, vnode1);
@ -1468,18 +1468,18 @@ describe("snabbdom", function () {
{
create: function () {
created++;
},
}
},
{
remove: function () {
removed++;
},
},
}
}
]);
const vnode1 = h("div", [
h("span", "First child"),
"",
h("span", "Third child"),
h("span", "Third child")
]);
const vnode2 = h("div");
patch(vnode0, vnode1);
@ -1494,17 +1494,17 @@ describe("snabbdom", function () {
{
create: function () {
created++;
},
}
},
{
destroy: function () {
destroyed++;
},
},
}
}
]);
const vnode1 = h("div", [
h("span", "First sibling"),
h("div", [h("span", "Child 1"), h("span", ["Text 1", "Text 2"])]),
h("div", [h("span", "Child 1"), h("span", ["Text 1", "Text 2"])])
]);
const vnode2 = h("div");
patch(vnode0, vnode1);
@ -1522,7 +1522,7 @@ describe("snabbdom", function () {
};
const vnode1 = h("div", [
h("span", { hook: { update: cb } }, "Hello"),
h("span", "there"),
h("span", "there")
]);
patch(vnode0, vnode1);
patch(vnode1, vnode1);
@ -1535,7 +1535,7 @@ describe("snabbdom", function () {
}
const vnode1 = h("div", [
h("span", { hook: { patch: cb } as any }, "Hello"),
h("span", "there"),
h("span", "there")
]);
const vnode2 = h("div");
vnode2.children = vnode1.children;

@ -59,8 +59,8 @@ describe("dataset", function () {
dashed: "foo-bar",
camel: "fooBar",
integer: 0 as any,
float: 0.1 as any,
},
float: 0.1 as any
}
});
elm = patch(vnode0, vnode1).elm;

@ -16,7 +16,7 @@ describe("event listeners", function () {
result.push(ev);
}
const vnode = h("div", { on: { click: clicked } }, [
h("a", "Click my parent"),
h("a", "Click my parent")
]);
elm = patch(vnode0, vnode).elm;
elm.click();
@ -31,10 +31,10 @@ describe("event listeners", function () {
on: {
click: function () {
result.push(1);
},
},
}
}
},
[h("a", "Click my parent")],
[h("a", "Click my parent")]
);
const vnode2 = h(
"div",
@ -42,10 +42,10 @@ describe("event listeners", function () {
on: {
click: function () {
result.push(2);
},
},
}
}
},
[h("a", "Click my parent")],
[h("a", "Click my parent")]
);
elm = patch(vnode0, vnode1).elm;
elm.click();
@ -59,7 +59,7 @@ describe("event listeners", function () {
result.push(ev);
}
const vnode1 = h("div", { on: { click: clicked } }, [
h("a", "Click my parent"),
h("a", "Click my parent")
]);
elm = patch(vnode0, vnode1).elm;
elm.click();
@ -79,13 +79,13 @@ describe("event listeners", function () {
assert.strictEqual(vnode.sel, "div");
}
const vnode1 = h("div", { on: { click: [clicked, clicked, clicked] } }, [
h("a", "Click my parent"),
h("a", "Click my parent")
]);
elm = patch(vnode0, vnode1).elm;
elm.click();
assert.strictEqual(3, called);
const vnode2 = h("div", { on: { click: [clicked, clicked] } }, [
h("a", "Click my parent"),
h("a", "Click my parent")
]);
elm = patch(vnode1, vnode2).elm;
elm.click();
@ -98,7 +98,7 @@ describe("event listeners", function () {
result.push(vnode);
}
const vnode1 = h("div", { on: { click: clicked } }, [
h("a", "Click my parent"),
h("a", "Click my parent")
]);
elm = patch(vnode0, vnode1).elm;
elm.click();
@ -111,10 +111,10 @@ describe("event listeners", function () {
const sharedHandlers = {
click: function (ev: Event) {
result.push(ev);
},
}
};
const vnode1 = h("div", { on: sharedHandlers }, [
h("a", { on: sharedHandlers }, "Click my parent"),
h("a", { on: sharedHandlers }, "Click my parent")
]);
elm = patch(vnode0, vnode1).elm;
elm.click();

@ -25,10 +25,10 @@ describe("svg", function () {
h(
"use",
{
attrs: { "xlink:href": testUrl },
attrs: { "xlink:href": testUrl }
},
[],
),
[]
)
]);
const result = patch(vnode0, a).elm as SVGElement;

@ -12,7 +12,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "Hello World",
key: undefined,
key: undefined
});
});
@ -25,7 +25,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "foo bar",
key: undefined,
key: undefined
});
});
@ -47,7 +47,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "foo",
key: undefined,
key: undefined
},
{
sel: undefined,
@ -55,12 +55,12 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "bar",
key: undefined,
},
key: undefined
}
],
elm: undefined,
text: undefined,
key: undefined,
key: undefined
});
});
@ -85,7 +85,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "A Heading",
key: undefined,
key: undefined
},
{
sel: undefined,
@ -93,7 +93,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "some description",
key: undefined,
key: undefined
},
{
sel: "span",
@ -101,7 +101,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "part1",
key: undefined,
key: undefined
},
{
sel: "span",
@ -109,12 +109,12 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "part2",
key: undefined,
},
key: undefined
}
],
elm: undefined,
text: undefined,
key: undefined,
key: undefined
});
});
@ -147,7 +147,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "Login Form",
key: undefined,
key: undefined
},
{
sel: undefined,
@ -155,7 +155,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "Login Attempts: ",
key: undefined,
key: undefined
},
{
sel: undefined,
@ -163,7 +163,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "0",
key: undefined,
key: undefined
},
{
sel: undefined,
@ -171,7 +171,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "Logged In: ",
key: undefined,
key: undefined
},
{
sel: undefined,
@ -179,12 +179,12 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "true",
key: undefined,
},
key: undefined
}
],
elm: undefined,
text: undefined,
key: undefined,
key: undefined
});
});
@ -215,7 +215,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "Snabbdom",
key: undefined,
key: undefined
},
{
sel: undefined,
@ -223,7 +223,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "and tsx",
key: undefined,
key: undefined
},
{
sel: "span",
@ -231,7 +231,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "work",
key: undefined,
key: undefined
},
{
sel: "span",
@ -239,7 +239,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "like",
key: undefined,
key: undefined
},
{
sel: "span",
@ -247,7 +247,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "a",
key: undefined,
key: undefined
},
{
sel: "span",
@ -255,7 +255,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "charm!",
key: undefined,
key: undefined
},
{
sel: undefined,
@ -263,12 +263,12 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "💃🕺🎉",
key: undefined,
},
key: undefined
}
],
elm: undefined,
text: undefined,
key: undefined,
key: undefined
});
});
});
@ -283,7 +283,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "Hello World",
key: undefined,
key: undefined
});
});
@ -296,7 +296,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "foo bar",
key: undefined,
key: undefined
});
});
@ -318,7 +318,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "foo",
key: undefined,
key: undefined
},
{
sel: undefined,
@ -326,12 +326,12 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "bar",
key: undefined,
},
key: undefined
}
],
elm: undefined,
text: undefined,
key: undefined,
key: undefined
});
});
@ -356,7 +356,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "A Heading",
key: undefined,
key: undefined
},
{
sel: undefined,
@ -364,7 +364,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "some description",
key: undefined,
key: undefined
},
{
sel: "span",
@ -372,7 +372,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "part1",
key: undefined,
key: undefined
},
{
sel: "span",
@ -380,12 +380,12 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "part2",
key: undefined,
},
key: undefined
}
],
elm: undefined,
text: undefined,
key: undefined,
key: undefined
});
});
@ -418,7 +418,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "Login Form",
key: undefined,
key: undefined
},
{
sel: undefined,
@ -426,7 +426,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "Login Attempts: ",
key: undefined,
key: undefined
},
{
sel: undefined,
@ -434,7 +434,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "0",
key: undefined,
key: undefined
},
{
sel: undefined,
@ -442,7 +442,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "Logged In: ",
key: undefined,
key: undefined
},
{
sel: undefined,
@ -450,12 +450,12 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "true",
key: undefined,
},
key: undefined
}
],
elm: undefined,
text: undefined,
key: undefined,
key: undefined
});
});
@ -486,7 +486,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "Snabbdom",
key: undefined,
key: undefined
},
{
sel: undefined,
@ -494,7 +494,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "and tsx",
key: undefined,
key: undefined
},
{
sel: undefined,
@ -502,7 +502,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "work",
key: undefined,
key: undefined
},
{
sel: undefined,
@ -510,7 +510,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "like",
key: undefined,
key: undefined
},
{
sel: undefined,
@ -518,7 +518,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "a",
key: undefined,
key: undefined
},
{
sel: undefined,
@ -526,7 +526,7 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "charm!",
key: undefined,
key: undefined
},
{
sel: undefined,
@ -534,20 +534,20 @@ describe("snabbdom", function () {
children: undefined,
elm: undefined,
text: "💃🕺🎉",
key: undefined,
},
key: undefined
}
],
elm: undefined,
text: undefined,
key: undefined,
key: undefined
});
});
it("can correctly be patched", function () {
const patch = init([], undefined, {
experimental: {
fragments: true,
},
fragments: true
}
});
const container = document.createElement("div");
@ -565,7 +565,7 @@ describe("snabbdom", function () {
assert.strictEqual(vnode0.elm?.nodeType, document.DOCUMENT_FRAGMENT_NODE);
assert.strictEqual(
vnode0.elm?.textContent,
"Nested children will be flattened",
"Nested children will be flattened"
);
const vnode1 = (
@ -582,7 +582,7 @@ describe("snabbdom", function () {
assert.strictEqual((vnode1.elm as HTMLElement).tagName, "DIV");
assert.strictEqual(
vnode1.elm?.textContent,
"Nested child nodes will be patched",
"Nested child nodes will be patched"
);
const vnode2 = (

@ -113,10 +113,10 @@ describe("style", function () {
});
it("updates delayed styles in next frame", function (done) {
const vnode1 = h("i", {
style: { fontSize: "14px", delayed: { fontSize: "16px" } as any },
style: { fontSize: "14px", delayed: { fontSize: "16px" } as any }
});
const vnode2 = h("i", {
style: { fontSize: "18px", delayed: { fontSize: "20px" } as any },
style: { fontSize: "18px", delayed: { fontSize: "20px" } as any }
});
elm = patch(vnode0, vnode1).elm;
assert.strictEqual(elm.style.fontSize, "14px");
@ -140,10 +140,10 @@ describe("style", function () {
{
style: {
transition: "transform 0.1s",
remove: { transform: "translateY(100%)" } as any,
},
remove: { transform: "translateY(100%)" } as any
}
},
["A button"],
["A button"]
);
const vnode1 = h("div.parent", {}, [btn]);
const vnode2 = h("div.parent", {}, [null]);

@ -172,13 +172,13 @@ describe("thunk", function () {
return h(
"span",
{ key: "num", hook: { destroy: destroyHook } },
`Number is ${n}`,
`Number is ${n}`
);
}
const vnode1 = h("div", [
h("div", "Foo"),
thunk("span", "num", numberInSpan, [1]),
h("div", "Foo"),
h("div", "Foo")
]);
const vnode2 = h("div", [h("div", "Foo"), h("div", "Foo")]);
patch(vnode0, vnode1);
@ -194,13 +194,13 @@ describe("thunk", function () {
return h(
"span",
{ key: "num", hook: { remove: hook } },
`Number is ${n}`,
`Number is ${n}`
);
}
const vnode1 = h("div", [
h("div", "Foo"),
thunk("span", "num", numberInSpan, [1]),
h("div", "Foo"),
h("div", "Foo")
]);
const vnode2 = h("div", [h("div", "Foo"), h("div", "Foo")]);
patch(vnode0, vnode1);

@ -9,7 +9,7 @@ const sharedCapabilities = {
"browserstack.key": process.env.BROWSER_STACK_ACCESS_KEY,
project: "snabbdom",
name: "CI",
build: `build ${process.env.GITHUB_RUN_NUMBER || "unknown"}`,
build: `build ${process.env.GITHUB_RUN_NUMBER || "unknown"}`
};
export default {
@ -21,12 +21,12 @@ export default {
browserstackLauncher({
capabilities: {
...sharedCapabilities,
...cap,
},
}),
...cap
}
})
),
files: ["src/**/*.ts", "test/unit/*.ts", "test/unit/*.tsx"],
plugins: [
esbuildPlugin({ ts: true, tsx: true, tsconfig: "./test/tsconfig.json" }),
],
esbuildPlugin({ ts: true, tsx: true, tsconfig: "./test/tsconfig.json" })
]
};

Loading…
Cancel
Save