mtrl-addons 0.2.2 → 0.2.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/{src/components/index.ts → dist/components/index.d.ts} +0 -2
- package/dist/components/vlist/config.d.ts +86 -0
- package/{src/components/vlist/constants.ts → dist/components/vlist/constants.d.ts} +10 -11
- package/dist/components/vlist/features/api.d.ts +7 -0
- package/{src/components/vlist/features/index.ts → dist/components/vlist/features/index.d.ts} +0 -2
- package/dist/components/vlist/features/selection.d.ts +6 -0
- package/dist/components/vlist/features/viewport.d.ts +9 -0
- package/dist/components/vlist/features.d.ts +31 -0
- package/{src/components/vlist/index.ts → dist/components/vlist/index.d.ts} +1 -10
- package/dist/components/vlist/types.d.ts +596 -0
- package/dist/components/vlist/vlist.d.ts +29 -0
- package/dist/core/compose/features/gestures/index.d.ts +86 -0
- package/dist/core/compose/features/gestures/longpress.d.ts +85 -0
- package/dist/core/compose/features/gestures/pan.d.ts +108 -0
- package/dist/core/compose/features/gestures/pinch.d.ts +111 -0
- package/dist/core/compose/features/gestures/rotate.d.ts +111 -0
- package/dist/core/compose/features/gestures/swipe.d.ts +149 -0
- package/dist/core/compose/features/gestures/tap.d.ts +79 -0
- package/{src/core/compose/features/index.ts → dist/core/compose/features/index.d.ts} +1 -2
- package/{src/core/compose/index.ts → dist/core/compose/index.d.ts} +2 -11
- package/{src/core/gestures/index.ts → dist/core/gestures/index.d.ts} +1 -20
- package/dist/core/gestures/longpress.d.ts +23 -0
- package/dist/core/gestures/manager.d.ts +14 -0
- package/dist/core/gestures/pan.d.ts +12 -0
- package/dist/core/gestures/pinch.d.ts +14 -0
- package/dist/core/gestures/rotate.d.ts +14 -0
- package/dist/core/gestures/swipe.d.ts +20 -0
- package/dist/core/gestures/tap.d.ts +12 -0
- package/dist/core/gestures/types.d.ts +320 -0
- package/dist/core/gestures/utils.d.ts +57 -0
- package/dist/core/index.d.ts +13 -0
- package/dist/core/layout/config.d.ts +33 -0
- package/dist/core/layout/index.d.ts +51 -0
- package/dist/core/layout/jsx.d.ts +65 -0
- package/dist/core/layout/schema.d.ts +112 -0
- package/dist/core/layout/types.d.ts +69 -0
- package/dist/core/viewport/constants.d.ts +105 -0
- package/dist/core/viewport/features/base.d.ts +14 -0
- package/dist/core/viewport/features/collection.d.ts +41 -0
- package/dist/core/viewport/features/events.d.ts +13 -0
- package/{src/core/viewport/features/index.ts → dist/core/viewport/features/index.d.ts} +0 -7
- package/dist/core/viewport/features/item-size.d.ts +30 -0
- package/dist/core/viewport/features/loading.d.ts +34 -0
- package/dist/core/viewport/features/momentum.d.ts +17 -0
- package/dist/core/viewport/features/performance.d.ts +53 -0
- package/dist/core/viewport/features/placeholders.d.ts +38 -0
- package/dist/core/viewport/features/rendering.d.ts +16 -0
- package/dist/core/viewport/features/scrollbar.d.ts +26 -0
- package/dist/core/viewport/features/scrolling.d.ts +16 -0
- package/dist/core/viewport/features/utils.d.ts +43 -0
- package/dist/core/viewport/features/virtual.d.ts +18 -0
- package/{src/core/viewport/index.ts → dist/core/viewport/index.d.ts} +1 -17
- package/dist/core/viewport/types.d.ts +96 -0
- package/dist/core/viewport/utils/speed-tracker.d.ts +22 -0
- package/dist/core/viewport/viewport.d.ts +11 -0
- package/{src/index.ts → dist/index.d.ts} +0 -4
- package/dist/index.js +5143 -0
- package/dist/index.mjs +5111 -0
- package/dist/styles.css +254 -0
- package/dist/styles.css.map +1 -0
- package/package.json +16 -2
- package/.cursorrules +0 -117
- package/AI.md +0 -39
- package/CLAUDE.md +0 -882
- package/build.js +0 -377
- package/index.ts +0 -7
- package/scripts/analyze-orphaned-functions.ts +0 -387
- package/scripts/debug/vlist-selection.ts +0 -121
- package/src/components/vlist/config.ts +0 -323
- package/src/components/vlist/features/api.ts +0 -626
- package/src/components/vlist/features/selection.ts +0 -436
- package/src/components/vlist/features/viewport.ts +0 -59
- package/src/components/vlist/features.ts +0 -112
- package/src/components/vlist/types.ts +0 -723
- package/src/components/vlist/vlist.ts +0 -92
- package/src/core/compose/features/gestures/index.ts +0 -227
- package/src/core/compose/features/gestures/longpress.ts +0 -383
- package/src/core/compose/features/gestures/pan.ts +0 -424
- package/src/core/compose/features/gestures/pinch.ts +0 -475
- package/src/core/compose/features/gestures/rotate.ts +0 -485
- package/src/core/compose/features/gestures/swipe.ts +0 -492
- package/src/core/compose/features/gestures/tap.ts +0 -334
- package/src/core/gestures/longpress.ts +0 -68
- package/src/core/gestures/manager.ts +0 -418
- package/src/core/gestures/pan.ts +0 -48
- package/src/core/gestures/pinch.ts +0 -58
- package/src/core/gestures/rotate.ts +0 -58
- package/src/core/gestures/swipe.ts +0 -66
- package/src/core/gestures/tap.ts +0 -45
- package/src/core/gestures/types.ts +0 -387
- package/src/core/gestures/utils.ts +0 -128
- package/src/core/index.ts +0 -43
- package/src/core/layout/config.ts +0 -102
- package/src/core/layout/index.ts +0 -168
- package/src/core/layout/jsx.ts +0 -174
- package/src/core/layout/schema.ts +0 -1044
- package/src/core/layout/types.ts +0 -95
- package/src/core/viewport/constants.ts +0 -145
- package/src/core/viewport/features/base.ts +0 -73
- package/src/core/viewport/features/collection.ts +0 -1182
- package/src/core/viewport/features/events.ts +0 -130
- package/src/core/viewport/features/item-size.ts +0 -271
- package/src/core/viewport/features/loading.ts +0 -263
- package/src/core/viewport/features/momentum.ts +0 -269
- package/src/core/viewport/features/performance.ts +0 -161
- package/src/core/viewport/features/placeholders.ts +0 -335
- package/src/core/viewport/features/rendering.ts +0 -962
- package/src/core/viewport/features/scrollbar.ts +0 -434
- package/src/core/viewport/features/scrolling.ts +0 -634
- package/src/core/viewport/features/utils.ts +0 -94
- package/src/core/viewport/features/virtual.ts +0 -525
- package/src/core/viewport/types.ts +0 -133
- package/src/core/viewport/utils/speed-tracker.ts +0 -79
- package/src/core/viewport/viewport.ts +0 -265
- package/test/benchmarks/layout/advanced.test.ts +0 -656
- package/test/benchmarks/layout/comparison.test.ts +0 -519
- package/test/benchmarks/layout/performance-comparison.test.ts +0 -274
- package/test/benchmarks/layout/real-components.test.ts +0 -733
- package/test/benchmarks/layout/simple.test.ts +0 -321
- package/test/benchmarks/layout/stress.test.ts +0 -990
- package/test/collection/basic.test.ts +0 -304
- package/test/components/vlist-selection.test.ts +0 -240
- package/test/components/vlist.test.ts +0 -63
- package/test/core/collection/adapter.test.ts +0 -161
- package/test/core/collection/collection.test.ts +0 -394
- package/test/core/layout/layout.test.ts +0 -201
- package/test/utils/dom-helpers.ts +0 -275
- package/test/utils/performance-helpers.ts +0 -392
- package/tsconfig.json +0 -20
|
@@ -1,201 +0,0 @@
|
|
|
1
|
-
// test/core/layout/layout.test.ts
|
|
2
|
-
import { describe, test, expect, beforeAll, afterAll } from "bun:test";
|
|
3
|
-
import { JSDOM } from "jsdom";
|
|
4
|
-
|
|
5
|
-
// Setup for DOM testing environment
|
|
6
|
-
let dom: JSDOM;
|
|
7
|
-
let window: Window;
|
|
8
|
-
let document: Document;
|
|
9
|
-
let originalGlobalDocument: any;
|
|
10
|
-
let originalGlobalWindow: any;
|
|
11
|
-
|
|
12
|
-
beforeAll(() => {
|
|
13
|
-
// Create JSDOM instance
|
|
14
|
-
dom = new JSDOM("<!DOCTYPE html><html><body></body></html>", {
|
|
15
|
-
url: "http://localhost/",
|
|
16
|
-
pretendToBeVisual: true,
|
|
17
|
-
resources: "usable",
|
|
18
|
-
});
|
|
19
|
-
|
|
20
|
-
window = dom.window as any;
|
|
21
|
-
document = window.document;
|
|
22
|
-
|
|
23
|
-
// Store original globals
|
|
24
|
-
originalGlobalDocument = global.document;
|
|
25
|
-
originalGlobalWindow = global.window;
|
|
26
|
-
|
|
27
|
-
// Set globals
|
|
28
|
-
global.document = document;
|
|
29
|
-
global.window = window as any;
|
|
30
|
-
global.Element = (window as any).Element;
|
|
31
|
-
global.HTMLElement = (window as any).HTMLElement;
|
|
32
|
-
global.DocumentFragment = (window as any).DocumentFragment;
|
|
33
|
-
|
|
34
|
-
// Add DOM APIs
|
|
35
|
-
global.getComputedStyle = () => ({
|
|
36
|
-
position: "static",
|
|
37
|
-
getPropertyValue: () => "",
|
|
38
|
-
});
|
|
39
|
-
});
|
|
40
|
-
|
|
41
|
-
afterAll(() => {
|
|
42
|
-
// Restore globals
|
|
43
|
-
global.document = originalGlobalDocument;
|
|
44
|
-
global.window = originalGlobalWindow;
|
|
45
|
-
window.close();
|
|
46
|
-
});
|
|
47
|
-
|
|
48
|
-
// Import after DOM setup
|
|
49
|
-
import {
|
|
50
|
-
createLayout,
|
|
51
|
-
layout,
|
|
52
|
-
grid,
|
|
53
|
-
row,
|
|
54
|
-
stack,
|
|
55
|
-
template,
|
|
56
|
-
performance,
|
|
57
|
-
type LayoutResult,
|
|
58
|
-
} from "../../../src/core/layout";
|
|
59
|
-
|
|
60
|
-
describe("Layout System", () => {
|
|
61
|
-
test("should create a basic layout", () => {
|
|
62
|
-
const result = createLayout(["div", { class: "test" }]);
|
|
63
|
-
|
|
64
|
-
expect(result).toBeDefined();
|
|
65
|
-
expect(result.element).toBeDefined();
|
|
66
|
-
expect(result.get).toBeDefined();
|
|
67
|
-
expect(result.getAll).toBeDefined();
|
|
68
|
-
expect(result.destroy).toBeDefined();
|
|
69
|
-
});
|
|
70
|
-
|
|
71
|
-
test("should create a stack layout", () => {
|
|
72
|
-
const result = stack({ gap: "2rem" });
|
|
73
|
-
|
|
74
|
-
expect(result).toBeDefined();
|
|
75
|
-
expect(result.element).toBeDefined();
|
|
76
|
-
});
|
|
77
|
-
|
|
78
|
-
test("should create a grid layout", () => {
|
|
79
|
-
const result = grid(3, { gap: "1rem" });
|
|
80
|
-
|
|
81
|
-
expect(result).toBeDefined();
|
|
82
|
-
expect(result.element).toBeDefined();
|
|
83
|
-
});
|
|
84
|
-
|
|
85
|
-
test("should create a row layout", () => {
|
|
86
|
-
const result = row({ gap: "1rem" });
|
|
87
|
-
|
|
88
|
-
expect(result).toBeDefined();
|
|
89
|
-
expect(result.element).toBeDefined();
|
|
90
|
-
});
|
|
91
|
-
|
|
92
|
-
test("should create a template layout", () => {
|
|
93
|
-
const templateFn = (props: Record<string, any>) => [
|
|
94
|
-
"div",
|
|
95
|
-
{ class: `template-${props.type}` },
|
|
96
|
-
];
|
|
97
|
-
|
|
98
|
-
const result = template(templateFn, { type: "test" });
|
|
99
|
-
|
|
100
|
-
expect(result).toBeDefined();
|
|
101
|
-
expect(result.element).toBeDefined();
|
|
102
|
-
});
|
|
103
|
-
|
|
104
|
-
test("should provide performance utilities", () => {
|
|
105
|
-
expect(performance.clearCache).toBeDefined();
|
|
106
|
-
expect(performance.clearFragmentPool).toBeDefined();
|
|
107
|
-
expect(performance.clearAll).toBeDefined();
|
|
108
|
-
expect(performance.getStats).toBeDefined();
|
|
109
|
-
|
|
110
|
-
// Should not throw
|
|
111
|
-
performance.clearAll();
|
|
112
|
-
const stats = performance.getStats();
|
|
113
|
-
expect(stats).toBeDefined();
|
|
114
|
-
});
|
|
115
|
-
|
|
116
|
-
test("should handle array schema", () => {
|
|
117
|
-
const result = createLayout([
|
|
118
|
-
"div",
|
|
119
|
-
"container",
|
|
120
|
-
{ class: "main" },
|
|
121
|
-
["span", "child", { textContent: "Hello" }],
|
|
122
|
-
]);
|
|
123
|
-
|
|
124
|
-
expect(result).toBeDefined();
|
|
125
|
-
expect(result.get("container")).toBeDefined();
|
|
126
|
-
expect(result.get("child")).toBeDefined();
|
|
127
|
-
});
|
|
128
|
-
|
|
129
|
-
test("should handle object schema", () => {
|
|
130
|
-
const result = createLayout({
|
|
131
|
-
element: {
|
|
132
|
-
creator: (opts: any) => {
|
|
133
|
-
const div = document.createElement("div");
|
|
134
|
-
if (opts.class) div.className = opts.class;
|
|
135
|
-
return div;
|
|
136
|
-
},
|
|
137
|
-
options: { class: "root" },
|
|
138
|
-
children: {
|
|
139
|
-
child: {
|
|
140
|
-
creator: (opts: any) => {
|
|
141
|
-
const span = document.createElement("span");
|
|
142
|
-
if (opts.textContent) span.textContent = opts.textContent;
|
|
143
|
-
return span;
|
|
144
|
-
},
|
|
145
|
-
options: { textContent: "Hello" },
|
|
146
|
-
},
|
|
147
|
-
},
|
|
148
|
-
},
|
|
149
|
-
});
|
|
150
|
-
|
|
151
|
-
expect(result).toBeDefined();
|
|
152
|
-
expect(result.get("child")).toBeDefined();
|
|
153
|
-
});
|
|
154
|
-
|
|
155
|
-
test("should handle layout destruction", () => {
|
|
156
|
-
const result = createLayout(["div", { class: "destroyable" }]);
|
|
157
|
-
|
|
158
|
-
expect(result.element).toBeDefined();
|
|
159
|
-
|
|
160
|
-
// Should not throw
|
|
161
|
-
result.destroy();
|
|
162
|
-
});
|
|
163
|
-
|
|
164
|
-
test("should handle named components", () => {
|
|
165
|
-
const result = createLayout([
|
|
166
|
-
"div",
|
|
167
|
-
"main",
|
|
168
|
-
{ class: "container" },
|
|
169
|
-
["span", "text", { textContent: "Content" }],
|
|
170
|
-
]);
|
|
171
|
-
|
|
172
|
-
expect(result.get("main")).toBeDefined();
|
|
173
|
-
expect(result.get("text")).toBeDefined();
|
|
174
|
-
expect(result.get("nonexistent")).toBeNull();
|
|
175
|
-
|
|
176
|
-
const all = result.getAll();
|
|
177
|
-
expect(all.main).toBeDefined();
|
|
178
|
-
expect(all.text).toBeDefined();
|
|
179
|
-
});
|
|
180
|
-
|
|
181
|
-
test("should handle layout configurations", () => {
|
|
182
|
-
const result = createLayout([
|
|
183
|
-
"div",
|
|
184
|
-
{
|
|
185
|
-
layout: {
|
|
186
|
-
type: "grid",
|
|
187
|
-
columns: 3,
|
|
188
|
-
gap: "1rem",
|
|
189
|
-
align: "center",
|
|
190
|
-
},
|
|
191
|
-
layoutItem: {
|
|
192
|
-
span: 2,
|
|
193
|
-
width: 6,
|
|
194
|
-
},
|
|
195
|
-
},
|
|
196
|
-
]);
|
|
197
|
-
|
|
198
|
-
expect(result).toBeDefined();
|
|
199
|
-
expect(result.element).toBeDefined();
|
|
200
|
-
});
|
|
201
|
-
});
|
|
@@ -1,275 +0,0 @@
|
|
|
1
|
-
// test/utils/dom-helpers.ts - DOM Testing Utilities
|
|
2
|
-
|
|
3
|
-
/**
|
|
4
|
-
* Creates a test container element with scrolling capabilities
|
|
5
|
-
* @param height - Height of the container (default: 400px)
|
|
6
|
-
* @param width - Width of the container (default: 100%)
|
|
7
|
-
* @returns HTMLElement configured for testing
|
|
8
|
-
*/
|
|
9
|
-
export function createContainer(height = "400px", width = "100%"): HTMLElement {
|
|
10
|
-
const container = document.createElement("div");
|
|
11
|
-
container.style.height = height;
|
|
12
|
-
container.style.width = width;
|
|
13
|
-
container.style.overflow = "auto";
|
|
14
|
-
container.style.position = "relative";
|
|
15
|
-
container.className = "test-container";
|
|
16
|
-
document.body.appendChild(container);
|
|
17
|
-
return container;
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
/**
|
|
21
|
-
* Cleans up a test container by removing it from DOM
|
|
22
|
-
* @param container - Container to cleanup
|
|
23
|
-
*/
|
|
24
|
-
export function cleanupContainer(container: HTMLElement): void {
|
|
25
|
-
if (container && container.parentNode) {
|
|
26
|
-
container.parentNode.removeChild(container);
|
|
27
|
-
}
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
/**
|
|
31
|
-
* Simulates a scroll event on an element
|
|
32
|
-
* @param element - Element to scroll
|
|
33
|
-
* @param scrollTop - Scroll position
|
|
34
|
-
* @param scrollLeft - Horizontal scroll position (optional)
|
|
35
|
-
*/
|
|
36
|
-
export function simulateScroll(
|
|
37
|
-
element: HTMLElement,
|
|
38
|
-
scrollTop: number,
|
|
39
|
-
scrollLeft: number = 0
|
|
40
|
-
): void {
|
|
41
|
-
element.scrollTop = scrollTop;
|
|
42
|
-
element.scrollLeft = scrollLeft;
|
|
43
|
-
|
|
44
|
-
const scrollEvent = new Event("scroll", {
|
|
45
|
-
bubbles: true,
|
|
46
|
-
cancelable: true,
|
|
47
|
-
});
|
|
48
|
-
|
|
49
|
-
element.dispatchEvent(scrollEvent);
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
/**
|
|
53
|
-
* Simulates a resize event on an element
|
|
54
|
-
* @param element - Element to resize
|
|
55
|
-
* @param width - New width
|
|
56
|
-
* @param height - New height
|
|
57
|
-
*/
|
|
58
|
-
export function simulateResize(
|
|
59
|
-
element: HTMLElement,
|
|
60
|
-
width: number,
|
|
61
|
-
height: number
|
|
62
|
-
): void {
|
|
63
|
-
element.style.width = `${width}px`;
|
|
64
|
-
element.style.height = `${height}px`;
|
|
65
|
-
|
|
66
|
-
const resizeEvent = new Event("resize", {
|
|
67
|
-
bubbles: true,
|
|
68
|
-
cancelable: true,
|
|
69
|
-
});
|
|
70
|
-
|
|
71
|
-
window.dispatchEvent(resizeEvent);
|
|
72
|
-
}
|
|
73
|
-
|
|
74
|
-
/**
|
|
75
|
-
* Waits for the next animation frame
|
|
76
|
-
* @returns Promise that resolves after requestAnimationFrame
|
|
77
|
-
*/
|
|
78
|
-
export function waitForAnimationFrame(): Promise<void> {
|
|
79
|
-
return new Promise((resolve) => {
|
|
80
|
-
requestAnimationFrame(() => resolve());
|
|
81
|
-
});
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
/**
|
|
85
|
-
* Waits for multiple animation frames
|
|
86
|
-
* @param count - Number of frames to wait
|
|
87
|
-
* @returns Promise that resolves after the specified frames
|
|
88
|
-
*/
|
|
89
|
-
export function waitForAnimationFrames(count: number): Promise<void> {
|
|
90
|
-
return new Promise((resolve) => {
|
|
91
|
-
let remaining = count;
|
|
92
|
-
|
|
93
|
-
function frame() {
|
|
94
|
-
remaining--;
|
|
95
|
-
if (remaining <= 0) {
|
|
96
|
-
resolve();
|
|
97
|
-
} else {
|
|
98
|
-
requestAnimationFrame(frame);
|
|
99
|
-
}
|
|
100
|
-
}
|
|
101
|
-
|
|
102
|
-
requestAnimationFrame(frame);
|
|
103
|
-
});
|
|
104
|
-
}
|
|
105
|
-
|
|
106
|
-
/**
|
|
107
|
-
* Waits for a specific amount of time
|
|
108
|
-
* @param ms - Milliseconds to wait
|
|
109
|
-
* @returns Promise that resolves after the timeout
|
|
110
|
-
*/
|
|
111
|
-
export function waitFor(ms: number): Promise<void> {
|
|
112
|
-
return new Promise((resolve) => setTimeout(resolve, ms));
|
|
113
|
-
}
|
|
114
|
-
|
|
115
|
-
/**
|
|
116
|
-
* Gets the computed style of an element
|
|
117
|
-
* @param element - Element to get style for
|
|
118
|
-
* @param property - CSS property to get
|
|
119
|
-
* @returns The computed style value
|
|
120
|
-
*/
|
|
121
|
-
export function getComputedStyleValue(
|
|
122
|
-
element: HTMLElement,
|
|
123
|
-
property: string
|
|
124
|
-
): string {
|
|
125
|
-
return window.getComputedStyle(element).getPropertyValue(property);
|
|
126
|
-
}
|
|
127
|
-
|
|
128
|
-
/**
|
|
129
|
-
* Checks if an element is visible in the viewport
|
|
130
|
-
* @param element - Element to check
|
|
131
|
-
* @param container - Container element (default: document.body)
|
|
132
|
-
* @returns Whether the element is visible
|
|
133
|
-
*/
|
|
134
|
-
export function isElementVisible(
|
|
135
|
-
element: HTMLElement,
|
|
136
|
-
container: HTMLElement = document.body
|
|
137
|
-
): boolean {
|
|
138
|
-
const rect = element.getBoundingClientRect();
|
|
139
|
-
const containerRect = container.getBoundingClientRect();
|
|
140
|
-
|
|
141
|
-
return (
|
|
142
|
-
rect.top >= containerRect.top &&
|
|
143
|
-
rect.left >= containerRect.left &&
|
|
144
|
-
rect.bottom <= containerRect.bottom &&
|
|
145
|
-
rect.right <= containerRect.right
|
|
146
|
-
);
|
|
147
|
-
}
|
|
148
|
-
|
|
149
|
-
/**
|
|
150
|
-
* Gets all elements within a visible range
|
|
151
|
-
* @param container - Container element
|
|
152
|
-
* @param selector - CSS selector for elements
|
|
153
|
-
* @returns Array of visible elements
|
|
154
|
-
*/
|
|
155
|
-
export function getVisibleElements(
|
|
156
|
-
container: HTMLElement,
|
|
157
|
-
selector: string = ".test-item"
|
|
158
|
-
): HTMLElement[] {
|
|
159
|
-
const elements = Array.from(
|
|
160
|
-
container.querySelectorAll(selector)
|
|
161
|
-
) as HTMLElement[];
|
|
162
|
-
return elements.filter((el) => isElementVisible(el, container));
|
|
163
|
-
}
|
|
164
|
-
|
|
165
|
-
/**
|
|
166
|
-
* Simulates a mouse event on an element
|
|
167
|
-
* @param element - Target element
|
|
168
|
-
* @param type - Event type (click, mousedown, etc.)
|
|
169
|
-
* @param options - Event options
|
|
170
|
-
*/
|
|
171
|
-
export function simulateMouseEvent(
|
|
172
|
-
element: HTMLElement,
|
|
173
|
-
type: string,
|
|
174
|
-
options: Partial<MouseEventInit> = {}
|
|
175
|
-
): void {
|
|
176
|
-
const event = new MouseEvent(type, {
|
|
177
|
-
bubbles: true,
|
|
178
|
-
cancelable: true,
|
|
179
|
-
...options,
|
|
180
|
-
});
|
|
181
|
-
|
|
182
|
-
element.dispatchEvent(event);
|
|
183
|
-
}
|
|
184
|
-
|
|
185
|
-
/**
|
|
186
|
-
* Simulates a touch event on an element
|
|
187
|
-
* @param element - Target element
|
|
188
|
-
* @param type - Event type (touchstart, touchmove, etc.)
|
|
189
|
-
* @param touches - Touch points
|
|
190
|
-
*/
|
|
191
|
-
export function simulateTouchEvent(
|
|
192
|
-
element: HTMLElement,
|
|
193
|
-
type: string,
|
|
194
|
-
touches: Touch[] = []
|
|
195
|
-
): void {
|
|
196
|
-
const event = new TouchEvent(type, {
|
|
197
|
-
bubbles: true,
|
|
198
|
-
cancelable: true,
|
|
199
|
-
touches,
|
|
200
|
-
});
|
|
201
|
-
|
|
202
|
-
element.dispatchEvent(event);
|
|
203
|
-
}
|
|
204
|
-
|
|
205
|
-
/**
|
|
206
|
-
* Creates a mock IntersectionObserver for testing
|
|
207
|
-
* @param callback - Callback function
|
|
208
|
-
* @returns Mock IntersectionObserver
|
|
209
|
-
*/
|
|
210
|
-
export function createMockIntersectionObserver(
|
|
211
|
-
callback: IntersectionObserverCallback
|
|
212
|
-
): any {
|
|
213
|
-
const observer = {
|
|
214
|
-
observe: () => {},
|
|
215
|
-
unobserve: () => {},
|
|
216
|
-
disconnect: () => {},
|
|
217
|
-
root: null,
|
|
218
|
-
rootMargin: "",
|
|
219
|
-
thresholds: [],
|
|
220
|
-
takeRecords: () => [],
|
|
221
|
-
};
|
|
222
|
-
|
|
223
|
-
// Store callback for manual triggering
|
|
224
|
-
(observer as any).callback = callback;
|
|
225
|
-
|
|
226
|
-
return observer;
|
|
227
|
-
}
|
|
228
|
-
|
|
229
|
-
/**
|
|
230
|
-
* Triggers intersection observer callback manually
|
|
231
|
-
* @param observer - Mock observer
|
|
232
|
-
* @param entries - Intersection entries
|
|
233
|
-
*/
|
|
234
|
-
export function triggerIntersectionObserver(
|
|
235
|
-
observer: any,
|
|
236
|
-
entries: IntersectionObserverEntry[]
|
|
237
|
-
): void {
|
|
238
|
-
if (observer.callback) {
|
|
239
|
-
observer.callback(entries, observer);
|
|
240
|
-
}
|
|
241
|
-
}
|
|
242
|
-
|
|
243
|
-
/**
|
|
244
|
-
* Creates a mock ResizeObserver for testing
|
|
245
|
-
* @param callback - Callback function
|
|
246
|
-
* @returns Mock ResizeObserver
|
|
247
|
-
*/
|
|
248
|
-
export function createMockResizeObserver(
|
|
249
|
-
callback: ResizeObserverCallback
|
|
250
|
-
): any {
|
|
251
|
-
const observer = {
|
|
252
|
-
observe: () => {},
|
|
253
|
-
unobserve: () => {},
|
|
254
|
-
disconnect: () => {},
|
|
255
|
-
};
|
|
256
|
-
|
|
257
|
-
// Store callback for manual triggering
|
|
258
|
-
(observer as any).callback = callback;
|
|
259
|
-
|
|
260
|
-
return observer;
|
|
261
|
-
}
|
|
262
|
-
|
|
263
|
-
/**
|
|
264
|
-
* Triggers resize observer callback manually
|
|
265
|
-
* @param observer - Mock observer
|
|
266
|
-
* @param entries - Resize entries
|
|
267
|
-
*/
|
|
268
|
-
export function triggerResizeObserver(
|
|
269
|
-
observer: any,
|
|
270
|
-
entries: ResizeObserverEntry[]
|
|
271
|
-
): void {
|
|
272
|
-
if (observer.callback) {
|
|
273
|
-
observer.callback(entries, observer);
|
|
274
|
-
}
|
|
275
|
-
}
|