Skip to content
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions tests/MiniReact.context.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@ import {
render,
useContext,
useState,
} from "../src/MiniReact";
import type { FunctionalComponent } from "../src/core/types";
} from "@/MiniReact";
import type { FunctionalComponent } from "@/core/types";

describe("MiniReact.Context API", () => {
let container: HTMLElement;
Expand Down
4 changes: 2 additions & 2 deletions tests/MiniReact.createElement.test.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { describe, expect, test } from "bun:test";
import { createElement } from "../src/MiniReact";
import { TEXT_ELEMENT } from "../src/core/types";
import { createElement } from "@/MiniReact";
import { TEXT_ELEMENT } from "@/core/types";

describe("MiniReact.createElement", () => {
test("should create an element with type and props", () => {
Expand Down
8 changes: 4 additions & 4 deletions tests/MiniReact.createElementFC.test.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { describe, expect, test } from "bun:test";
import { createElement } from "../src/MiniReact";
import type { InternalTextElement, MiniReactElement } from "../src/core/types";
import { TEXT_ELEMENT } from "../src/core/types";
import { createElement } from "@/MiniReact";
import type { InternalTextElement, MiniReactElement } from "@/core/types";
import { TEXT_ELEMENT } from "@/core/types";

describe("MiniReact.createElement with Functional Components", () => {
const MyComponent = (
Expand Down Expand Up @@ -433,7 +433,7 @@ describe("MiniReact.createElement with Functional Components", () => {
"deep-value",
);
expect(
typedProps.deep.level1.level2.level3.level4.level5.array[0].nested,
typedProps.deep.level1.level2.level3.level4.level5.array[0]!.nested,
).toBe("in-array");
});
});
4 changes: 2 additions & 2 deletions tests/MiniReact.events.test.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { afterEach, beforeEach, describe, expect, test } from "bun:test";
import { createElement, render, useState } from "../src/MiniReact";
import type { FunctionalComponent, SyntheticEvent } from "../src/MiniReact";
import { createElement, render, useState } from "@/MiniReact";
import type { FunctionalComponent, SyntheticEvent } from "@/MiniReact";

describe("MiniReact.events", () => {
let container: HTMLElement;
Expand Down
8 changes: 4 additions & 4 deletions tests/MiniReact.fragments.test.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { beforeEach, describe, expect, test } from "bun:test";
import { Fragment, createElement, render, useState } from "../src/MiniReact";
import { Fragment, createElement, render, useState } from "@/MiniReact";

describe("MiniReact Fragment Tests", () => {
let container: HTMLElement;
Expand Down Expand Up @@ -181,13 +181,13 @@ describe("MiniReact Fragment Tests", () => {
const button = container.querySelector("button");
const spans = container.querySelectorAll("span");

expect(spans[0].textContent).toBe("Count: ");
expect(spans[1].textContent).toBe("0");
expect(spans[0]!.textContent).toBe("Count: ");
expect(spans[1]!.textContent).toBe("0");

// Simulate click
button?.click();

expect(spans[1].textContent).toBe("1");
expect(spans[1]!.textContent).toBe("1");
});
});

Expand Down
89 changes: 41 additions & 48 deletions tests/MiniReact.jsx.test.ts
Original file line number Diff line number Diff line change
@@ -1,14 +1,7 @@
import { beforeEach, describe, expect, test } from "bun:test";
import { Fragment, jsx, jsxDEV, jsxs, render, useState } from "@/MiniReact";
import type { FunctionalComponent, MiniReactElement } from "@/core/types";
import { Window } from "happy-dom";
import {
Fragment,
jsx,
jsxDEV,
jsxs,
render,
useState,
} from "../src/MiniReact";
import type { FunctionalComponent, MiniReactElement } from "../src/core/types";

let window: Window;
let document: Document;
Expand All @@ -30,7 +23,7 @@ describe("JSX Runtime Functions", () => {
const element = jsx("div", { id: "test" }) as MiniReactElement;

expect(element.type).toBe("div");
expect((element.props as Record<string, unknown>).id).toBe("test");
expect((element.props as Record<string, unknown>)["id"]).toBe("test");
expect(element.props.children).toEqual([]);
});

Expand All @@ -52,8 +45,8 @@ describe("JSX Runtime Functions", () => {
test("jsx() handles key prop", () => {
const element = jsx("div", { id: "test" }, "my-key") as MiniReactElement;

expect((element.props as Record<string, unknown>).key).toBe("my-key");
expect((element.props as Record<string, unknown>).id).toBe("test");
expect((element.props as Record<string, unknown>)["key"]).toBe("my-key");
expect((element.props as Record<string, unknown>)["id"]).toBe("test");
});

test("jsxs() works identically to jsx()", () => {
Expand All @@ -75,13 +68,13 @@ describe("JSX Runtime Functions", () => {
);

expect(element.type).toBe("div");
expect((element.props as Record<string, unknown>).id).toBe("test");
expect((element.props as Record<string, unknown>).key).toBe("key");
expect((element.props as Record<string, unknown>)["id"]).toBe("test");
expect((element.props as Record<string, unknown>)["key"]).toBe("key");

// Test that jsxDEV creates similar structure
expect(elementWithSource.type).toBe("div");
expect(
(elementWithSource as unknown as Record<string, unknown>).__source,
(elementWithSource as unknown as Record<string, unknown>)["__source"],
).toEqual(source);
});

Expand Down Expand Up @@ -133,10 +126,10 @@ describe("JSX Fragment Support", () => {
render(fragmentElement, container);

expect(container.children.length).toBe(2);
expect(container.children[0].tagName).toBe("SPAN");
expect(container.children[0].textContent).toBe("Hello");
expect(container.children[1].tagName).toBe("SPAN");
expect(container.children[1].textContent).toBe("World");
expect(container.children[0]!.tagName).toBe("SPAN");
expect(container.children[0]!.textContent).toBe("Hello");
expect(container.children[1]!.tagName).toBe("SPAN");
expect(container.children[1]!.textContent).toBe("World");
});

test("Fragment with single child", () => {
Expand All @@ -147,8 +140,8 @@ describe("JSX Fragment Support", () => {
render(fragmentElement, container);

expect(container.children.length).toBe(1);
expect(container.children[0].tagName).toBe("DIV");
expect(container.children[0].textContent).toBe("Single child");
expect(container.children[0]!.tagName).toBe("DIV");
expect(container.children[0]!.textContent).toBe("Single child");
});

test("Fragment with no children", () => {
Expand All @@ -168,9 +161,9 @@ describe("JSX Fragment Support", () => {
render(fragmentElement, container);

expect(container.childNodes.length).toBe(3);
expect(container.childNodes[0].textContent).toBe("Text node");
expect(container.childNodes[1].textContent).toBe("Element");
expect(container.childNodes[2].textContent).toBe("42");
expect(container.childNodes[0]!.textContent).toBe("Text node");
expect(container.childNodes[1]!.textContent).toBe("Element");
expect(container.childNodes[2]!.textContent).toBe("42");
});
});

Expand All @@ -185,8 +178,8 @@ describe("JSX with Functional Components", () => {
render(element, container);

expect(container.children.length).toBe(1);
expect(container.children[0].tagName).toBe("H1");
expect(container.children[0].textContent).toBe("Hello, JSX!");
expect(container.children[0]!.tagName).toBe("H1");
expect(container.children[0]!.textContent).toBe("Hello, JSX!");
});

test("jsx() with component children", () => {
Expand All @@ -201,8 +194,8 @@ describe("JSX with Functional Components", () => {
render(jsx(App, null), container);

expect(container.children.length).toBe(1);
expect(container.children[0].tagName).toBe("BUTTON");
expect(container.children[0].textContent).toBe("Click me");
expect(container.children[0]!.tagName).toBe("BUTTON");
expect(container.children[0]!.textContent).toBe("Click me");
});

test("jsx() with nested components", () => {
Expand All @@ -228,14 +221,14 @@ describe("JSX with Functional Components", () => {

render(app, container);

const card = container.children[0] as HTMLElement;
const card = container.children[0]! as HTMLElement;
expect(card.className).toBe("card");
expect(card.children.length).toBe(2);
expect(card.children[0].tagName).toBe("H2");
expect(card.children[0].textContent).toBe("My Card");
expect(card.children[1].className).toBe("content");
expect(card.children[1].children[0].tagName).toBe("P");
expect(card.children[1].children[0].textContent).toBe("Card content");
expect(card.children[0]!.tagName).toBe("H2");
expect(card.children[0]!.textContent).toBe("My Card");
expect(card.children[1]!.className).toBe("content");
expect(card.children[1]!.children[0]!.tagName).toBe("P");
expect(card.children[1]!.children[0]!.textContent).toBe("Card content");
});
});

Expand Down Expand Up @@ -291,10 +284,10 @@ describe("JSX with Hooks", () => {

render(jsx(MultiState, null), container);

const nameP = container.children[0].children[0] as HTMLElement;
const ageP = container.children[0].children[1] as HTMLElement;
const nameButton = container.children[0].children[2] as HTMLElement;
const ageButton = container.children[0].children[3] as HTMLElement;
const nameP = container.children[0]!.children[0]! as HTMLElement;
const ageP = container.children[0]!.children[1]! as HTMLElement;
const nameButton = container.children[0]!.children[2]! as HTMLElement;
const ageButton = container.children[0]!.children[3]! as HTMLElement;

expect(nameP.textContent).toBe("Name: Anonymous");
expect(ageP.textContent).toBe("Age: 0");
Expand Down Expand Up @@ -368,7 +361,7 @@ describe("JSX Error Handling", () => {
render(element, container);

expect(container.children.length).toBe(1);
expect(container.children[0].textContent).toBe("text");
expect(container.children[0]!.textContent).toBe("text");
});

test("jsx() handles empty children array", () => {
Expand All @@ -377,7 +370,7 @@ describe("JSX Error Handling", () => {
render(element, container);

expect(container.children.length).toBe(1);
expect(container.children[0].children.length).toBe(0);
expect(container.children[0]!.children.length).toBe(0);
});

test("jsx() handles component returning null", () => {
Expand All @@ -402,9 +395,9 @@ describe("JSX Performance and Edge Cases", () => {
render(element, container);

expect(container.children.length).toBe(1);
expect(container.children[0].children.length).toBe(100);
expect(container.children[0].children[0].textContent).toBe("Item 0");
expect(container.children[0].children[99].textContent).toBe("Item 99");
expect(container.children[0]!.children.length).toBe(100);
expect(container.children[0]!.children[0]!.textContent).toBe("Item 0");
expect(container.children[0]!.children[99]!.textContent).toBe("Item 99");
});

test("jsx() maintains referential equality for same inputs", () => {
Expand All @@ -415,8 +408,8 @@ describe("JSX Performance and Edge Cases", () => {
// Elements should have the same structure but be different objects
expect(element1).not.toBe(element2);
expect(element1.type).toBe(element2.type);
expect((element1.props as Record<string, unknown>).id).toBe(
(element2.props as Record<string, unknown>).id,
expect((element1.props as Record<string, unknown>)["id"]).toBe(
(element2.props as Record<string, unknown>)["id"],
);
});

Expand All @@ -425,9 +418,9 @@ describe("JSX Performance and Edge Cases", () => {
const element = jsxDEV("div", { id: "test" }, "key", true, source, {});

expect(element.type).toBe("div");
expect((element.props as Record<string, unknown>).id).toBe("test");
expect((element.props as Record<string, unknown>).key).toBe("key");
expect((element as unknown as Record<string, unknown>).__source).toEqual(
expect((element.props as Record<string, unknown>)["id"]).toBe("test");
expect((element.props as Record<string, unknown>)["key"]).toBe("key");
expect((element as unknown as Record<string, unknown>)["__source"]).toEqual(
source,
);
});
Expand Down
2 changes: 1 addition & 1 deletion tests/MiniReact.memo.test.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { beforeEach, describe, expect, test } from "bun:test";
import { createElement, memo, render, useState } from "../src/MiniReact";
import { createElement, memo, render, useState } from "@/MiniReact";

describe("MiniReact.memo Component Memoization", () => {
let container: HTMLElement;
Expand Down
2 changes: 1 addition & 1 deletion tests/MiniReact.performance.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import {
startProfiling,
stopProfiling,
useState,
} from "../src/MiniReact";
} from "@/MiniReact";

describe("MiniReact.Performance Tools", () => {
let container: HTMLElement;
Expand Down
2 changes: 1 addition & 1 deletion tests/MiniReact.portals.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import {
useContext,
useEffect,
useState,
} from "../src/MiniReact";
} from "@/MiniReact";

describe("MiniReact Portal Tests", () => {
let container: HTMLElement;
Expand Down
Loading
Loading