diff --git a/web/app/components/plugins/marketplace/home/__tests__/marketplace-search-autocomplete.browser.spec.tsx b/web/app/components/plugins/marketplace/home/__tests__/marketplace-search-autocomplete.browser.spec.tsx index 1446ce8b2ad..02a20c27f01 100644 --- a/web/app/components/plugins/marketplace/home/__tests__/marketplace-search-autocomplete.browser.spec.tsx +++ b/web/app/components/plugins/marketplace/home/__tests__/marketplace-search-autocomplete.browser.spec.tsx @@ -15,10 +15,6 @@ const { mockTemplateSearch } = vi.hoisted(() => ({ mockTemplateSearch: vi.fn(), })) -vi.mock('@/next/navigation', () => ({ - useRouter: () => ({ push: vi.fn() }), -})) - vi.mock('ahooks', async (importOriginal) => { const original = await importOriginal() diff --git a/web/app/components/plugins/marketplace/home/__tests__/marketplace-search-autocomplete.spec.tsx b/web/app/components/plugins/marketplace/home/__tests__/marketplace-search-autocomplete.spec.tsx index 6954489af47..6c2a020a9a5 100644 --- a/web/app/components/plugins/marketplace/home/__tests__/marketplace-search-autocomplete.spec.tsx +++ b/web/app/components/plugins/marketplace/home/__tests__/marketplace-search-autocomplete.spec.tsx @@ -3,19 +3,19 @@ import { QueryClient, QueryClientProvider } from '@tanstack/react-query' import { render, screen, waitFor, within } from '@testing-library/react' import userEvent from '@testing-library/user-event' import { useState } from 'react' -import { beforeEach, describe, expect, it, vi } from 'vite-plus/test' +import { afterEach, beforeEach, describe, expect, it, vi } from 'vite-plus/test' import { MARKETPLACE_API_PREFIX } from '@/config' import { MarketplaceSearchAutocomplete, MarketplaceSearchForm, } from '../marketplace-search-autocomplete' -const { debounceState, mockPluginSearch, mockPush, mockTemplateSearch } = vi.hoisted(() => ({ +const { debounceState, mockAssign, mockPluginSearch, mockTemplateSearch } = vi.hoisted(() => ({ // Most tests bypass the debounce for simplicity; the debounce-window test // flips this on to exercise the real 300ms lag. debounceState: { useRealDebounce: false }, + mockAssign: vi.fn(), mockPluginSearch: vi.fn(), - mockPush: vi.fn(), mockTemplateSearch: vi.fn(), })) @@ -43,10 +43,6 @@ vi.mock('react-i18next', async () => { }) }) -vi.mock('@/next/navigation', () => ({ - useRouter: () => ({ push: mockPush }), -})) - vi.mock('@/service/client', () => ({ marketplaceQuery: { searchAdvanced: { @@ -73,7 +69,8 @@ function Wrapper({ children }: { children: ReactNode }) { describe('MarketplaceSearchAutocomplete', () => { beforeEach(() => { vi.clearAllMocks() - mockPush.mockReset() + mockAssign.mockReset() + vi.spyOn(window.location, 'assign').mockImplementation(mockAssign) debounceState.useRealDebounce = false queryClient = new QueryClient({ defaultOptions: { @@ -87,6 +84,10 @@ describe('MarketplaceSearchAutocomplete', () => { mockTemplateSearch.mockResolvedValue({ data: { templates: [], total: 0 } }) }) + afterEach(() => { + vi.restoreAllMocks() + }) + it('shows template suggestions and keeps the route search form contract', async () => { let resolveTemplateSearch!: (value: unknown) => void const templateSearchPromise = new Promise((resolve) => { @@ -138,7 +139,7 @@ describe('MarketplaceSearchAutocomplete', () => { expect(screen.getByText('Research legal questions with cited sources.')).toBeInTheDocument() await user.click(screen.getByText('Legal Research Agent')) - expect(mockPush).toHaveBeenCalledWith( + expect(mockAssign).toHaveBeenCalledWith( '/template/dify/Legal%20Research%20Agent?templateId=template-1', ) @@ -262,7 +263,7 @@ describe('MarketplaceSearchAutocomplete', () => { await user.click(screen.getByText('Google Search')) - expect(mockPush).toHaveBeenCalledWith('/plugin/langgenius/google-search') + expect(mockAssign).toHaveBeenCalledWith('/plugin/langgenius/google-search') expect(handleSubmit).not.toHaveBeenCalled() }) @@ -363,7 +364,7 @@ describe('MarketplaceSearchAutocomplete', () => { await user.type(screen.getByRole('combobox'), 'google') await user.click(await screen.findByText('Google Search')) - expect(mockPush).toHaveBeenCalledWith('/plugin/langgenius/google-search') + expect(mockAssign).toHaveBeenCalledWith('/plugin/langgenius/google-search') expect(handleSubmit).not.toHaveBeenCalled() }) @@ -459,7 +460,7 @@ describe('MarketplaceSearchAutocomplete', () => { expect(await screen.findByText('Google Search')).toBeInTheDocument() await user.keyboard('{ArrowDown}{Enter}') - expect(mockPush).toHaveBeenCalledWith('/plugin/langgenius/google-search') + expect(mockAssign).toHaveBeenCalledWith('/plugin/langgenius/google-search') expect(handleSubmit).not.toHaveBeenCalled() }) diff --git a/web/app/components/plugins/marketplace/home/marketplace-search-autocomplete.tsx b/web/app/components/plugins/marketplace/home/marketplace-search-autocomplete.tsx index e8d78dac2ad..d5c38256bf2 100644 --- a/web/app/components/plugins/marketplace/home/marketplace-search-autocomplete.tsx +++ b/web/app/components/plugins/marketplace/home/marketplace-search-autocomplete.tsx @@ -26,7 +26,6 @@ import { useEffect, useRef, useState } from 'react' import { useTranslation } from '#i18n' import { MARKETPLACE_API_PREFIX } from '@/config' import { renderI18nObject } from '@/i18n-config/index' -import { useRouter } from '@/next/navigation' import { marketplaceQuery } from '@/service/client' import { markMarketplaceSiteSearch } from '@/utils/marketplace-site-track' import { @@ -183,7 +182,6 @@ export function MarketplaceSearchAutocomplete({ value, }: MarketplaceSearchAutocompleteProps) { const { t } = useTranslation() - const router = useRouter() const [isOpen, setIsOpen] = useState(false) const searchRootRef = useRef(null) const resultsPanelRef = useRef(null) @@ -208,7 +206,7 @@ export function MarketplaceSearchAutocomplete({ ? getPluginDetailLinkInMarketplace(selection.plugin) : getTemplateDetailLinkInMarketplace(selection.template) setIsOpen(false) - router.push(href) + window.location.assign(href) } const debouncedSearch = useDebounce(value.trim(), { wait: 300 }) const hasQuery = Boolean(debouncedSearch)