woocommerce/plugins/woocommerce-admin/client/customize-store/transitional/test/index.test.tsx

129 lines
2.6 KiB
TypeScript

/* eslint-disable @typescript-eslint/ban-ts-comment */
/**
* External dependencies
*/
import { render, screen } from '@testing-library/react';
import { recordEvent } from '@woocommerce/tracks';
/**
* Internal dependencies
*/
import { Transitional } from '../index';
jest.mock( '../../assembler-hub/site-hub', () => ( {
__esModule: true,
SiteHub: () => {
return <div />;
},
} ) );
jest.mock(
'@wordpress/edit-site/build-module/components/layout/hooks',
() => ( {
__esModule: true,
useIsSiteEditorLoading: jest.fn().mockReturnValue( false ),
} )
);
jest.mock( '@woocommerce/tracks', () => ( { recordEvent: jest.fn() } ) );
describe( 'Transitional', () => {
let props: {
sendEvent: jest.Mock;
};
beforeEach( () => {
props = {
sendEvent: jest.fn(),
};
} );
it( 'should render Transitional page', () => {
// @ts-ignore
render( <Transitional { ...props } /> );
expect(
screen.getByText( /Your store looks great!/i )
).toBeInTheDocument();
expect(
screen.getByRole( 'button', {
name: /View store/i,
} )
).toBeInTheDocument();
expect(
screen.getByRole( 'button', {
name: /Go to Products/i,
} )
).toBeInTheDocument();
expect(
screen.getByRole( 'button', {
name: /Go to the Editor/i,
} )
).toBeInTheDocument();
expect(
screen.getByRole( 'button', {
name: /Back to Home/i,
} )
).toBeInTheDocument();
} );
it( 'should record an event when clicking on "View store" button', () => {
window.open = jest.fn();
// @ts-ignore
render( <Transitional { ...props } /> );
screen
.getByRole( 'button', {
name: /View store/i,
} )
.click();
expect( recordEvent ).toHaveBeenCalledWith(
'customize_your_store_transitional_preview_store_click'
);
} );
it( 'should record an event when clicking on "Go to the Editor" button', () => {
// @ts-ignore Mocking window location
delete window.location;
window.location = {
// @ts-ignore Mocking window location href
href: jest.fn(),
};
// @ts-ignore
render( <Transitional { ...props } /> );
screen
.getByRole( 'button', {
name: /Go to the Editor/i,
} )
.click();
expect( recordEvent ).toHaveBeenCalledWith(
'customize_your_store_transitional_editor_click'
);
} );
it( 'should send GO_BACK_TO_HOME event when clicking on "Back to Home" button', () => {
// @ts-ignore
render( <Transitional { ...props } /> );
screen
.getByRole( 'button', {
name: /Back to Home/i,
} )
.click();
expect( props.sendEvent ).toHaveBeenCalledWith( {
type: 'GO_BACK_TO_HOME',
} );
expect( recordEvent ).toHaveBeenCalledWith(
'customize_your_store_transitional_home_click'
);
} );
} );