Genarrative/src/hooks/useResolvedAssetReadUrl.test.tsx

// @vitest-environment jsdom

import { fireEvent, render, screen, waitFor } from '@testing-library/react';
import { afterEach, beforeEach, describe, expect, test, vi } from 'vitest';

import { RUNTIME_RESOURCE_PENDING_SELECTOR } from '../components/common/RuntimeResourcePendingMarker';
import { ResolvedAssetImage } from '../components/ResolvedAssetImage';
import {
  clearStoredAccessToken,
  setStoredAccessToken,
} from '../services/apiClient';
import { clearSignedAssetReadUrlCache } from '../services/assetReadUrlService';
import { useResolvedAssetReadUrl } from './useResolvedAssetReadUrl';

describe('useResolvedAssetReadUrl', () => {
  beforeEach(() => {
    clearSignedAssetReadUrlCache();
    clearStoredAccessToken({ emit: false });
    setStoredAccessToken('test-access-token', { emit: false });
    vi.restoreAllMocks();
  });

  afterEach(() => {
    clearStoredAccessToken({ emit: false });
  });

  test('generated 私有资源签名完成前不会把裸路径写入 img', async () => {
    vi.spyOn(globalThis, 'fetch').mockResolvedValue(
      new Response(
        JSON.stringify({
          ok: true,
          data: {
            read: {
              objectKey:
                'generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png',
              signedUrl: 'https://signed.example.com/puzzle.png',
              expiresAt: '2099-01-01T00:10:00Z',
            },
          },
          error: null,
          meta: {
            apiVersion: '2026-06-16',
            routeVersion: '2026-06-16',
            latencyMs: 1,
            timestamp: '2099-01-01T00:00:00Z',
          },
        }),
        {
          status: 200,
          headers: {
            'Content-Type': 'application/json',
          },
        },
      ),
    );

    render(
      <ResolvedAssetImage
        src="/generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png"
        alt="候选图"
      />,
    );

    expect(screen.queryByRole('img', { name: '候选图' })).toBeNull();

    const image = await screen.findByRole('img', { name: '候选图' });
    expect(image.getAttribute('src')).toBe(
      'https://signed.example.com/puzzle.png',
    );
    expect(globalThis.fetch).toHaveBeenCalledTimes(1);
    expect(String(vi.mocked(globalThis.fetch).mock.calls[0]?.[0])).toContain(
      'legacyPublicPath=%2Fgenerated-puzzle-assets%2Fpuzzle-session-1%2Fcandidate-1%2Fasset-1%2Fimage.png',
    );
  });

  test('显式 objectKey 会通过 objectKey 换签而不是当作普通路径', async () => {
    vi.spyOn(globalThis, 'fetch').mockResolvedValue(
      new Response(
        JSON.stringify({
          ok: true,
          data: {
            read: {
              objectKey: 'oss/editor/private-image.png',
              signedUrl: 'https://signed.example.com/private-image.png',
              expiresAt: '2099-01-01T00:10:00Z',
            },
          },
          error: null,
          meta: {
            apiVersion: '2026-06-16',
            routeVersion: '2026-06-16',
            latencyMs: 1,
            timestamp: '2099-01-01T00:00:00Z',
          },
        }),
        {
          status: 200,
          headers: {
            'Content-Type': 'application/json',
          },
        },
      ),
    );

    function ObjectKeyProbe() {
      const { resolvedUrl } = useResolvedAssetReadUrl('/legacy/public.png', {
        objectKey: 'oss/editor/private-image.png',
        refreshKey: 'asset-1',
      });
      return <output aria-label="资源地址">{resolvedUrl}</output>;
    }

    render(<ObjectKeyProbe />);

    await waitFor(() => {
      expect(screen.getByLabelText('资源地址').textContent).toBe(
        'https://signed.example.com/private-image.png',
      );
    });
    expect(String(vi.mocked(globalThis.fetch).mock.calls[0]?.[0])).toContain(
      'objectKey=oss%2Feditor%2Fprivate-image.png',
    );
  });

  test('无前导斜杠的 generated 私有资源也不会裸写入 img', async () => {
    vi.spyOn(globalThis, 'fetch').mockResolvedValue(
      new Response(
        JSON.stringify({
          ok: true,
          data: {
            read: {
              objectKey:
                'generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png',
              signedUrl: 'https://signed.example.com/puzzle.png',
              expiresAt: '2099-01-01T00:10:00Z',
            },
          },
          error: null,
          meta: {
            apiVersion: '2026-06-16',
            routeVersion: '2026-06-16',
            latencyMs: 1,
            timestamp: '2099-01-01T00:00:00Z',
          },
        }),
        {
          status: 200,
          headers: {
            'Content-Type': 'application/json',
          },
        },
      ),
    );

    render(
      <ResolvedAssetImage
        src="generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png"
        alt="候选图"
      />,
    );

    expect(screen.queryByRole('img', { name: '候选图' })).toBeNull();

    const image = await screen.findByRole('img', { name: '候选图' });
    expect(image.getAttribute('src')).toBe(
      'https://signed.example.com/puzzle.png',
    );
  });

  test('完整 OSS generated 地址也会先换签再写入 img', async () => {
    vi.spyOn(globalThis, 'fetch').mockResolvedValue(
      new Response(
        JSON.stringify({
          ok: true,
          data: {
            read: {
              objectKey:
                'generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png',
              signedUrl: 'https://signed.example.com/puzzle.png',
              expiresAt: '2099-01-01T00:10:00Z',
            },
          },
          error: null,
          meta: {
            apiVersion: '2026-06-16',
            routeVersion: '2026-06-16',
            latencyMs: 1,
            timestamp: '2099-01-01T00:00:00Z',
          },
        }),
        {
          status: 200,
          headers: {
            'Content-Type': 'application/json',
          },
        },
      ),
    );

    render(
      <ResolvedAssetImage
        src="https://genarrative-release.oss-cn-beijing.aliyuncs.com/generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png"
        alt="候选图"
      />,
    );

    expect(screen.queryByRole('img', { name: '候选图' })).toBeNull();

    const image = await screen.findByRole('img', { name: '候选图' });
    expect(image.getAttribute('src')).toBe(
      'https://signed.example.com/puzzle.png',
    );
    expect(String(vi.mocked(globalThis.fetch).mock.calls[0]?.[0])).toContain(
      'legacyPublicPath=%2Fgenerated-puzzle-assets%2Fpuzzle-session-1%2Fcandidate-1%2Fasset-1%2Fimage.png',
    );
  });

  test('refreshKey changes force a fresh signed url request without mutating OSS signature query', async () => {
    let requestCount = 0;
    vi.spyOn(globalThis, 'fetch').mockImplementation(
      async () =>
        new Response(
          JSON.stringify({
            ok: true,
            data: {
              read: {
                objectKey:
                  'generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png',
                signedUrl: `https://signed.example.com/puzzle.png?x-oss-signature=version-${++requestCount}`,
                expiresAt: '2099-01-01T00:10:00Z',
              },
            },
            error: null,
            meta: {
              apiVersion: '2026-06-16',
              routeVersion: '2026-06-16',
              latencyMs: 1,
              timestamp: '2099-01-01T00:00:00Z',
            },
          }),
          {
            status: 200,
            headers: {
              'Content-Type': 'application/json',
            },
          },
        ),
    );

    const { rerender } = render(
      <ResolvedAssetImage
        src="/generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png"
        refreshKey="first-version"
        alt="候选图"
      />,
    );

    const firstImage = await screen.findByRole('img', { name: '候选图' });
    expect(firstImage.getAttribute('src')).toBe(
      'https://signed.example.com/puzzle.png?x-oss-signature=version-1',
    );

    rerender(
      <ResolvedAssetImage
        src="/generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png"
        refreshKey="second-version"
        alt="候选图"
      />,
    );

    await waitFor(() => {
      expect(
        screen.getByRole('img', { name: '候选图' }).getAttribute('src'),
      ).toBe('https://signed.example.com/puzzle.png?x-oss-signature=version-2');
    });
    expect(globalThis.fetch).toHaveBeenCalledTimes(2);
  });

  test('generated 私有资源签名失败时保持空图像而不是回退裸路径', async () => {
    vi.spyOn(globalThis, 'fetch').mockResolvedValue(
      new Response(
        JSON.stringify({
          ok: false,
          data: null,
          error: {
            code: 'NOT_FOUND',
            message: '对象不存在',
          },
          meta: {
            apiVersion: '2026-06-16',
            routeVersion: '2026-06-16',
            latencyMs: 1,
            timestamp: '2099-01-01T00:00:00Z',
          },
        }),
        {
          status: 400,
          headers: {
            'Content-Type': 'application/json',
          },
        },
      ),
    );

    const { container } = render(
      <ResolvedAssetImage
        src="/generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png"
        alt="候选图"
      />,
    );

    expect(
      container.querySelector(RUNTIME_RESOURCE_PENDING_SELECTOR),
    ).not.toBeNull();
    await waitFor(() => {
      expect(
        container.querySelector(RUNTIME_RESOURCE_PENDING_SELECTOR),
      ).toBeNull();
    });
    expect(globalThis.fetch).toHaveBeenCalledTimes(1);
    expect(screen.queryByRole('img', { name: '候选图' })).toBeNull();
  });

  test('generated 私有资源签名失败时可使用显式 fallbackSrc', async () => {
    vi.spyOn(globalThis, 'fetch').mockResolvedValue(
      new Response(
        JSON.stringify({
          ok: false,
          data: null,
          error: {
            code: 'NOT_FOUND',
            message: '对象不存在',
          },
          meta: {
            apiVersion: '2026-06-16',
            routeVersion: '2026-06-16',
            latencyMs: 1,
            timestamp: '2099-01-01T00:00:00Z',
          },
        }),
        {
          status: 400,
          headers: {
            'Content-Type': 'application/json',
          },
        },
      ),
    );

    const { container } = render(
      <ResolvedAssetImage
        src="/generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png"
        fallbackSrc="/creation-type-references/puzzle.webp"
        alt="候选图"
      />,
    );

    expect(
      screen.getByRole('img', { name: '候选图' }).getAttribute('src'),
    ).toBe('/creation-type-references/puzzle.webp');
    expect(
      container.querySelector(RUNTIME_RESOURCE_PENDING_SELECTOR),
    ).not.toBeNull();
    await waitFor(() => {
      expect(
        container.querySelector(RUNTIME_RESOURCE_PENDING_SELECTOR),
      ).toBeNull();
    });
    expect(globalThis.fetch).toHaveBeenCalledTimes(1);
    expect(
      screen.getByRole('img', { name: '候选图' }).getAttribute('src'),
    ).toBe('/creation-type-references/puzzle.webp');
  });

  test('普通封面加载失败时切换到显式 fallbackSrc', async () => {
    render(
      <ResolvedAssetImage
        src="/covers/missing-cover.webp"
        fallbackSrc="/creation-type-references/puzzle.webp"
        alt="草稿封面"
      />,
    );

    const image = screen.getByRole('img', { name: '草稿封面' });
    expect(image.getAttribute('src')).toBe('/covers/missing-cover.webp');

    fireEvent.error(image);

    await waitFor(() => {
      expect(
        screen.getByRole('img', { name: '草稿封面' }).getAttribute('src'),
      ).toBe('/creation-type-references/puzzle.webp');
    });
  });
});