|
| 1 | +import { describe, it, expect, vi, beforeEach } from "vitest"; |
| 2 | +import { UrlChangeEvent } from "./navigation_handle.js"; |
| 3 | + |
| 4 | +// attachNavigateHandler 使用模块级 attached 单例,需要在每个测试前重置模块 |
| 5 | +const importFresh = async () => { |
| 6 | + vi.resetModules(); |
| 7 | + return await import("./navigation_handle.js"); |
| 8 | +}; |
| 9 | + |
| 10 | +describe("UrlChangeEvent", () => { |
| 11 | + it.concurrent("应包含 url 属性", () => { |
| 12 | + const ev = new UrlChangeEvent("urlchange", "https://example.com/new"); |
| 13 | + expect(ev.type).toBe("urlchange"); |
| 14 | + expect(ev.url).toBe("https://example.com/new"); |
| 15 | + expect(ev).toBeInstanceOf(Event); |
| 16 | + }); |
| 17 | +}); |
| 18 | + |
| 19 | +describe("attachNavigateHandler", () => { |
| 20 | + // 创建一个模拟的 window 对象,location.href 需要通过 getter 提供 |
| 21 | + // 因为 getPropGetter 会遍历原型链查找 PropertyDescriptor |
| 22 | + const createMockWin = (href = "https://example.com/") => { |
| 23 | + const listeners: Record<string, EventListener[]> = {}; |
| 24 | + const dispatched: Event[] = []; |
| 25 | + let currentHref = href; |
| 26 | + const location = Object.create(null); |
| 27 | + Object.defineProperty(location, "href", { |
| 28 | + get: () => currentHref, |
| 29 | + set: (v: string) => { |
| 30 | + currentHref = v; |
| 31 | + }, |
| 32 | + configurable: true, |
| 33 | + enumerable: true, |
| 34 | + }); |
| 35 | + return { |
| 36 | + win: { |
| 37 | + location, |
| 38 | + navigation: { |
| 39 | + addEventListener: vi.fn((type: string, handler: EventListener) => { |
| 40 | + (listeners[type] ||= []).push(handler); |
| 41 | + }), |
| 42 | + }, |
| 43 | + dispatchEvent: vi.fn((ev: Event) => dispatched.push(ev)), |
| 44 | + addEventListener: vi.fn(), |
| 45 | + } as any, |
| 46 | + listeners, |
| 47 | + dispatched, |
| 48 | + // 模拟触发 navigate 事件 |
| 49 | + fireNavigate(destUrl: string) { |
| 50 | + // 更新 location.href 模拟浏览器行为 |
| 51 | + currentHref = destUrl; |
| 52 | + const ev = { type: "navigate", destination: { url: destUrl } } as any; |
| 53 | + for (const fn of listeners["navigate"] || []) { |
| 54 | + fn(ev); |
| 55 | + } |
| 56 | + }, |
| 57 | + }; |
| 58 | + }; |
| 59 | + |
| 60 | + beforeEach(() => { |
| 61 | + vi.restoreAllMocks(); |
| 62 | + }); |
| 63 | + |
| 64 | + it("不支持 Navigation API 时不应注册监听器", async () => { |
| 65 | + const { attachNavigateHandler } = await importFresh(); |
| 66 | + const win = { location: { href: "https://example.com/" } } as any; |
| 67 | + attachNavigateHandler(win); |
| 68 | + // 没有 navigation 属性,不应报错也不应标记为 attached |
| 69 | + // 再次调用带 navigation 的 win 应该能正常注册 |
| 70 | + const mock = createMockWin(); |
| 71 | + attachNavigateHandler(mock.win); |
| 72 | + expect(mock.win.navigation.addEventListener).toHaveBeenCalledWith("navigate", expect.any(Function), false); |
| 73 | + }); |
| 74 | + |
| 75 | + it("应在 win.navigation 上注册 navigate 监听器", async () => { |
| 76 | + const { attachNavigateHandler } = await importFresh(); |
| 77 | + const mock = createMockWin(); |
| 78 | + attachNavigateHandler(mock.win); |
| 79 | + expect(mock.win.navigation.addEventListener).toHaveBeenCalledTimes(1); |
| 80 | + expect(mock.win.navigation.addEventListener).toHaveBeenCalledWith("navigate", expect.any(Function), false); |
| 81 | + }); |
| 82 | + |
| 83 | + it("多次调用只注册一次", async () => { |
| 84 | + const { attachNavigateHandler } = await importFresh(); |
| 85 | + const mock = createMockWin(); |
| 86 | + attachNavigateHandler(mock.win); |
| 87 | + attachNavigateHandler(mock.win); |
| 88 | + attachNavigateHandler(mock.win); |
| 89 | + expect(mock.win.navigation.addEventListener).toHaveBeenCalledTimes(1); |
| 90 | + }); |
| 91 | + |
| 92 | + it("URL 变化时应派发 urlchange 事件", async () => { |
| 93 | + const { attachNavigateHandler } = await importFresh(); |
| 94 | + const mock = createMockWin("https://example.com/"); |
| 95 | + attachNavigateHandler(mock.win); |
| 96 | + mock.fireNavigate("https://example.com/new"); |
| 97 | + // handler 是 async,等待 microtask 完成 |
| 98 | + await vi.waitFor(() => { |
| 99 | + expect(mock.dispatched.length).toBe(1); |
| 100 | + }); |
| 101 | + const ev = mock.dispatched[0] as UrlChangeEvent; |
| 102 | + expect(ev.type).toBe("urlchange"); |
| 103 | + expect(ev.url).toBe("https://example.com/new"); |
| 104 | + }); |
| 105 | + |
| 106 | + it("URL 未变化时不应派发事件", async () => { |
| 107 | + const { attachNavigateHandler } = await importFresh(); |
| 108 | + const mock = createMockWin("https://example.com/"); |
| 109 | + attachNavigateHandler(mock.win); |
| 110 | + // destination.url 与当前 href 相同 |
| 111 | + mock.fireNavigate("https://example.com/"); |
| 112 | + await new Promise((r) => setTimeout(r, 50)); |
| 113 | + expect(mock.dispatched.length).toBe(0); |
| 114 | + }); |
| 115 | +}); |
0 commit comments