Create New Item
Item Type
File
Folder
Item Name
Search file in folder and subfolders...
Are you sure want to rename?
optometrists
/
cache
/
cache
/
cache
/
.wp-cli
/
wp-content
/
plugins
/
woocommerce
/
packages
/
woocommerce-blocks
/
assets
/
js
/
hocs
/
test
:
with-searched-products.js
Advanced Search
Upload
New Item
Settings
Back
Back Up
Advanced Editor
Save
/** * External dependencies */ import TestRenderer from 'react-test-renderer'; import _ from 'lodash'; import * as mockUtils from '@woocommerce/editor-components/utils'; /** * Internal dependencies */ import withSearchedProducts from '../with-searched-products'; jest.mock( '@woocommerce/block-settings', () => ( { __esModule: true, blocksConfig: { productCount: 101, }, } ) ); // Mock the getProducts values for tests. mockUtils.getProducts = jest.fn().mockImplementation( () => Promise.resolve( [ { id: 10, name: 'foo', parent: 0 }, { id: 20, name: 'bar', parent: 0 }, ] ) ); // Add a mock implementation of debounce for testing so we can spy on // the onSearch call. const debouncedCancel = jest.fn(); const debouncedAction = jest.fn(); _.debounce = ( onSearch ) => { const debounced = debouncedAction.mockImplementation( () => { onSearch(); } ); debounced.cancel = debouncedCancel; return debounced; }; describe( 'withSearchedProducts Component', () => { const { getProducts } = mockUtils; afterEach( () => { debouncedCancel.mockClear(); debouncedAction.mockClear(); mockUtils.getProducts.mockClear(); } ); const TestComponent = withSearchedProducts( ( { selected, products, isLoading, onSearch } ) => { return ( <div products={ products } selected={ selected } isLoading={ isLoading } onSearch={ onSearch } /> ); } ); describe( 'lifecycle tests', () => { const selected = [ 10 ]; const renderer = TestRenderer.create( <TestComponent selected={ selected } /> ); let props; it( 'getProducts is called on mount with passed in selected ' + 'values', () => { expect( getProducts ).toHaveBeenCalledWith( { selected } ); expect( getProducts ).toHaveBeenCalledTimes( 1 ); } ); it( 'has expected values for props', () => { props = renderer.root.findByType( 'div' ).props; expect( props.selected ).toEqual( selected ); expect( props.products ).toEqual( [ { id: 10, name: 'foo', parent: 0 }, { id: 20, name: 'bar', parent: 0 }, ] ); } ); it( 'debounce and getProducts is called on search event', () => { props = renderer.root.findByType( 'div' ).props; props.onSearch(); expect( debouncedAction ).toHaveBeenCalled(); expect( getProducts ).toHaveBeenCalledTimes( 1 ); } ); it( 'debounce is cancelled on unmount', () => { renderer.unmount(); expect( debouncedCancel ).toHaveBeenCalled(); expect( getProducts ).toHaveBeenCalledTimes( 0 ); } ); } ); } );