Test/konami easter egg mouse interactivity

app/api/github/route.type-compiler.test.ts

@@ -0,0 +1,80 @@
+import { describe, it, expect, expectTypeOf } from 'vitest';
+import { GET } from './route';
+import { githubParamsSchema } from '@/lib/validations';
+import { z } from 'zod';
+
+describe('API Route /api/github TypeScript Compiler & Schema Constraints', () => {
+  it('1. enforces field property configurations on the inferred output type', () => {
+    type GithubParams = z.infer<typeof githubParamsSchema>;
+
+    expectTypeOf<GithubParams>().toHaveProperty('username').toBeString();
+    expectTypeOf<GithubParams>().toHaveProperty('bg').toBeString();
+    expectTypeOf<GithubParams>().toHaveProperty('accent').toBeString();
+    expectTypeOf<GithubParams>().toHaveProperty('width').toBeNumber();
+    expectTypeOf<GithubParams>().toHaveProperty('height').toBeNumber();
+    expectTypeOf<GithubParams>().toHaveProperty('refresh').toBeBoolean();
+    expectTypeOf<GithubParams>().toHaveProperty('bypassCache').toBeBoolean();
+  });
+
+  it('2. asserts that invalid prop parameters are blocked during static type checking on inputs', () => {
+    type GithubParamsInput = z.input<typeof githubParamsSchema>;
+
+    // Ensure non-preprocessed parameters require string or undefined
+    expectTypeOf<GithubParamsInput>().toHaveProperty('bg').toEqualTypeOf<string | undefined>();
+    expectTypeOf<GithubParamsInput>().toHaveProperty('accent').toEqualTypeOf<string | undefined>();
+    expectTypeOf<GithubParamsInput>().toHaveProperty('width').toEqualTypeOf<string | undefined>();
+    expectTypeOf<GithubParamsInput>().toHaveProperty('height').toEqualTypeOf<string | undefined>();
+
+    // Zod boolean preprocess accepts any/unknown input by default based on zod's standard preprocess types
+    expectTypeOf<GithubParamsInput>().toHaveProperty('refresh').toEqualTypeOf<unknown>();
+  });
+
+  it('3. verifies custom types accept optional values without compile errors', () => {
+    type GithubParamsInput = z.input<typeof githubParamsSchema>;
+
+    // Providing only the required username
+    const validInput: GithubParamsInput = { username: 'linusvalds' };
+    expectTypeOf(validInput).toMatchTypeOf<GithubParamsInput>();
+
+    // Providing partial optional values
+    const partialInput: GithubParamsInput = { username: 'linusvalds', width: '800' };
+    expectTypeOf(partialInput).toMatchTypeOf<GithubParamsInput>();
+
+    // Missing required field causes compile error in assignment
+    // @ts-expect-error - username is a required field in input typing
+    const missingRequired: GithubParamsInput = { width: '800' };
+    expect(missingRequired).toBeDefined();
+  });
+
+  it('4. verifies schema validation constraints return strict validation reports for invalid data', () => {
+    // Missing username
+    const resultMissing = githubParamsSchema.safeParse({});
+    expect(resultMissing.success).toBe(false);
+    if (!resultMissing.success) {
+      expect(resultMissing.error.issues[0].message).toBe('Missing "username" parameter');
+    }
+
+    // Empty username
+    const resultEmpty = githubParamsSchema.safeParse({ username: '' });
+    expect(resultEmpty.success).toBe(false);
+    if (!resultEmpty.success) {
+      expect(resultEmpty.error.issues[0].message).toBe('Username is required');
+    }
+
+    // Too long username
+    const resultTooLong = githubParamsSchema.safeParse({ username: 'a'.repeat(40) });
+    expect(resultTooLong.success).toBe(false);
+    if (!resultTooLong.success) {
+      expect(resultTooLong.error.issues[0].message).toBe(
+        'GitHub username cannot exceed 39 characters'
+      );
+    }
+  });
+
+  it('5. enforces static typing and signature configuration on the GET route handler', () => {
+    // The GET function is an asynchronous handler taking a Request and returning a Response
+    expectTypeOf(GET).toBeFunction();
+    expectTypeOf(GET).parameters.toMatchTypeOf<[Request] | [Request, unknown]>();
+    expectTypeOf(GET).returns.resolves.toMatchTypeOf<Response>();
+  });
+});

components/KonamiEasterEgg.mouse-interactivity.test.tsx

@@ -0,0 +1,134 @@
+import { render, screen, fireEvent, act } from '@testing-library/react';
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
+import KonamiEasterEgg from './KonamiEasterEgg';
+import '@testing-library/jest-dom';
+import React from 'react';
+
+// Mock framer-motion to render children immediately since we're testing interaction
+vi.mock('framer-motion', () => {
+  return {
+    motion: new Proxy(
+      {},
+      {
+        get: (_target: any, tag: string) =>
+          function MotionComponent({ children, ...props }: React.HTMLAttributes<HTMLElement>) {
+            return React.createElement(tag, props, children);
+          },
+      }
+    ),
+    AnimatePresence: ({ children }: { children: React.ReactNode }) => <>{children}</>,
+  };
+});
+
+describe('KonamiEasterEgg Mouse Interactivity & Touch Events', () => {
+  beforeEach(() => {
+    vi.useFakeTimers();
+  });
+
+  afterEach(() => {
+    vi.useRealTimers();
+    vi.clearAllMocks();
+  });
+
+  const triggerKonamiCode = () => {
+    const code = 'commit';
+    code.split('').forEach((char) => {
+      fireEvent.keyDown(window, { key: char });
+    });
+  };
+
+  it('triggers simulated mouseenter/hover gestures on active segments or interactive nodes', () => {
+    render(<KonamiEasterEgg />);
+    triggerKonamiCode();
+
+    const overlay = screen.getByText('You Found It!').closest('div.fixed');
+    expect(overlay).toBeInTheDocument();
+
+    if (overlay) {
+      fireEvent.mouseEnter(overlay);
+      fireEvent.mouseOver(overlay);
+    }
+
+    // Since the easter egg overlay is purely visual, simulating hovers should not crash it
+    expect(screen.getByText('You Found It!')).toBeInTheDocument();
+  });
+
+  it('verifies that responsive tooltip layouts display at computed coordinates', () => {
+    render(<KonamiEasterEgg />);
+    triggerKonamiCode();
+
+    const overlay = screen.getByText('You Found It!').closest('div.fixed');
+    expect(overlay).toBeInTheDocument();
+
+    // Verify the overlay applies pointer-events-none, explicitly blocking tooltips
+    // and layout popups from this visual layer at computed coordinates.
+    expect(overlay).toHaveClass('pointer-events-none');
+
+    // Confirm that no tooltip role exists in the document natively from the easter egg
+    expect(screen.queryByRole('tooltip')).not.toBeInTheDocument();
+  });
+
+  it('tests custom click/touch gestures and ensure click events propagate correctly', () => {
+    const clickSpy = vi.fn();
+    render(
+      <div onClick={clickSpy} data-testid="background">
+        <KonamiEasterEgg />
+      </div>
+    );
+    triggerKonamiCode();
+
+    const overlay = screen.getByText('You Found It!').closest('div.fixed');
+    expect(overlay).toBeInTheDocument();
+
+    const background = screen.getByTestId('background');
+    fireEvent.click(background);
+
+    // Because the overlay relies on pointer-events-none, click events pass through it
+    // to underlying layers and propagate correctly. We test background receives the click.
+    expect(clickSpy).toHaveBeenCalledTimes(1);
+
+    if (overlay) {
+      // Simulate touches natively on the overlay element
+      fireEvent.touchStart(overlay);
+      fireEvent.click(overlay);
+    }
+
+    // Component should remain stable
+    expect(screen.getByText('You Found It!')).toBeInTheDocument();
+  });
+
+  it('asserts appropriate cursor style classes (like pointer) are applied on hover', () => {
+    render(<KonamiEasterEgg />);
+    triggerKonamiCode();
+
+    const overlay = screen.getByText('You Found It!').closest('div.fixed');
+
+    // Ensure that it does NOT explicitly use a pointer cursor, since it's unclickable
+    // and allows pointer events to pass through.
+    expect(overlay).toHaveClass('pointer-events-none');
+    expect(overlay).not.toHaveClass('cursor-pointer');
+  });
+
+  it('checks that mouseleave events successfully hide temporary overlay visuals', () => {
+    render(<KonamiEasterEgg />);
+    triggerKonamiCode();
+
+    const overlay = screen.getByText('You Found It!').closest('div.fixed');
+    expect(overlay).toBeInTheDocument();
+
+    if (overlay) {
+      fireEvent.mouseLeave(overlay);
+    }
+
+    // The easter egg should NOT hide purely on mouseLeave (unlike traditional tooltips),
+    // because it depends on a strict timeout visual duration.
+    expect(screen.getByText('You Found It!')).toBeInTheDocument();
+
+    // Advance timeout to correctly hide the temporary overlay
+    act(() => {
+      vi.advanceTimersByTime(6000); // default DISPLAY_DURATION
+    });
+
+    expect(screen.queryByText('You Found It!')).not.toBeInTheDocument();
+  });
+});