mirror of
https://gerrit.wikimedia.org/r/mediawiki/skins/Vector.git
synced 2024-11-24 15:53:46 +00:00
ce77018b7c
[Visual changes] This should result in 9 visual regression failures relating to increased height of search results and loading bar [More details about change] - Migrate search app from Vue 2 to Vue 3; update tests accordingly - Remove dependence on WVUI and use Codex instead, via the special `@wikimedia/codex-search` package - Update search app to use CdxTypeaheadSearch, which no longer takes in props related to the search client or fetch start/end instrumentation. Instead, directly use the restSearchClient and call fetch start/end events in the search app. - Handle hideDirection in the search app/API response formatting code, not within the TypeaheadSearch component - Handle showing/hiding the search button in the app - Move the WVUI URL generator into Vector - Update server-rendered search box styles to match design updates included with CdxTypeaheadSearch - Replace references to WVUI with references to Codex - Update values of various LESS variables to match Codex, and update searchBox styling to prevent jankiness when the searchBox is replaced with the Codex TypeaheadSearch component The VectorWvuiSearchOptions config variable has been maintained and will be updated to a code-agnostic name in a future patch. Bug: T300573 Bug: T302137 Bug: T303558 Bug: T309722 Bug: T310525 Co-Authored-By: Anne Tomasevich <atomasevich@wikimedia.org> Change-Id: I59fa3a006d988b14ebd8020cbd58e8d7bedbfe01
131 lines
3.5 KiB
JavaScript
131 lines
3.5 KiB
JavaScript
/* global fetchMock */
|
|
const restSearchClient = require( '../../resources/skins.vector.search/restSearchClient.js' );
|
|
const jestFetchMock = require( 'jest-fetch-mock' );
|
|
|
|
const mockedRequests = !process.env.TEST_LIVE_REQUESTS;
|
|
const configMock = {
|
|
get: jest.fn().mockImplementation( key => {
|
|
if ( key === 'wgScriptPath' ) {
|
|
return '/w';
|
|
}
|
|
if ( key === 'wgScript' ) {
|
|
return '/w/index.php';
|
|
}
|
|
return null;
|
|
} ),
|
|
set: jest.fn()
|
|
};
|
|
|
|
describe( 'restApiSearchClient', () => {
|
|
beforeAll( () => {
|
|
jestFetchMock.enableFetchMocks();
|
|
} );
|
|
|
|
afterAll( () => {
|
|
jestFetchMock.disableFetchMocks();
|
|
} );
|
|
|
|
beforeEach( () => {
|
|
fetchMock.resetMocks();
|
|
if ( !mockedRequests ) {
|
|
fetchMock.disableMocks();
|
|
}
|
|
} );
|
|
|
|
test( '2 results', async () => {
|
|
const thumbUrl = '//upload.wikimedia.org/wikipedia/commons/0/01/MediaWiki-smaller-logo.png';
|
|
const restResponse = {
|
|
pages: [
|
|
{
|
|
id: 37298,
|
|
key: 'Media',
|
|
label: 'Media',
|
|
title: 'Media',
|
|
description: 'Wikimedia disambiguation page',
|
|
thumbnail: null,
|
|
url: '/w/index.php?title=Special%3ASearch&search=Media',
|
|
value: 37298
|
|
},
|
|
{
|
|
id: 323710,
|
|
key: 'MediaWiki',
|
|
label: 'MediaWiki',
|
|
title: 'MediaWiki',
|
|
description: 'wiki software',
|
|
thumbnail: {
|
|
width: 200,
|
|
height: 189,
|
|
url: thumbUrl
|
|
},
|
|
url: '/w/index.php?title=Special%3ASearch&search=MediaWiki',
|
|
value: 323710
|
|
}
|
|
]
|
|
};
|
|
fetchMock.mockOnce( JSON.stringify( restResponse ) );
|
|
|
|
const searchResult = await restSearchClient( configMock ).fetchByTitle(
|
|
'media',
|
|
'en.wikipedia.org',
|
|
2
|
|
).fetch;
|
|
|
|
/* eslint-disable-next-line compat/compat */
|
|
const controller = new AbortController();
|
|
|
|
expect( searchResult.query ).toStrictEqual( 'media' );
|
|
expect( searchResult.results ).toBeTruthy();
|
|
expect( searchResult.results.length ).toBe( 2 );
|
|
|
|
expect( searchResult.results[ 0 ] ).toStrictEqual(
|
|
Object.assign( {}, restResponse.pages[ 0 ], {
|
|
// thumbnail: null -> thumbnail: undefined
|
|
thumbnail: undefined
|
|
} ) );
|
|
expect( searchResult.results[ 1 ] ).toStrictEqual( restResponse.pages[ 1 ] );
|
|
|
|
if ( mockedRequests ) {
|
|
expect( fetchMock ).toHaveBeenCalledTimes( 1 );
|
|
expect( fetchMock ).toHaveBeenCalledWith(
|
|
'//en.wikipedia.org/w/rest.php/v1/search/title?q=media&limit=2',
|
|
{ headers: { accept: 'application/json' }, signal: controller.signal }
|
|
);
|
|
}
|
|
} );
|
|
|
|
test( '0 results', async () => {
|
|
const restResponse = { pages: [] };
|
|
fetchMock.mockOnce( JSON.stringify( restResponse ) );
|
|
|
|
const searchResult = await restSearchClient( configMock ).fetchByTitle(
|
|
'thereIsNothingLikeThis',
|
|
'en.wikipedia.org'
|
|
).fetch;
|
|
|
|
/* eslint-disable-next-line compat/compat */
|
|
const controller = new AbortController();
|
|
expect( searchResult.query ).toStrictEqual( 'thereIsNothingLikeThis' );
|
|
expect( searchResult.results ).toBeTruthy();
|
|
expect( searchResult.results.length ).toBe( 0 );
|
|
|
|
if ( mockedRequests ) {
|
|
expect( fetchMock ).toHaveBeenCalledTimes( 1 );
|
|
expect( fetchMock ).toHaveBeenCalledWith(
|
|
'//en.wikipedia.org/w/rest.php/v1/search/title?q=thereIsNothingLikeThis&limit=10',
|
|
{ headers: { accept: 'application/json' }, signal: controller.signal }
|
|
);
|
|
}
|
|
} );
|
|
|
|
if ( mockedRequests ) {
|
|
test( 'network error', async () => {
|
|
fetchMock.mockRejectOnce( new Error( 'failed' ) );
|
|
|
|
await expect( restSearchClient( configMock ).fetchByTitle(
|
|
'anything',
|
|
'en.wikipedia.org'
|
|
).fetch ).rejects.toThrow( 'failed' );
|
|
} );
|
|
}
|
|
} );
|