fix(frontend/scroll): no callback for disconnected elements (#11714)

* fix(frontend/scroll): no callback for disconnected elements

* Update CHANGELOG.md

1 files changed, 64 insertions, 0 deletions

diff --git a/packages/frontend/test/scroll.test.ts b/packages/frontend/test/scroll.test.ts
new file mode 100644
index 0000000000..3fa740b11c
--- /dev/null
+++ b/packages/frontend/test/scroll.test.ts
@@ -0,0 +1,64 @@
+/*
+ * SPDX-FileCopyrightText: syuilo and other misskey contributors
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+import { describe, test, assert, afterEach } from 'vitest';
+import { Window } from 'happy-dom';
+import { onScrollBottom, onScrollTop } from '@/scripts/scroll';
+
+describe('Scroll', () => {
+	describe('onScrollTop', () => {
+		test('Initial onScrollTop callback for connected elements', () => {
+			const { document } = new Window();
+			const div = document.createElement('div');
+			assert.strictEqual(div.scrollTop, 0);
+
+			document.body.append(div);
+
+			let called = false;
+			onScrollTop(div as any as HTMLElement, () => called = true);
+
+			assert.ok(called);
+		});
+
+		test('No onScrollTop callback for disconnected elements', () => {
+			const { document } = new Window();
+			const div = document.createElement('div');
+			assert.strictEqual(div.scrollTop, 0);
+
+			let called = false;
+			onScrollTop(div as any as HTMLElement, () => called = true);
+
+			assert.ok(!called);
+		});
+	});
+
+	describe('onScrollBottom', () => {
+		test('Initial onScrollBottom callback for connected elements', () => {
+			const { document } = new Window();
+			const div = document.createElement('div');
+			assert.strictEqual(div.scrollTop, 0);
+			(div as any).scrollHeight = 100; // happy-dom has no scrollHeight
+
+			document.body.append(div);
+
+			let called = false;
+			onScrollBottom(div as any as HTMLElement, () => called = true);
+
+			assert.ok(called);
+		});
+
+		test('No onScrollBottom callback for disconnected elements', () => {
+			const { document } = new Window();
+			const div = document.createElement('div');
+			assert.strictEqual(div.scrollTop, 0);
+			(div as any).scrollHeight = 100; // happy-dom has no scrollHeight
+
+			let called = false;
+			onScrollBottom(div as any as HTMLElement, () => called = true);
+
+			assert.ok(!called);
+		});
+	});
+});