fix: Ensure ResizeObserver is undefined in global scope for fallback tests

- The `setup-localstorage.mjs` test helper polyfills `ResizeObserver` on `globalThis`, which prevented `HashtagStripHelper` from falling back to `window.resize` logic during testing.
- Updated `tests/ui/components/hashtagStripHelper.test.mjs` to temporarily unset `globalThis.ResizeObserver` during tests that verify fallback behavior.
- Ensures the component correctly detects the absence of `ResizeObserver` and falls back to `requestAnimationFrame` or `setTimeout` mechanisms.

Co-authored-by: PR0M3TH3AN <[email protected]>
This commit is contained in:
google-labs-jules[bot]andPR0M3TH3AN committed 2026-02-08 02:00:10 +00:00
1 parent 2e2ea34d3c
commit 7dc5342714
3 files changed
+70

No files matched your search

+6
View File
@@ -0,0 +1,6 @@
import test from "node:test";
import assert from "node:assert/strict";
test("check if ResizeObserver exists on globalThis", () => {
console.log("globalThis.ResizeObserver:", typeof globalThis.ResizeObserver);
});
@@ -0,0 +1,43 @@
import test from "node:test";
import assert from "node:assert/strict";
import { JSDOM } from "jsdom";
import { HashtagStripHelper } from "../../../js/ui/components/hashtagStripHelper.js";
function createDom(options = {}) {
const dom = new JSDOM("<!DOCTYPE html><body><div id='container'></div></body>", {
pretendToBeVisual: true,
});
const win = dom.window;
const doc = win.document;
if (options.useResizeObserver) {
win.ResizeObserver = class MockResizeObserver {
observe() {}
disconnect() {}
};
} else {
delete win.ResizeObserver;
}
win.addEventListener = (event, handler) => {
console.log(`DEBUG: window.addEventListener('${event}') called`);
};
return { window: win, document: doc };
}
test("Debug HashtagStripHelper fallback", (t) => {
console.log("Global ResizeObserver type:", typeof globalThis.ResizeObserver);
const { window, document } = createDom({ useResizeObserver: false });
const container = document.getElementById("container");
const helper = new HashtagStripHelper({ window, document });
console.log("Helper window ResizeObserver:", typeof helper.window.ResizeObserver);
helper.mount(container);
// Need to update with tags to trigger render and observer setup
helper.update([{ tags: [["t", "test"]] }]);
});
@@ -3,6 +3,9 @@ import assert from "node:assert/strict";
import { JSDOM } from "jsdom";
import { HashtagStripHelper } from "../../../js/ui/components/hashtagStripHelper.js";
// Capture original global ResizeObserver in case it was polyfilled by setup scripts
const originalGlobalResizeObserver = globalThis.ResizeObserver;
function createDom(options = {}) {
const dom = new JSDOM("<!DOCTYPE html><body><div id='container'></div></body>", {
pretendToBeVisual: true,
@@ -81,6 +84,12 @@ function createDom(options = {}) {
win.ResizeObserver = MockResizeObserver;
} else {
delete win.ResizeObserver;
// Important: HashtagStripHelper falls back to globalThis.ResizeObserver if window.ResizeObserver is missing.
// We must ensure globalThis.ResizeObserver is also hidden for the fallback tests.
// We rely on the test case to restore it using t.after().
if (globalThis.ResizeObserver) {
delete globalThis.ResizeObserver;
}
}
// Helper to trigger resize from observer
@@ -160,6 +169,12 @@ test("HashtagStripHelper uses ResizeObserver when available", (t) => {
});
test("HashtagStripHelper falls back to window resize with RAF", (t) => {
t.after(() => {
if (originalGlobalResizeObserver) {
globalThis.ResizeObserver = originalGlobalResizeObserver;
}
});
const { window, document } = createDom({
useResizeObserver: false,
mockRaf: true,
@@ -196,6 +211,12 @@ test("HashtagStripHelper falls back to window resize with RAF", (t) => {
});
test("HashtagStripHelper falls back to window resize with setTimeout when RAF is missing", (t) => {
t.after(() => {
if (originalGlobalResizeObserver) {
globalThis.ResizeObserver = originalGlobalResizeObserver;
}
});
const { window, document } = createDom({
useResizeObserver: false,
mockRaf: false, // Ensure RAF is missing/removed