@elementor/editor-site-navigation 0.22.7 → 0.23.0

package/src/components/panel/posts-list/__tests__/posts-collapsible-list.test.tsx

@@ -1,248 +0,0 @@
-import * as React from 'react';
-import { fireEvent, screen, waitFor } from '@testing-library/react';
-import PostsCollapsibleList from '../posts-collapsible-list';
-import { createMockDocument, renderWithQuery } from 'test-utils';
-import { PostListContextProvider } from '../../../../contexts/post-list-context';
-import { __useActiveDocument as useActiveDocument } from '@elementor/editor-documents';
-import { usePosts } from '../../../../hooks/use-posts';
-
-const mockMutateAsync = jest.fn();
-jest.mock( '../../../../hooks/use-posts-actions', () => ( {
-	usePostActions: () => ( {
-		createPost: {
-			mutateAsync: mockMutateAsync,
-			isPending: false,
-		},
-		duplicatePost: {
-			mutateAsync: mockMutateAsync,
-			isPending: false,
-		},
-	} ),
-} ) );
-
-jest.mock( '../../../../hooks/use-posts', () => ( {
-	__esModule: true,
-	usePosts: jest.fn( () => ( {
-		isLoading: false,
-		data: {
-			posts: [
-				{
-					id: 1,
-					type: 'page',
-					title: { rendered: 'Home' },
-					status: 'publish',
-					link: 'www.test.demo',
-					user_can: { edit: true, delete: true },
-				},
-				{
-					id: 2,
-					type: 'page',
-					title: { rendered: 'About' },
-					status: 'draft',
-					link: 'www.test.demo',
-					user_can: { edit: true, delete: true },
-				},
-			],
-			total: 2,
-		},
-	} ) ),
-} ) );
-
-jest.mock( '../../../../hooks/use-homepage', () => ( {
-	__esModule: true,
-	useHomepage: jest.fn( () => ( {
-		isLoading: false,
-		data: 1,
-	} ) ),
-} ) );
-
-jest.mock( '@elementor/editor-documents', () => ( {
-	__useActiveDocument: jest.fn(),
-	__useNavigateToDocument: jest.fn(),
-} ) );
-
-jest.mock( '../../../../hooks/use-user', () => ( {
-	default: jest.fn( () => ( {
-		isLoading: false,
-		data: {
-			capabilities: {
-				edit_pages: true,
-			},
-		},
-	} ) ),
-	__esModule: true,
-} ) );
-
-describe( '@elementor/editor-site-navigation - PostsCollapsibleList', () => {
-	beforeEach( () => {
-		jest.mocked( useActiveDocument ).mockReturnValue(
-			createMockDocument( {
-				id: 3,
-			} )
-		);
-	} );
-
-	afterEach( () => {
-		jest.clearAllMocks();
-	} );
-
-	it( 'should render closed list', () => {
-		// Act.
-		renderWithQuery( <PostsCollapsibleList isOpenByDefault={ false } /> );
-
-		// Assert.
-		const label = screen.getByText( `Pages (2)` );
-		expect( label ).toBeInTheDocument();
-
-		const postInList = screen.queryByText( 'Home' );
-		expect( postInList ).not.toBeInTheDocument();
-	} );
-
-	it( 'should render open list with home icon and page status', () => {
-		// Act.
-		renderWithQuery( <PostsCollapsibleList isOpenByDefault={ true } /> );
-
-		// Assert.
-		const items = screen.getAllByRole( 'listitem' );
-
-		expect( items.length ).toBe( 3 );
-
-		// First item is the list title.
-		expect( items[ 0 ] ).toHaveTextContent( `Pages (2)` );
-		expect( items[ 1 ] ).toHaveTextContent( 'Home' );
-		expect( items[ 1 ] ).toHaveTextContent( 'Homepage' ); // Home icon.
-		expect( items[ 2 ] ).toHaveTextContent( 'About' );
-		expect( items[ 2 ] ).toHaveTextContent( '(draft)' );
-	} );
-
-	it( 'should create a new post after clicking "Add New" button', async () => {
-		// Arrange.
-		renderWithQuery(
-			<PostListContextProvider type={ 'page' } setError={ () => {} }>
-				<PostsCollapsibleList isOpenByDefault={ true } />
-			</PostListContextProvider>
-		);
-
-		// Act.
-		const addNewButton = screen.getByRole( 'button', { name: 'Add New' } );
-		fireEvent.click( addNewButton );
-
-		const input = screen.getByRole( 'textbox' );
-
-		if ( ! input || ! ( input instanceof HTMLInputElement ) ) {
-			throw new Error( 'No input field found.' );
-		}
-
-		expect( input ).toHaveValue( 'New Page' );
-
-		fireEvent.change( input, { target: { value: 'New Page Title' } } );
-		fireEvent.blur( input );
-
-		// Assert.
-		waitFor( () => {
-			expect( input ).toHaveAttribute( 'aria-disabled', 'true' );
-		} ).then();
-
-		expect( mockMutateAsync ).toHaveBeenCalledTimes( 1 );
-
-		waitFor( () => {
-			expect( input ).not.toBeInTheDocument();
-		} ).then();
-
-		waitFor( () => {
-			expect( screen.getByText( 'New Page Title' ) ).toBeInTheDocument();
-		} ).then();
-	} );
-
-	it( 'should append a new list item in edit mode, when "Duplicate" action is clicked', () => {
-		// Arrange.
-		renderWithQuery(
-			<PostListContextProvider type={ 'page' } setError={ () => {} }>
-				<PostsCollapsibleList isOpenByDefault={ true } />
-			</PostListContextProvider>
-		);
-
-		// Act.
-		const buttons = screen.getAllByRole( 'button' );
-		fireEvent.click( buttons[ 3 ] ); // Button to open the actions' menu of the first post.
-
-		const duplicateButton = screen.getByRole( 'menuitem', { name: 'Duplicate' } );
-		fireEvent.click( duplicateButton );
-
-		// Assert.
-		waitFor( () => {
-			expect( duplicateButton ).not.toBeInTheDocument();
-		} ).then();
-
-		const input = screen.getByRole( 'textbox' );
-
-		expect( input ).toBeInTheDocument();
-		expect( input ).toHaveValue( 'Home copy' );
-	} );
-
-	it( 'Should not render load button when there is no next page', () => {
-		// Arrange.
-		jest.mocked( usePosts ).mockReturnValue( {
-			hasNextPage: false,
-			isLoading: false,
-			data: {
-				posts: [
-					{
-						id: 1,
-						type: 'page',
-						title: { rendered: 'Home' },
-						status: 'publish',
-						link: 'www.test.demo',
-						user_can: { edit: true, delete: true },
-					},
-					{
-						id: 2,
-						type: 'page',
-						title: { rendered: 'About' },
-						status: 'draft',
-						link: 'www.test.demo',
-						user_can: { edit: true, delete: true },
-					},
-				],
-				total: 2,
-			},
-		} as ReturnType< typeof usePosts > );
-		renderWithQuery( <PostsCollapsibleList isOpenByDefault={ true } /> );
-
-		// Assert.
-		expect( screen.queryByRole( 'button', { name: 'Load More' } ) ).not.toBeInTheDocument();
-	} );
-
-	it( 'Should render load button when there is next page', () => {
-		// Arrange.
-		jest.mocked( usePosts ).mockReturnValue( {
-			hasNextPage: true,
-			isLoading: false,
-			data: {
-				posts: [
-					{
-						id: 1,
-						type: 'page',
-						title: { rendered: 'Home' },
-						status: 'publish',
-						link: 'www.test.demo',
-						user_can: { edit: true, delete: true },
-					},
-					{
-						id: 2,
-						type: 'page',
-						title: { rendered: 'About' },
-						status: 'draft',
-						link: 'www.test.demo',
-						user_can: { edit: true, delete: true },
-					},
-				],
-				total: 2,
-			},
-		} as ReturnType< typeof usePosts > );
-		renderWithQuery( <PostsCollapsibleList isOpenByDefault={ true } /> );
-
-		// Assert.
-		expect( screen.getByRole( 'button', { name: 'Load More' } ) ).toBeInTheDocument();
-	} );
-} );

package/src/components/top-bar/__tests__/add-new-page.test.tsx

@@ -1,129 +0,0 @@
-import * as React from 'react';
-import { fireEvent, render, screen, waitFor } from '@testing-library/react';
-import {
-	__useActiveDocument as useActiveDocument,
-	__useNavigateToDocument as useNavigateToDocument,
-} from '@elementor/editor-documents';
-import RecentlyEdited from '../recently-edited';
-import { createMockDocument } from 'test-utils';
-import useRecentPosts from '../../../hooks/use-recent-posts';
-import useCreatePage from '../../../hooks/use-create-page';
-import { RecentPost } from '../../../types';
-import useUser from '../../../hooks/use-user';
-
-jest.mock( '@elementor/editor-documents', () => ( {
-	__useActiveDocument: jest.fn(),
-	__useHostDocument: jest.fn(),
-	__useNavigateToDocument: jest.fn(),
-} ) );
-
-jest.mock( '../../../hooks/use-recent-posts', () => ( {
-	__esModule: true,
-	default: jest.fn( () => ( { isLoading: false, recentPosts: [] } ) ),
-} ) );
-
-jest.mock( '../../../hooks/use-create-page', () => ( {
-	__esModule: true,
-	default: jest.fn( () => ( { create: jest.fn(), isLoading: false } ) ),
-} ) );
-
-jest.mock( '../../../hooks/use-user', () => ( {
-	default: jest.fn( () => ( {
-		isLoading: false,
-		data: {
-			capabilities: {
-				edit_pages: true,
-			},
-		},
-	} ) ),
-	__esModule: true,
-} ) );
-
-describe( '@elementor/recently-edited - Top bar add new page', () => {
-	beforeEach( () => {
-		jest.mocked( useActiveDocument ).mockReturnValue( createMockDocument() );
-	} );
-
-	afterEach( () => {
-		jest.clearAllMocks();
-	} );
-
-	it( 'should render add new page button', () => {
-		// Arrange.
-		const isLoading = false;
-		const recentPosts: RecentPost[] = [];
-
-		jest.mocked( useRecentPosts ).mockReturnValue( { isLoading, data: recentPosts } as ReturnType<
-			typeof useRecentPosts
-		> );
-
-		render( <RecentlyEdited /> );
-
-		// Act.
-		const buttons = screen.getAllByRole( 'button' );
-		fireEvent.click( buttons[ 0 ] ); // Opens the recently edited menu
-
-		// Assert.
-		const label = screen.getByText( 'Add new page', { exact: false } );
-		expect( label ).toBeInTheDocument();
-	} );
-
-	it( 'should trigger create page hook on click', async () => {
-		// Arrange.
-		const isLoading = false;
-		const recentPosts: RecentPost[] = [];
-		const create = jest.fn().mockReturnValue( Promise.resolve( { id: 123 } ) );
-		const navigateToDocument = jest.fn();
-
-		jest.mocked( useRecentPosts ).mockReturnValue( { isLoading, data: recentPosts } as ReturnType<
-			typeof useRecentPosts
-		> );
-		jest.mocked( useCreatePage ).mockReturnValue( { isLoading, create } );
-		jest.mocked( useNavigateToDocument ).mockReturnValue( navigateToDocument );
-
-		render( <RecentlyEdited /> );
-
-		// Act.
-		const buttons = screen.getAllByRole( 'button' );
-		fireEvent.click( buttons[ 0 ] ); // Opens the recently edited menu
-
-		const addNewPage = screen.getByText( 'Add new page', { exact: false } );
-		fireEvent.click( addNewPage );
-
-		// Assert.
-		expect( create ).toHaveBeenCalledTimes( 1 );
-
-		await waitFor( () => expect( navigateToDocument ).toHaveBeenCalledTimes( 1 ) );
-
-		expect( navigateToDocument ).toHaveBeenCalledWith( 123 );
-	} );
-
-	it( 'should be disabled if user does not have edit_posts capability', () => {
-		// Arrange.
-		jest.mocked( useUser ).mockReturnValue( {
-			isLoading: false,
-			data: {
-				capabilities: {
-					edit_pages: false,
-				},
-			},
-		} as unknown as ReturnType< typeof useUser > );
-
-		const isLoading = false;
-		const recentPosts: RecentPost[] = [];
-
-		jest.mocked( useRecentPosts ).mockReturnValue( { isLoading, data: recentPosts } as ReturnType<
-			typeof useRecentPosts
-		> );
-
-		render( <RecentlyEdited /> );
-
-		// Act.
-		const buttons = screen.getAllByRole( 'button' );
-		fireEvent.click( buttons[ 0 ] ); // Opens the recently edited menu
-
-		// Assert.
-		const addNewPage = screen.getByRole( 'menuitem', { name: /Add new page/i } );
-		expect( addNewPage ).toHaveAttribute( 'aria-disabled', 'true' );
-	} );
-} );