Skip to content

Commit

Permalink
AC-2489::Page title for search page not informative (Search Results) (#…
Browse files Browse the repository at this point in the history 
…3931)

* AC-2489::Page title for search page not informative (Search Results)

* AC-2489::Fixed the lint issue on searchPage.js

* AC-2489::fixed failing pr-test testcase

* AC-2489::Added store view name with search term

* AC-2489::Added storename with search term aria-label

* AC-2489::fixed yarn test cases

Co-authored-by: Devagouda <40405790+dpatil-magento@users.noreply.github.com>
  • Loading branch information
@glo82145 @dpatil-magento
glo82145 and dpatil-magento authored Nov 9, 2022
1 parent b779410 commit 8184525
Show file tree
Hide file tree
Showing 5 changed files with 81 additions and 38 deletions.
1 change: 1 addition & 0 deletions packages/peregrine/lib/talons/SearchPage/__tests__/__snapshots__/useSearchPage.spec.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ Object {
"value": "position",
},
],
"currentStoreName": "Store 1",
"data": Object {
"products": Object {
"page_info": Object {
Expand Down
45 changes: 42 additions & 3 deletions packages/peregrine/lib/talons/SearchPage/__tests__/useSearchPage.spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import { getFiltersFromSearch } from '../../FilterModal/helpers';
import { useSearchPage } from '../useSearchPage';
import { getSearchParam } from '../../../hooks/useSearchParam';
import { useEventingContext } from '../../../context/eventing';
import { useStoreSwitcher } from '@magento/peregrine/lib/talons/Header/useStoreSwitcher';

const log = jest.fn();
const Component = props => {
Expand All @@ -28,6 +29,10 @@ const mockUseSort = jest
.mockName('mockUseSort');
const mockSetCurrentPage = jest.fn().mockName('mockSetCurrentPage');

jest.mock('@magento/peregrine/lib/talons/Header/useStoreSwitcher', () => ({
useStoreSwitcher: jest.fn()
}));

jest.mock('react-router-dom', () => ({
useHistory: jest.fn(() => ({ push: jest.fn() })),
useLocation: jest.fn(() => ({
Expand Down Expand Up @@ -135,6 +140,9 @@ const mockGetSearchAvailableSortMethods = jest.fn();

describe('searchCategory', () => {
test('returns the correct shape', () => {
useStoreSwitcher.mockReturnValueOnce({
currentStoreName: 'Store 1'
});
useLazyQuery.mockReturnValueOnce([
mockGetSearchAvailableSortMethods,
{ data: mockAvailableSortMethods }
Expand All @@ -149,6 +157,9 @@ describe('searchCategory', () => {
mockGetSearchAvailableSortMethods,
{ data: mockAvailableSortMethods }
]);
useStoreSwitcher.mockReturnValueOnce({
currentStoreName: 'Store 1'
});
getFiltersFromSearch.mockReturnValueOnce(new Map());
// Act.
createTestInstance(<Component {...initialProps} />);
Expand All @@ -162,6 +173,9 @@ describe('searchCategory', () => {
mockGetSearchAvailableSortMethods,
{ data: mockAvailableSortMethods }
]);
useStoreSwitcher.mockReturnValueOnce({
currentStoreName: 'Store 1'
});
const map = new Map().set('not_category_id', 'unit test');
getFiltersFromSearch.mockReturnValueOnce(map);
// Act.
Expand All @@ -176,6 +190,9 @@ describe('searchCategory', () => {
mockGetSearchAvailableSortMethods,
{ data: mockAvailableSortMethods }
]);
useStoreSwitcher.mockReturnValueOnce({
currentStoreName: 'Store 1'
});
const map = new Map().set('category_id', new Set(['Bottoms,11']));
getFiltersFromSearch.mockReturnValueOnce(map);
// Act.
Expand All @@ -190,6 +207,9 @@ describe('searchCategory', () => {
mockGetSearchAvailableSortMethods,
{ data: mockAvailableSortMethods }
]);
useStoreSwitcher.mockReturnValueOnce({
currentStoreName: 'Store 1'
});
const map = new Map().set(
'category_id',
new Set(['Bottoms,11', 'Skirts,12'])
Expand All @@ -207,7 +227,8 @@ describe('searchCategory', () => {
{
sortText: 'Changed',
sortAttribute: 'relevance',
sortDirection: 'DESC'
sortDirection: 'DESC',
currentStoreName: 'Store 1'
},
0
],
Expand All @@ -216,7 +237,8 @@ describe('searchCategory', () => {
{
sortText: 'Best Match',
sortAttribute: 'Changed',
sortDirection: 'DESC'
sortDirection: 'DESC',
currentStoreName: 'Store 1'
},
1
],
Expand All @@ -225,7 +247,8 @@ describe('searchCategory', () => {
{
sortText: 'Best Match',
sortAttribute: 'relevance',
sortDirection: 'Changed'
sortDirection: 'Changed',
currentStoreName: 'Store 1'
},
1
]
Expand All @@ -234,18 +257,25 @@ describe('searchCategory', () => {
'Changing %s current page to 1.',
(description, sortParams, expected) => {
mockUseSort.mockReturnValueOnce([sortParams, jest.fn()]);
useStoreSwitcher.mockReturnValueOnce({
currentStoreName: 'Store 1'
});
useLazyQuery.mockReturnValueOnce([
mockGetSearchAvailableSortMethods,
{ data: mockAvailableSortMethods }
]);
const tree = createTestInstance(<Component {...initialProps} />);
act(() => {
useStoreSwitcher.mockReturnValueOnce({
currentStoreName: 'Store 1'
});
useLazyQuery.mockReturnValueOnce([
mockGetSearchAvailableSortMethods,
{ data: mockAvailableSortMethods }
]);
tree.update(<Component {...initialProps} />);
});

expect(mockSetCurrentPage).toHaveBeenCalledTimes(expected);
}
);
Expand All @@ -254,6 +284,9 @@ describe('searchCategory', () => {
mockGetSearchAvailableSortMethods,
{ data: mockAvailableSortMethods }
]);
useStoreSwitcher.mockReturnValueOnce({
currentStoreName: 'Store 1'
});
mockUseSort.mockReturnValueOnce([
{
sortText: 'Best Match',
Expand All @@ -269,6 +302,9 @@ describe('searchCategory', () => {
mockGetSearchAvailableSortMethods,
{ data: mockAvailableSortMethods }
]);
useStoreSwitcher.mockReturnValueOnce({
currentStoreName: 'Store 1'
});
tree.update(<Component {...initialProps} />);
});
expect(mockSetCurrentPage).toHaveBeenCalledWith(1, true);
Expand All @@ -283,6 +319,9 @@ describe('searchCategory', () => {
mockGetSearchAvailableSortMethods,
{ data: mockAvailableSortMethods }
]);
useStoreSwitcher.mockReturnValueOnce({
currentStoreName: 'Store 1'
});
mockUseSort.mockReturnValueOnce([
{
sortText: 'Sort Text',
Expand Down
7 changes: 4 additions & 3 deletions packages/peregrine/lib/talons/SearchPage/useSearchPage.js
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { useCallback, useEffect, useMemo, useRef } from 'react';
import { useLazyQuery, useQuery } from '@apollo/client';
import { useLocation } from 'react-router-dom';

import { useStoreSwitcher } from '@magento/peregrine/lib/talons/Header/useStoreSwitcher';
import mergeOperations from '../../util/shallowMerge';
import { useAppContext } from '../../context/app';
import { usePagination } from '../../hooks/usePagination';
Expand All @@ -22,7 +22,7 @@ import { useEventingContext } from '../../context/eventing';
export const useSearchPage = (props = {}) => {
const [, { dispatch }] = useEventingContext();
const operations = mergeOperations(DEFAULT_OPERATIONS, props.operations);

const { currentStoreName } = useStoreSwitcher();
const {
getFilterInputsQuery,
getPageSize,
Expand Down Expand Up @@ -286,6 +286,7 @@ export const useSearchPage = (props = {}) => {
pageControl,
searchCategory,
searchTerm: inputText,
sortProps
sortProps,
currentStoreName
};
};
56 changes: 28 additions & 28 deletions packages/venia-ui/lib/components/SearchPage/__tests__/__snapshots__/searchPage.spec.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,10 +59,10 @@ exports[`Search Page Component error view does not render when data is present 1
</section>
</div>
<Title>
Venia Search
undefined's Search Result for term undefined
</Title>
<Meta
content="Venia Search"
content="undefined's Search Result for term undefined"
name="title"
/>
<Meta
Expand Down Expand Up @@ -105,10 +105,10 @@ exports[`Search Page Component error view renders when data is not present and n
</div>
</div>
<Title>
Venia Search
undefined's Search Result for term undefined
</Title>
<Meta
content="Venia Search"
content="undefined's Search Result for term undefined"
name="title"
/>
<Meta
Expand Down Expand Up @@ -177,10 +177,10 @@ exports[`Search Page Component filter button/modal does not render if there are
</section>
</div>
<Title>
Venia Search
undefined's Search Result for term undefined
</Title>
<Meta
content="Venia Search"
content="undefined's Search Result for term undefined"
name="title"
/>
<Meta
Expand Down Expand Up @@ -272,10 +272,10 @@ exports[`Search Page Component filter button/modal renders when there are filter
/>
</div>
<Title>
Venia Search
undefined's Search Result for term undefined
</Title>
<Meta
content="Venia Search"
content="undefined's Search Result for term undefined"
name="title"
/>
<Meta
Expand Down Expand Up @@ -343,10 +343,10 @@ exports[`Search Page Component loading indicator does not render when data is pr
</section>
</div>
<Title>
Venia Search
undefined's Search Result for term undefined
</Title>
<Meta
content="Venia Search"
content="undefined's Search Result for term undefined"
name="title"
/>
<Meta
Expand Down Expand Up @@ -415,10 +415,10 @@ exports[`Search Page Component loading indicator renders when data is not presen
/>
</div>
<Title>
Venia Search
undefined's Search Result for term undefined
</Title>
<Meta
content="Venia Search"
content="undefined's Search Result for term undefined"
name="title"
/>
<Meta
Expand Down Expand Up @@ -471,10 +471,10 @@ exports[`Search Page Component search results does not render if data returned h
</div>
</div>
<Title>
Venia Search
undefined's Search Result for term undefined
</Title>
<Meta
content="Venia Search"
content="undefined's Search Result for term undefined"
name="title"
/>
<Meta
Expand Down Expand Up @@ -575,10 +575,10 @@ exports[`Search Page Component search results heading renders a generic message
</section>
</div>
<Title>
Venia Search
undefined's Search Result for term false
</Title>
<Meta
content="Venia Search"
content="undefined's Search Result for term false"
name="title"
/>
<Meta
Expand Down Expand Up @@ -686,10 +686,10 @@ exports[`Search Page Component search results heading renders a specific message
</section>
</div>
<Title>
Search Term - Venia Search
undefined's Search Result for term Search Term
</Title>
<Meta
content="Search Term - Venia Search"
content="undefined's Search Result for term Search Term"
name="title"
/>
<Meta
Expand Down Expand Up @@ -757,10 +757,10 @@ exports[`Search Page Component search results renders if data has items 1`] = `
</section>
</div>
<Title>
Venia Search
undefined's Search Result for term undefined
</Title>
<Meta
content="Venia Search"
content="undefined's Search Result for term undefined"
name="title"
/>
<Meta
Expand Down Expand Up @@ -814,10 +814,10 @@ exports[`Search Page Component sort button/container does not render if total co
</div>
</div>
<Title>
Venia Search
undefined's Search Result for term undefined
</Title>
<Meta
content="Venia Search"
content="undefined's Search Result for term undefined"
name="title"
/>
<Meta
Expand Down Expand Up @@ -918,10 +918,10 @@ exports[`Search Page Component sort button/container renders when total count >
</section>
</div>
<Title>
Venia Search
undefined's Search Result for term undefined
</Title>
<Meta
content="Venia Search"
content="undefined's Search Result for term undefined"
name="title"
/>
<Meta
Expand Down Expand Up @@ -975,10 +975,10 @@ exports[`Search Page Component total count renders 0 items if data.products.tota
</div>
</div>
<Title>
Venia Search
undefined's Search Result for term undefined
</Title>
<Meta
content="Venia Search"
content="undefined's Search Result for term undefined"
name="title"
/>
<Meta
Expand Down Expand Up @@ -1079,10 +1079,10 @@ exports[`Search Page Component total count renders results from data 1`] = `
</section>
</div>
<Title>
Venia Search
undefined's Search Result for term undefined
</Title>
<Meta
content="Venia Search"
content="undefined's Search Result for term undefined"
name="title"
/>
<Meta
Expand Down
Loading

0 comments on commit 8184525

Please sign in to comment.