Skip to main content
Glama
browser-apis.test.ts5.73 kB
import { describe, it, expect, beforeEach, afterEach, vi } from 'vitest'; import { BrowserUtils } from './dom-utils'; /** * @vitest-environment jsdom */ describe('Browser APIs - Browser Environment', () => { beforeEach(() => { // Clear localStorage before each test localStorage.clear(); // Reset window properties Object.defineProperty(window, 'innerWidth', { value: 1024, writable: true }); Object.defineProperty(window, 'innerHeight', { value: 768, writable: true }); }); afterEach(() => { localStorage.clear(); }); describe('Window APIs', () => { it('should get window size', () => { const size = BrowserUtils.getWindowSize(); expect(size.width).toBe(1024); expect(size.height).toBe(768); }); it('should handle window resize', () => { // Initial size let size = BrowserUtils.getWindowSize(); expect(size.width).toBe(1024); expect(size.height).toBe(768); // Trigger resize BrowserUtils.triggerResize(800, 600); size = BrowserUtils.getWindowSize(); expect(size.width).toBe(800); expect(size.height).toBe(600); }); it('should handle multiple resize events', () => { const resizeHandler = vi.fn(); window.addEventListener('resize', resizeHandler); BrowserUtils.triggerResize(1200, 900); BrowserUtils.triggerResize(600, 400); BrowserUtils.triggerResize(1920, 1080); expect(resizeHandler).toHaveBeenCalledTimes(3); const finalSize = BrowserUtils.getWindowSize(); expect(finalSize.width).toBe(1920); expect(finalSize.height).toBe(1080); window.removeEventListener('resize', resizeHandler); }); }); describe('Location APIs', () => { it('should get current URL', () => { // jsdom sets a default URL const url = BrowserUtils.getCurrentUrl(); expect(url).toBe('http://localhost:3000/'); }); it('should handle URL changes', () => { // Mock location change Object.defineProperty(window, 'location', { value: { href: 'https://example.com/test' }, writable: true }); const url = BrowserUtils.getCurrentUrl(); expect(url).toBe('https://example.com/test'); }); }); describe('LocalStorage APIs', () => { it('should set and get localStorage values', () => { BrowserUtils.setLocalStorage('testKey', 'testValue'); const value = BrowserUtils.getLocalStorage('testKey'); expect(value).toBe('testValue'); }); it('should return null for non-existent keys', () => { const value = BrowserUtils.getLocalStorage('nonExistentKey'); expect(value).toBeNull(); }); it('should handle multiple localStorage operations', () => { BrowserUtils.setLocalStorage('key1', 'value1'); BrowserUtils.setLocalStorage('key2', 'value2'); BrowserUtils.setLocalStorage('key3', 'value3'); expect(BrowserUtils.getLocalStorage('key1')).toBe('value1'); expect(BrowserUtils.getLocalStorage('key2')).toBe('value2'); expect(BrowserUtils.getLocalStorage('key3')).toBe('value3'); }); it('should clear all localStorage', () => { BrowserUtils.setLocalStorage('key1', 'value1'); BrowserUtils.setLocalStorage('key2', 'value2'); // Verify items exist expect(BrowserUtils.getLocalStorage('key1')).toBe('value1'); expect(BrowserUtils.getLocalStorage('key2')).toBe('value2'); // Clear storage BrowserUtils.clearLocalStorage(); // Verify items are gone expect(BrowserUtils.getLocalStorage('key1')).toBeNull(); expect(BrowserUtils.getLocalStorage('key2')).toBeNull(); }); it('should handle localStorage with JSON data', () => { const testObject = { name: 'John', age: 30, active: true }; const jsonString = JSON.stringify(testObject); BrowserUtils.setLocalStorage('userObject', jsonString); const retrieved = BrowserUtils.getLocalStorage('userObject'); expect(retrieved).toBe(jsonString); const parsedObject = JSON.parse(retrieved!); expect(parsedObject).toEqual(testObject); }); }); describe('Event handling', () => { it('should handle custom events', () => { const eventHandler = vi.fn(); const customEvent = new CustomEvent('testEvent', { detail: { message: 'Hello World' } }); document.addEventListener('testEvent', eventHandler); document.dispatchEvent(customEvent); expect(eventHandler).toHaveBeenCalledOnce(); expect(eventHandler).toHaveBeenCalledWith(customEvent); document.removeEventListener('testEvent', eventHandler); }); it('should handle keyboard events', () => { const keyHandler = vi.fn(); document.addEventListener('keydown', keyHandler); const keyEvent = new KeyboardEvent('keydown', { key: 'Enter', code: 'Enter', keyCode: 13 }); document.dispatchEvent(keyEvent); expect(keyHandler).toHaveBeenCalledOnce(); expect(keyHandler).toHaveBeenCalledWith(keyEvent); document.removeEventListener('keydown', keyHandler); }); it('should handle mouse events', () => { const clickHandler = vi.fn(); const button = document.createElement('button'); button.addEventListener('click', clickHandler); const clickEvent = new MouseEvent('click', { bubbles: true, cancelable: true, clientX: 100, clientY: 200 }); button.dispatchEvent(clickEvent); expect(clickHandler).toHaveBeenCalledOnce(); expect(clickHandler).toHaveBeenCalledWith(clickEvent); }); }); });

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/djankies/vitest-mcp'

If you have feedback or need assistance with the MCP directory API, please join our Discord server