Skip to content

Commit 3121fd8

Browse files
sf-tejas-nadkarnisf-tejas-nadkarni
committed
feat: update unit test
1 parent cf0e8b0 commit 3121fd8

File tree

3 files changed

+298
-1
lines changed

3 files changed

+298
-1
lines changed

‎packages/template-retail-react-app/app/components/search/partials/ask-assistant-banner.test.jsx‎

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
/*
2+
* Copyright (c) 2021, salesforce.com, inc.
3+
* All rights reserved.
4+
* SPDX-License-Identifier: BSD-3-Clause
5+
* For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
6+
*/
7+
import React from 'react'
8+
import {screen} from '@testing-library/react'
9+
import userEvent from '@testing-library/user-event'
10+
import {renderWithProviders} from '@salesforce/retail-react-app/app/utils/test-utils'
11+
import AskAssistantBanner from '@salesforce/retail-react-app/app/components/search/partials/ask-assistant-banner'
12+
13+
const baseStyles = {
14+
askAssistantBanner: {},
15+
askAssistantBannerContent: {},
16+
askAssistantBannerIcon: {},
17+
askAssistantBannerTitle: {},
18+
askAssistantBannerDescription: {},
19+
askAssistantBannerArrow: {}
20+
}
21+
22+
test('renders Ask Assistant banner with title and description', () => {
23+
renderWithProviders(<AskAssistantBanner onClick={jest.fn()} styles={baseStyles} />)
24+
25+
expect(
26+
screen.getByRole('button', {
27+
name: /ask assistant.*discover, compare and shop smarter/i
28+
})
29+
).toBeInTheDocument()
30+
expect(screen.getByText('Ask Shopping Agent')).toBeInTheDocument()
31+
expect(
32+
screen.getByText(/Discover, compare, and shop smarter with your personal Shopping Agent/i)
33+
).toBeInTheDocument()
34+
})
35+
36+
test('calls onClick when banner is clicked', async () => {
37+
const user = userEvent.setup()
38+
const onClick = jest.fn()
39+
40+
renderWithProviders(<AskAssistantBanner onClick={onClick} styles={baseStyles} />)
41+
42+
const button = screen.getByRole('button', {
43+
name: /ask assistant.*discover, compare and shop smarter/i
44+
})
45+
await user.click(button)
46+
47+
expect(onClick).toHaveBeenCalledTimes(1)
48+
})

‎packages/template-retail-react-app/app/components/search/partials/search-suggestions-section.test.jsx‎

Lines changed: 98 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,13 @@ jest.mock('@salesforce/retail-react-app/app/components/dynamic-image', () => {
2828
const baseStyles = {
2929
textContainer: {},
3030
sectionHeader: {},
31-
phraseContainer: {}
31+
phraseContainer: {},
32+
askAssistantBanner: {},
33+
askAssistantBannerContent: {},
34+
askAssistantBannerIcon: {},
35+
askAssistantBannerTitle: {},
36+
askAssistantBannerDescription: {},
37+
askAssistantBannerArrow: {}
3238
}
3339

3440
const makeSearchSuggestions = (overrides = {}) => ({
@@ -137,3 +143,94 @@ test('renders nothing when there are no categories, products, or phrase suggesti
137143
expect(screen.queryByText('Products')).not.toBeInTheDocument()
138144
expect(screen.queryByTestId('sf-horizontal-product-suggestions')).not.toBeInTheDocument()
139145
})
146+
147+
describe('Ask Assistant banner', () => {
148+
test('renders Ask Assistant banner when showAskAssistantBanner and onAskAssistantClick are provided', () => {
149+
const searchSuggestions = makeSearchSuggestions({
150+
categorySuggestions: [{type: 'category', name: 'Women', link: '/women'}]
151+
})
152+
153+
renderWithProviders(
154+
<SuggestionSection
155+
searchSuggestions={searchSuggestions}
156+
closeAndNavigate={jest.fn()}
157+
styles={baseStyles}
158+
showAskAssistantBanner={true}
159+
onAskAssistantClick={jest.fn()}
160+
/>
161+
)
162+
163+
const banners = screen.getAllByRole('button', {
164+
name: /ask assistant.*discover, compare and shop smarter/i
165+
})
166+
expect(banners.length).toBeGreaterThanOrEqual(1)
167+
})
168+
169+
test('does not render Ask Assistant banner when showAskAssistantBanner is false', () => {
170+
const searchSuggestions = makeSearchSuggestions({
171+
categorySuggestions: [{type: 'category', name: 'Women', link: '/women'}]
172+
})
173+
174+
renderWithProviders(
175+
<SuggestionSection
176+
searchSuggestions={searchSuggestions}
177+
closeAndNavigate={jest.fn()}
178+
styles={baseStyles}
179+
showAskAssistantBanner={false}
180+
onAskAssistantClick={jest.fn()}
181+
/>
182+
)
183+
184+
expect(
185+
screen.queryByRole('button', {
186+
name: /ask assistant.*discover, compare and shop smarter/i
187+
})
188+
).not.toBeInTheDocument()
189+
})
190+
191+
test('does not render Ask Assistant banner when onAskAssistantClick is not provided', () => {
192+
const searchSuggestions = makeSearchSuggestions({
193+
categorySuggestions: [{type: 'category', name: 'Women', link: '/women'}]
194+
})
195+
196+
renderWithProviders(
197+
<SuggestionSection
198+
searchSuggestions={searchSuggestions}
199+
closeAndNavigate={jest.fn()}
200+
styles={baseStyles}
201+
showAskAssistantBanner={true}
202+
/>
203+
)
204+
205+
expect(
206+
screen.queryByRole('button', {
207+
name: /ask assistant.*discover, compare and shop smarter/i
208+
})
209+
).not.toBeInTheDocument()
210+
})
211+
212+
test('clicking Ask Assistant banner calls onAskAssistantClick', async () => {
213+
const user = userEvent.setup()
214+
const onAskAssistantClick = jest.fn()
215+
const searchSuggestions = makeSearchSuggestions({
216+
recentSearchSuggestions: [{type: 'recent', name: 'shoes', link: '/search?q=shoes'}]
217+
})
218+
219+
renderWithProviders(
220+
<SuggestionSection
221+
searchSuggestions={searchSuggestions}
222+
closeAndNavigate={jest.fn()}
223+
styles={baseStyles}
224+
showAskAssistantBanner={true}
225+
onAskAssistantClick={onAskAssistantClick}
226+
/>
227+
)
228+
229+
const banner = screen.getAllByRole('button', {
230+
name: /ask assistant.*discover, compare and shop smarter/i
231+
})[0]
232+
await user.click(banner)
233+
234+
expect(onAskAssistantClick).toHaveBeenCalledTimes(1)
235+
})
236+
})

‎packages/template-retail-react-app/app/components/search/partials/search-suggestions.test.jsx‎

Lines changed: 152 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,152 @@
1+
/*
2+
* Copyright (c) 2021, salesforce.com, inc.
3+
* All rights reserved.
4+
* SPDX-License-Identifier: BSD-3-Clause
5+
* For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
6+
*/
7+
import React from 'react'
8+
import PropTypes from 'prop-types'
9+
import {screen} from '@testing-library/react'
10+
import userEvent from '@testing-library/user-event'
11+
import {renderWithProviders} from '@salesforce/retail-react-app/app/utils/test-utils'
12+
import SearchSuggestions from '@salesforce/retail-react-app/app/components/search/partials/search-suggestions'
13+
14+
jest.mock(
15+
'@salesforce/retail-react-app/app/components/search/partials/search-suggestions-section',
16+
() => {
17+
const MockSuggestionSection = (props) => (
18+
<div data-testid="suggestion-section">
19+
{props.showAskAssistantBanner && props.onAskAssistantClick && (
20+
<button
21+
type="button"
22+
onClick={props.onAskAssistantClick}
23+
aria-label="Ask Assistant - Discover, compare and shop smarter with your personal shopping assistant"
24+
>
25+
Ask Assistant
26+
</button>
27+
)}
28+
</div>
29+
)
30+
MockSuggestionSection.propTypes = {
31+
showAskAssistantBanner: PropTypes.bool,
32+
onAskAssistantClick: PropTypes.func
33+
}
34+
return MockSuggestionSection
35+
}
36+
)
37+
38+
test('when no suggestions: renders RecentSearches and shows Ask Assistant banner when enabled with click handler', () => {
39+
renderWithProviders(
40+
<SearchSuggestions
41+
recentSearches={['shoes', 'dress']}
42+
searchSuggestions={{}}
43+
closeAndNavigate={jest.fn()}
44+
enableAgentFromSearchSuggestions={true}
45+
onAskAssistantClick={jest.fn()}
46+
/>
47+
)
48+
49+
expect(screen.getByTestId('sf-suggestion-recent')).toBeInTheDocument()
50+
expect(
51+
screen.getByRole('button', {
52+
name: /ask assistant.*discover, compare and shop smarter/i
53+
})
54+
).toBeInTheDocument()
55+
})
56+
57+
test('when no suggestions and enableAgentFromSearchSuggestions false: does not show Ask Assistant banner', () => {
58+
renderWithProviders(
59+
<SearchSuggestions
60+
recentSearches={['shoes']}
61+
searchSuggestions={{}}
62+
closeAndNavigate={jest.fn()}
63+
enableAgentFromSearchSuggestions={false}
64+
onAskAssistantClick={jest.fn()}
65+
/>
66+
)
67+
68+
expect(screen.getByTestId('sf-suggestion-recent')).toBeInTheDocument()
69+
expect(
70+
screen.queryByRole('button', {
71+
name: /ask assistant.*discover, compare and shop smarter/i
72+
})
73+
).not.toBeInTheDocument()
74+
})
75+
76+
test('when no suggestions and onAskAssistantClick not provided: does not show Ask Assistant banner', () => {
77+
renderWithProviders(
78+
<SearchSuggestions
79+
recentSearches={['shoes']}
80+
searchSuggestions={{}}
81+
closeAndNavigate={jest.fn()}
82+
enableAgentFromSearchSuggestions={true}
83+
/>
84+
)
85+
86+
expect(
87+
screen.queryByRole('button', {
88+
name: /ask assistant.*discover, compare and shop smarter/i
89+
})
90+
).not.toBeInTheDocument()
91+
})
92+
93+
test('enableAgentFromSearchSuggestions string "true" shows banner when no suggestions', () => {
94+
renderWithProviders(
95+
<SearchSuggestions
96+
recentSearches={['shoes']}
97+
searchSuggestions={{}}
98+
closeAndNavigate={jest.fn()}
99+
enableAgentFromSearchSuggestions="true"
100+
onAskAssistantClick={jest.fn()}
101+
/>
102+
)
103+
104+
expect(
105+
screen.getByRole('button', {
106+
name: /ask assistant.*discover, compare and shop smarter/i
107+
})
108+
).toBeInTheDocument()
109+
})
110+
111+
test('when has suggestions: renders SuggestionSection with showAskAssistantBanner and onAskAssistantClick', () => {
112+
const onAskAssistantClick = jest.fn()
113+
renderWithProviders(
114+
<SearchSuggestions
115+
recentSearches={[]}
116+
searchSuggestions={{
117+
categorySuggestions: [{type: 'category', name: 'Women', link: '/women'}]
118+
}}
119+
closeAndNavigate={jest.fn()}
120+
enableAgentFromSearchSuggestions={true}
121+
onAskAssistantClick={onAskAssistantClick}
122+
/>
123+
)
124+
125+
expect(screen.getByTestId('suggestion-section')).toBeInTheDocument()
126+
const banner = screen.getByRole('button', {
127+
name: /ask assistant.*discover, compare and shop smarter/i
128+
})
129+
expect(banner).toBeInTheDocument()
130+
})
131+
132+
test('when has suggestions and banner enabled: clicking banner calls onAskAssistantClick', async () => {
133+
const user = userEvent.setup()
134+
const onAskAssistantClick = jest.fn()
135+
renderWithProviders(
136+
<SearchSuggestions
137+
recentSearches={[]}
138+
searchSuggestions={{
139+
recentSearchSuggestions: [{type: 'recent', name: 'shoes', link: '/search?q=shoes'}]
140+
}}
141+
closeAndNavigate={jest.fn()}
142+
enableAgentFromSearchSuggestions={true}
143+
onAskAssistantClick={onAskAssistantClick}
144+
/>
145+
)
146+
147+
const banner = screen.getByRole('button', {
148+
name: /ask assistant.*discover, compare and shop smarter/i
149+
})
150+
await user.click(banner)
151+
expect(onAskAssistantClick).toHaveBeenCalledTimes(1)
152+
})

0 commit comments

Comments
 (0)