/**
 * WordPress dependencies
 */
import { visitAdminPage, createNewPost, searchForBlock } from '@wordpress/e2e-test-utils';

/**
 * Internal dependencies
 */
import { activateExperience, deactivateExperience, openTemplateInserter, searchForBlock as searchForStoryBlock } from '../../utils';

describe( 'Story Templates', () => {
	describe( 'Stories experience disabled', () => {
		it( 'should hide story templates from the reusable blocks management screen', async () => {
			await visitAdminPage( 'edit.php', 'post_type=wp_block' );

			await expect( page ).toMatchElement( '.no-items' );
		} );

		it( 'should hide story templates in the regular block editor', async () => {
			await createNewPost();
			await searchForBlock( 'Template' );

			await expect( page ).toMatchElement( '.block-editor-inserter__no-results' );
		} );
	} );

	describe( 'Stories experience enabled', () => {
		beforeAll( async () => {
			await activateExperience( 'stories' );
		} );

		afterAll( async () => {
			await deactivateExperience( 'stories' );
		} );

		it( 'should hide story templates from the reusable blocks management screen', async () => {
			await visitAdminPage( 'edit.php', 'post_type=wp_block' );

			await expect( page ).toMatchElement( '.no-items' );
		} );

		it( 'should hide story templates in the regular block editor inserter', async () => {
			await createNewPost();
			await searchForBlock( 'Template' );

			await expect( page ).toMatchElement( '.block-editor-inserter__no-results' );
		} );

		it( 'should hide story templates in the stories editor inserter', async () => {
			await createNewPost( { postType: 'amp_story' } );
			await searchForStoryBlock( 'Template' );

			await expect( page ).toMatchElement( '.block-editor-inserter__no-results' );
		} );

		it( 'should load story templates in the stories editor', async () => {
			await createNewPost( { postType: 'amp_story' } );

			await openTemplateInserter();

			const numberOfTemplates = await page.$$eval( '.block-editor-block-preview', ( templates ) => templates.length );
			expect( numberOfTemplates ).toStrictEqual( 11 ); // 10 default templates plus the empty page.
		} );
	} );
} );

@@ -2140,24 +2140,1468 @@
 page.%0A%09%09%7D );
+%0A%0A%09%09it( 'should insert the correct blocks and as skeletons when clicking on a template', async () =%3E %7B%0A%09%09%09await createNewPost( %7B postType: 'amp_story' %7D );%0A%0A%09%09%09await openTemplateInserter();%0A%0A%09%09%09const nodes = await page.$x(%0A%09%09%09%09'//*%5Bcontains(@class,%22block-editor-block-preview%22)%5D'%0A%09%09%09);%0A%0A%09%09%09// Click on the template including quote and image.%0A%09%09%09await nodes%5B 3 %5D.click();%0A%0A%09%09%09const numberOfQuotes = await page.$$eval( '.amp-page-active .wp-block-quote', ( elements ) =%3E elements.length );%0A%09%09%09expect( numberOfQuotes ).toStrictEqual( 1 );%0A%0A%09%09%09const numberOfImages = await page.$$eval( '.amp-page-active .wp-block-image', ( elements ) =%3E elements.length );%0A%09%09%09expect( numberOfImages ).toStrictEqual( 1 );%0A%0A%09%09%09// Verify that only 2 child blocks were added.%0A%09%09%09const numberOfBlocks = await page.$$eval( '.amp-page-active .wp-block.editor-block-list__block', ( elements ) =%3E elements.length );%0A%09%09%09expect( numberOfBlocks ).toStrictEqual( 2 );%0A%0A%09%09%09// Verify that the image is added empty, as placeholder.%0A%09%09%09const placeholderImages = await page.$$eval( '.amp-page-active .wp-block-image.block-editor-media-placeholder', ( elements ) =%3E elements.length );%0A%09%09%09expect( placeholderImages ).toStrictEqual( 1 );%0A%0A%09%09%09// Verify that the block is not added with style.%0A%09%09%09const defaultStyledQuote = await page.$$eval( '.amp-page-active .wp-block-quote.is-style-white', ( elements ) =%3E elements.length );%0A%09%09%09expect( defaultStyledQuote ).toStrictEqual( 0 );%0A%09%09%7D );
 %0A%09%7D );%0A%7D );%0A

Add some basic template functionality test.