@wordpress/block-directory 3.0.1 → 3.0.5

package/src/store/test/actions.js

@@ -1,21 +1,60 @@
 /**
  * WordPress dependencies
  */
+import { createRegistry } from '@wordpress/data';
 import { store as blocksStore } from '@wordpress/blocks';
 import { store as noticesStore } from '@wordpress/notices';
+import apiFetch from '@wordpress/api-fetch';
 
 /**
  * Internal dependencies
  */
-import { installBlockType, uninstallBlockType } from '../actions';
+import { loadAssets } from '../load-assets';
+import { store as blockDirectoryStore } from '..';
+
+jest.mock( '@wordpress/api-fetch', () => ( {
+	__esModule: true,
+	default: jest.fn(),
+} ) );
+
+jest.mock( '../load-assets', () => ( {
+	loadAssets: jest.fn(),
+} ) );
+
+function createRegistryWithStores() {
+	// create a registry and register stores
+	const registry = createRegistry();
+
+	registry.register( blockDirectoryStore );
+	registry.register( noticesStore );
+	registry.register( blocksStore );
+
+	return registry;
+}
+
+// mock the `loadAssets` function. The real function would load the installed
+// block's script assets, which in turn register the block. That registration
+// call is the only thing we need to mock.
+function loadAssetsMock( registry ) {
+	return async function () {
+		registry
+			.dispatch( blocksStore )
+			.addBlockTypes( [ { name: 'block/block' } ] );
+	};
+}
+
+function blockWithLinks( block, links ) {
+	return { ...block, links: { ...block.links, ...links } };
+}
 
 describe( 'actions', () => {
 	const pluginEndpoint =
-		'https://example.com/wp-json/wp/v2/plugins/block/block';
-	const item = {
-		id: 'block/block',
-		name: 'Test Block',
-		assets: [ 'script.js' ],
+		'https://example.com/wp-json/wp/v2/plugins/block-block';
+
+	const block = {
+		id: 'block-block',
+		name: 'block/block',
+		title: 'Test Block',
 		links: {
 			'wp:install-plugin': [
 				{
@@ -25,288 +64,218 @@ describe( 'actions', () => {
 			],
 		},
 	};
-	const plugin = {
+
+	const pluginResponse = {
 		plugin: 'block/block.php',
 		status: 'active',
 		name: 'Test Block',
 		version: '1.0.0',
 		_links: {
-			self: [
-				{
-					href: pluginEndpoint,
-				},
-			],
+			self: [ { href: pluginEndpoint } ],
 		},
 	};
 
 	describe( 'installBlockType', () => {
-		const block = item;
-		it( 'should install a block successfully', () => {
-			const generator = installBlockType( block );
-
-			expect( generator.next().value ).toEqual( {
-				type: 'CLEAR_ERROR_NOTICE',
-				blockId: block.id,
-			} );
-
-			expect( generator.next().value ).toEqual( {
-				type: 'SET_INSTALLING_BLOCK',
-				blockId: block.id,
-				isInstalling: true,
-			} );
-
-			expect( generator.next().value ).toMatchObject( {
-				type: 'API_FETCH',
-				request: {
-					path: 'wp/v2/plugins',
-					method: 'POST',
-				},
-			} );
-
-			expect( generator.next( plugin ).value ).toEqual( {
-				type: 'ADD_INSTALLED_BLOCK_TYPE',
-				item: {
-					...block,
-					links: {
-						...block.links,
-						self: [
-							{
-								href: pluginEndpoint,
-							},
-						],
-					},
-				},
-			} );
-
-			expect( generator.next().value ).toEqual( {
-				type: 'LOAD_ASSETS',
-				assets: block.assets,
-			} );
-
-			expect( generator.next().value ).toEqual( {
-				args: [],
-				selectorName: 'getBlockTypes',
-				storeKey: blocksStore.name,
-				type: '@@data/SELECT',
-			} );
-
-			expect( generator.next( [ block ] ).value ).toMatchObject( {
-				type: '@@data/DISPATCH',
-				actionName: 'createInfoNotice',
-				storeKey: noticesStore,
-			} );
-
-			expect( generator.next().value ).toEqual( {
-				type: 'SET_INSTALLING_BLOCK',
-				blockId: block.id,
-				isInstalling: false,
-			} );
-
-			expect( generator.next() ).toEqual( {
-				value: true,
-				done: true,
-			} );
+		it( 'should install a block successfully', async () => {
+			const registry = createRegistryWithStores();
+
+			// mock the api-fetch and load-assets modules
+			apiFetch.mockImplementation( async ( { path } ) => {
+				switch ( path ) {
+					case 'wp/v2/plugins':
+						return pluginResponse;
+					default:
+						throw new Error( `unexpected API endpoint: ${ path }` );
+				}
+			} );
+
+			loadAssets.mockImplementation( loadAssetsMock( registry ) );
+
+			// install the block
+			await registry
+				.dispatch( blockDirectoryStore )
+				.installBlockType( block );
+
+			// check that blocks store contains the new block
+			const registeredBlock = registry
+				.select( blocksStore )
+				.getBlockType( 'block/block' );
+			expect( registeredBlock ).toBeTruthy();
+
+			// check that the block-directory store contains the new block, too
+			const installedBlockTypes = registry
+				.select( blockDirectoryStore )
+				.getInstalledBlockTypes();
+			expect( installedBlockTypes ).toMatchObject( [
+				{ name: 'block/block' },
+			] );
+
+			// check that notice was displayed
+			const notices = registry.select( noticesStore ).getNotices();
+			expect( notices ).toMatchObject( [
+				{ content: 'Block Test Block installed and added.' },
+			] );
 		} );
 
-		it( 'should activate an inactive block plugin successfully', () => {
-			const inactiveBlock = {
-				...block,
-				links: {
-					...block.links,
-					'wp:plugin': [
-						{
-							href: pluginEndpoint,
-						},
-					],
-				},
-			};
-			const generator = installBlockType( inactiveBlock );
-
-			expect( generator.next().value ).toEqual( {
-				type: 'CLEAR_ERROR_NOTICE',
-				blockId: inactiveBlock.id,
-			} );
-
-			expect( generator.next().value ).toEqual( {
-				type: 'SET_INSTALLING_BLOCK',
-				blockId: inactiveBlock.id,
-				isInstalling: true,
-			} );
-
-			expect( generator.next().value ).toMatchObject( {
-				type: 'API_FETCH',
-				request: {
-					url: pluginEndpoint,
-					method: 'PUT',
-				},
-			} );
-
-			expect( generator.next( plugin ).value ).toEqual( {
-				type: 'ADD_INSTALLED_BLOCK_TYPE',
-				item: inactiveBlock,
-			} );
-
-			expect( generator.next().value ).toEqual( {
-				type: 'LOAD_ASSETS',
-				assets: inactiveBlock.assets,
-			} );
-
-			expect( generator.next().value ).toEqual( {
-				args: [],
-				selectorName: 'getBlockTypes',
-				storeKey: blocksStore.name,
-				type: '@@data/SELECT',
-			} );
-
-			expect( generator.next( [ inactiveBlock ] ).value ).toMatchObject( {
-				type: '@@data/DISPATCH',
-				actionName: 'createInfoNotice',
-				storeKey: noticesStore,
-			} );
-
-			expect( generator.next().value ).toEqual( {
-				type: 'SET_INSTALLING_BLOCK',
-				blockId: inactiveBlock.id,
-				isInstalling: false,
-			} );
-
-			expect( generator.next() ).toEqual( {
-				value: true,
-				done: true,
-			} );
+		it( 'should activate an inactive block plugin successfully', async () => {
+			const registry = createRegistryWithStores();
+
+			// mock the api-fetch and load-assets modules
+			apiFetch.mockImplementation( async ( p ) => {
+				const { url } = p;
+				switch ( url ) {
+					case pluginEndpoint:
+						return pluginResponse;
+					default:
+						throw new Error( `unexpected API endpoint: ${ url }` );
+				}
+			} );
+
+			loadAssets.mockImplementation( loadAssetsMock( registry ) );
+
+			// install the block
+			await registry.dispatch( blockDirectoryStore ).installBlockType(
+				blockWithLinks( block, {
+					'wp:plugin': [ { href: pluginEndpoint } ],
+				} )
+			);
+
+			// check that blocks store contains the new block
+			const registeredBlock = registry
+				.select( blocksStore )
+				.getBlockType( 'block/block' );
+			expect( registeredBlock ).toBeTruthy();
+
+			// check that notice was displayed
+			const notices = registry.select( noticesStore ).getNotices();
+			expect( notices ).toMatchObject( [
+				{ content: 'Block Test Block installed and added.' },
+			] );
 		} );
 
-		it( "should set an error if the plugin can't install", () => {
-			const generator = installBlockType( block );
-
-			expect( generator.next().value ).toEqual( {
-				type: 'CLEAR_ERROR_NOTICE',
-				blockId: block.id,
-			} );
-
-			expect( generator.next().value ).toEqual( {
-				type: 'SET_INSTALLING_BLOCK',
-				blockId: block.id,
-				isInstalling: true,
-			} );
-
-			expect( generator.next().value ).toMatchObject( {
-				type: 'API_FETCH',
-				request: {
-					path: 'wp/v2/plugins',
-					method: 'POST',
-				},
-			} );
-
-			const apiError = {
-				code: 'plugins_api_failed',
-				message: 'Plugin not found.',
-				data: null,
-			};
-			expect( generator.throw( apiError ).value ).toMatchObject( {
-				type: 'SET_ERROR_NOTICE',
-				blockId: block.id,
-			} );
-
-			expect( generator.next().value ).toMatchObject( {
-				type: '@@data/DISPATCH',
-				actionName: 'createErrorNotice',
-				storeKey: noticesStore,
-			} );
-
-			expect( generator.next().value ).toEqual( {
-				type: 'SET_INSTALLING_BLOCK',
-				blockId: block.id,
-				isInstalling: false,
-			} );
-
-			expect( generator.next() ).toEqual( {
-				value: false,
-				done: true,
-			} );
+		it( "should set an error if the plugin can't install", async () => {
+			const registry = createRegistryWithStores();
+
+			// mock the api-fetch and load-assets modules
+			apiFetch.mockImplementation( async ( { path } ) => {
+				switch ( path ) {
+					case 'wp/v2/plugins':
+						throw {
+							code: 'plugins_api_failed',
+							message: 'Plugin not found.',
+							data: null,
+						};
+					default:
+						throw new Error( `unexpected API endpoint: ${ path }` );
+				}
+			} );
+
+			loadAssets.mockImplementation( loadAssetsMock( registry ) );
+
+			// install the block
+			await registry
+				.dispatch( blockDirectoryStore )
+				.installBlockType( block );
+
+			// check that blocks store doesn't contain the new block
+			const registeredBlock = registry
+				.select( blocksStore )
+				.getBlockType( 'block/block' );
+			expect( registeredBlock ).toBeUndefined();
+
+			// check that error notice was displayed
+			const notices = registry.select( noticesStore ).getNotices();
+			expect( notices ).toMatchObject( [
+				{ content: 'Plugin not found.' },
+			] );
 		} );
 	} );
 
 	describe( 'uninstallBlockType', () => {
-		const block = {
-			...item,
-			links: {
-				...item.links,
-				self: [
-					{
-						href: pluginEndpoint,
-					},
-				],
-			},
-		};
-
-		it( 'should uninstall a block successfully', () => {
-			const generator = uninstallBlockType( block );
-
-			// First the deactivation step
-			expect( generator.next().value ).toMatchObject( {
-				type: 'API_FETCH',
-				request: {
-					url: pluginEndpoint,
-					method: 'PUT',
-				},
-			} );
-
-			// Then the deletion step
-			expect( generator.next().value ).toMatchObject( {
-				type: 'API_FETCH',
-				request: {
-					url: pluginEndpoint,
-					method: 'DELETE',
-				},
-			} );
-
-			expect( generator.next().value ).toEqual( {
-				type: 'REMOVE_INSTALLED_BLOCK_TYPE',
-				item: block,
-			} );
-
-			expect( generator.next() ).toEqual( {
-				value: undefined,
-				done: true,
-			} );
+		const installedBlock = blockWithLinks( block, {
+			self: [ { href: pluginEndpoint } ],
 		} );
 
-		it( "should set a global notice if the plugin can't be deleted", () => {
-			const generator = uninstallBlockType( block );
-
-			expect( generator.next().value ).toMatchObject( {
-				type: 'API_FETCH',
-				request: {
-					url: pluginEndpoint,
-					method: 'PUT',
-				},
-			} );
+		it( 'should uninstall a block successfully', async () => {
+			const registry = createRegistryWithStores();
+
+			apiFetch.mockImplementation( async ( { url, method } ) => {
+				switch ( url ) {
+					case pluginEndpoint:
+						switch ( method ) {
+							case 'PUT':
+							case 'DELETE':
+								return;
+							default:
+								throw new Error(
+									`unexpected API endpoint method: ${ method }`
+								);
+						}
+					default:
+						throw new Error( `unexpected API endpoint: ${ url }` );
+				}
+			} );
+
+			// add installed block type that we're going to uninstall
+			registry
+				.dispatch( blockDirectoryStore )
+				.addInstalledBlockType( installedBlock );
+
+			// uninstall the block
+			await registry
+				.dispatch( blockDirectoryStore )
+				.uninstallBlockType( installedBlock );
+
+			// check that no error notice was displayed
+			const notices = registry.select( noticesStore ).getNotices();
+			expect( notices ).toEqual( [] );
+
+			// verify that the block was uninstalled
+			const installedBlockTypes = registry
+				.select( blockDirectoryStore )
+				.getInstalledBlockTypes();
+			expect( installedBlockTypes ).toEqual( [] );
+		} );
 
-			expect( generator.next().value ).toMatchObject( {
-				type: 'API_FETCH',
-				request: {
-					url: pluginEndpoint,
-					method: 'DELETE',
+		it( "should set a global notice if the plugin can't be deleted", async () => {
+			const registry = createRegistryWithStores();
+
+			apiFetch.mockImplementation( async ( { url, method } ) => {
+				switch ( url ) {
+					case pluginEndpoint:
+						switch ( method ) {
+							case 'PUT':
+								return;
+							case 'DELETE':
+								throw {
+									code: 'rest_cannot_delete_active_plugin',
+									message:
+										'Cannot delete an active plugin. Please deactivate it first.',
+									data: null,
+								};
+							default:
+								throw new Error(
+									`unexpected API endpoint method: ${ method }`
+								);
+						}
+					default:
+						throw new Error( `unexpected API endpoint: ${ url }` );
+				}
+			} );
+
+			// uninstall the block
+			await registry
+				.dispatch( blockDirectoryStore )
+				.uninstallBlockType( installedBlock );
+
+			// check that error notice was displayed
+			const notices = registry.select( noticesStore ).getNotices();
+			expect( notices ).toMatchObject( [
+				{
+					content:
+						'Cannot delete an active plugin. Please deactivate it first.',
 				},
-			} );
-
-			const apiError = {
-				code: 'rest_cannot_delete_active_plugin',
-				message:
-					'Cannot delete an active plugin. Please deactivate it first.',
-				data: null,
-			};
-			expect( generator.throw( apiError ).value ).toMatchObject( {
-				type: '@@data/DISPATCH',
-				actionName: 'createErrorNotice',
-				storeKey: noticesStore,
-			} );
-
-			expect( generator.next() ).toEqual( {
-				value: undefined,
-				done: true,
-			} );
+			] );
 		} );
 	} );
 } );

package/src/store/test/{controls.js → load-assets.js}

@@ -1,7 +1,7 @@
 /**
  * Internal dependencies
  */
-import { loadAsset } from '../controls';
+import { loadAsset } from '../load-assets';
 
 describe( 'controls', () => {
 	describe( 'loadAsset', () => {

package/build/store/controls.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["@wordpress/block-directory/src/store/controls.js"],"names":["loadAsset","el","Promise","resolve","reject","newNode","document","createElement","nodeName","forEach","attr","innerHTML","appendChild","createTextNode","onload","onerror","Error","body","toLowerCase","src","loadAssets","assets","type","controls","LOAD_ASSETS","response","url","location","href","parse","data","text","doc","window","DOMParser","parseFromString","newAssets","Array","from","querySelectorAll","filter","asset","id","getElementById","newAsset"],"mappings":";;;;;;;;;;AAGA;;AAHA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMA,SAAS,GAAKC,EAAF,IAAU;AAClC,SAAO,IAAIC,OAAJ,CAAa,CAAEC,OAAF,EAAWC,MAAX,KAAuB;AAC1C;AACF;AACA;AACA;AACE,UAAMC,OAAO,GAAGC,QAAQ,CAACC,aAAT,CAAwBN,EAAE,CAACO,QAA3B,CAAhB;AAEA,KAAE,IAAF,EAAQ,KAAR,EAAe,KAAf,EAAsB,MAAtB,EAA8B,MAA9B,EAAuCC,OAAvC,CAAkDC,IAAF,IAAY;AAC3D,UAAKT,EAAE,CAAES,IAAF,CAAP,EAAkB;AACjBL,QAAAA,OAAO,CAAEK,IAAF,CAAP,GAAkBT,EAAE,CAAES,IAAF,CAApB;AACA;AACD,KAJD,EAP0C,CAa1C;;AACA,QAAKT,EAAE,CAACU,SAAR,EAAoB;AACnBN,MAAAA,OAAO,CAACO,WAAR,CAAqBN,QAAQ,CAACO,cAAT,CAAyBZ,EAAE,CAACU,SAA5B,CAArB;AACA;;AAEDN,IAAAA,OAAO,CAACS,MAAR,GAAiB,MAAMX,OAAO,CAAE,IAAF,CAA9B;;AACAE,IAAAA,OAAO,CAACU,OAAR,GAAkB,MAAMX,MAAM,CAAE,IAAIY,KAAJ,CAAW,sBAAX,CAAF,CAA9B;;AAEAV,IAAAA,QAAQ,CAACW,IAAT,CAAcL,WAAd,CAA2BP,OAA3B,EArB0C,CAuB1C;;AACA,QACC,WAAWA,OAAO,CAACG,QAAR,CAAiBU,WAAjB,EAAX,IACE,aAAab,OAAO,CAACG,QAAR,CAAiBU,WAAjB,EAAb,IAA+C,CAAEb,OAAO,CAACc,GAF5D,EAGE;AACDhB,MAAAA,OAAO;AACP;AACD,GA9BM,CAAP;AA+BA,CAhCM;AAkCP;AACA;AACA;AACA;AACA;AACA;AACA;;;;;AACO,SAASiB,UAAT,CAAqBC,MAArB,EAA8B;AACpC,SAAO;AACNC,IAAAA,IAAI,EAAE,aADA;AAEND,IAAAA;AAFM,GAAP;AAIA;;AAED,MAAME,QAAQ,GAAG;AAChB,QAAMC,WAAN,GAAoB;AACnB;AACF;AACA;AACA;AACA;AACA;AACA;AACE,UAAMC,QAAQ,GAAG,MAAM,uBAAU;AAChCC,MAAAA,GAAG,EAAEpB,QAAQ,CAACqB,QAAT,CAAkBC,IADS;AAEhCC,MAAAA,KAAK,EAAE;AAFyB,KAAV,CAAvB;AAKA,UAAMC,IAAI,GAAG,MAAML,QAAQ,CAACM,IAAT,EAAnB;AAEA,UAAMC,GAAG,GAAG,IAAIC,MAAM,CAACC,SAAX,GAAuBC,eAAvB,CAAwCL,IAAxC,EAA8C,WAA9C,CAAZ;AAEA,UAAMM,SAAS,GAAGC,KAAK,CAACC,IAAN,CACjBN,GAAG,CAACO,gBAAJ,CAAsB,+BAAtB,CADiB,EAEhBC,MAFgB,CAGfC,KAAF,IAAaA,KAAK,CAACC,EAAN,IAAY,CAAEpC,QAAQ,CAACqC,cAAT,CAAyBF,KAAK,CAACC,EAA/B,CAHV,CAAlB;AAMA;AACF;AACA;AACA;;AACE,SAAM,MAAME,QAAZ,IAAwBR,SAAxB,EAAoC;AACnC,YAAMpC,SAAS,CAAE4C,QAAF,CAAf;AACA;AACD;;AA/Be,CAAjB;eAkCerB,Q","sourcesContent":["/**\n * WordPress dependencies\n */\nimport apiFetch from '@wordpress/api-fetch';\n\n/**\n * Load an asset for a block.\n *\n * This function returns a Promise that will resolve once the asset is loaded,\n * or in the case of Stylesheets and Inline JavaScript, will resolve immediately.\n *\n * @param {HTMLElement} el A HTML Element asset to inject.\n *\n * @return {Promise} Promise which will resolve when the asset is loaded.\n */\nexport const loadAsset = ( el ) => {\n\treturn new Promise( ( resolve, reject ) => {\n\t\t/*\n\t\t * Reconstruct the passed element, this is required as inserting the Node directly\n\t\t * won't always fire the required onload events, even if the asset wasn't already loaded.\n\t\t */\n\t\tconst newNode = document.createElement( el.nodeName );\n\n\t\t[ 'id', 'rel', 'src', 'href', 'type' ].forEach( ( attr ) => {\n\t\t\tif ( el[ attr ] ) {\n\t\t\t\tnewNode[ attr ] = el[ attr ];\n\t\t\t}\n\t\t} );\n\n\t\t// Append inline <script> contents.\n\t\tif ( el.innerHTML ) {\n\t\t\tnewNode.appendChild( document.createTextNode( el.innerHTML ) );\n\t\t}\n\n\t\tnewNode.onload = () => resolve( true );\n\t\tnewNode.onerror = () => reject( new Error( 'Error loading asset.' ) );\n\n\t\tdocument.body.appendChild( newNode );\n\n\t\t// Resolve Stylesheets and Inline JavaScript immediately.\n\t\tif (\n\t\t\t'link' === newNode.nodeName.toLowerCase() ||\n\t\t\t( 'script' === newNode.nodeName.toLowerCase() && ! newNode.src )\n\t\t) {\n\t\t\tresolve();\n\t\t}\n\t} );\n};\n\n/**\n * Load the asset files for a block\n *\n * @param {Array} assets A collection of URLs for the assets.\n *\n * @return {Object} Control descriptor.\n */\nexport function loadAssets( assets ) {\n\treturn {\n\t\ttype: 'LOAD_ASSETS',\n\t\tassets,\n\t};\n}\n\nconst controls = {\n\tasync LOAD_ASSETS() {\n\t\t/*\n\t\t * Fetch the current URL (post-new.php, or post.php?post=1&action=edit) and compare the\n\t\t * JavaScript and CSS assets loaded between the pages. This imports the required assets\n\t\t * for the block into the current page while not requiring that we know them up-front.\n\t\t * In the future this can be improved by reliance upon block.json and/or a script-loader\n\t\t * dependency API.\n\t\t */\n\t\tconst response = await apiFetch( {\n\t\t\turl: document.location.href,\n\t\t\tparse: false,\n\t\t} );\n\n\t\tconst data = await response.text();\n\n\t\tconst doc = new window.DOMParser().parseFromString( data, 'text/html' );\n\n\t\tconst newAssets = Array.from(\n\t\t\tdoc.querySelectorAll( 'link[rel=\"stylesheet\"],script' )\n\t\t).filter(\n\t\t\t( asset ) => asset.id && ! document.getElementById( asset.id )\n\t\t);\n\n\t\t/*\n\t\t * Load each asset in order, as they may depend upon an earlier loaded script.\n\t\t * Stylesheets and Inline Scripts will resolve immediately upon insertion.\n\t\t */\n\t\tfor ( const newAsset of newAssets ) {\n\t\t\tawait loadAsset( newAsset );\n\t\t}\n\t},\n};\n\nexport default controls;\n"]}

package/build-module/store/controls.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["@wordpress/block-directory/src/store/controls.js"],"names":["apiFetch","loadAsset","el","Promise","resolve","reject","newNode","document","createElement","nodeName","forEach","attr","innerHTML","appendChild","createTextNode","onload","onerror","Error","body","toLowerCase","src","loadAssets","assets","type","controls","LOAD_ASSETS","response","url","location","href","parse","data","text","doc","window","DOMParser","parseFromString","newAssets","Array","from","querySelectorAll","filter","asset","id","getElementById","newAsset"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,QAAP,MAAqB,sBAArB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMC,SAAS,GAAKC,EAAF,IAAU;AAClC,SAAO,IAAIC,OAAJ,CAAa,CAAEC,OAAF,EAAWC,MAAX,KAAuB;AAC1C;AACF;AACA;AACA;AACE,UAAMC,OAAO,GAAGC,QAAQ,CAACC,aAAT,CAAwBN,EAAE,CAACO,QAA3B,CAAhB;AAEA,KAAE,IAAF,EAAQ,KAAR,EAAe,KAAf,EAAsB,MAAtB,EAA8B,MAA9B,EAAuCC,OAAvC,CAAkDC,IAAF,IAAY;AAC3D,UAAKT,EAAE,CAAES,IAAF,CAAP,EAAkB;AACjBL,QAAAA,OAAO,CAAEK,IAAF,CAAP,GAAkBT,EAAE,CAAES,IAAF,CAApB;AACA;AACD,KAJD,EAP0C,CAa1C;;AACA,QAAKT,EAAE,CAACU,SAAR,EAAoB;AACnBN,MAAAA,OAAO,CAACO,WAAR,CAAqBN,QAAQ,CAACO,cAAT,CAAyBZ,EAAE,CAACU,SAA5B,CAArB;AACA;;AAEDN,IAAAA,OAAO,CAACS,MAAR,GAAiB,MAAMX,OAAO,CAAE,IAAF,CAA9B;;AACAE,IAAAA,OAAO,CAACU,OAAR,GAAkB,MAAMX,MAAM,CAAE,IAAIY,KAAJ,CAAW,sBAAX,CAAF,CAA9B;;AAEAV,IAAAA,QAAQ,CAACW,IAAT,CAAcL,WAAd,CAA2BP,OAA3B,EArB0C,CAuB1C;;AACA,QACC,WAAWA,OAAO,CAACG,QAAR,CAAiBU,WAAjB,EAAX,IACE,aAAab,OAAO,CAACG,QAAR,CAAiBU,WAAjB,EAAb,IAA+C,CAAEb,OAAO,CAACc,GAF5D,EAGE;AACDhB,MAAAA,OAAO;AACP;AACD,GA9BM,CAAP;AA+BA,CAhCM;AAkCP;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASiB,UAAT,CAAqBC,MAArB,EAA8B;AACpC,SAAO;AACNC,IAAAA,IAAI,EAAE,aADA;AAEND,IAAAA;AAFM,GAAP;AAIA;AAED,MAAME,QAAQ,GAAG;AAChB,QAAMC,WAAN,GAAoB;AACnB;AACF;AACA;AACA;AACA;AACA;AACA;AACE,UAAMC,QAAQ,GAAG,MAAM1B,QAAQ,CAAE;AAChC2B,MAAAA,GAAG,EAAEpB,QAAQ,CAACqB,QAAT,CAAkBC,IADS;AAEhCC,MAAAA,KAAK,EAAE;AAFyB,KAAF,CAA/B;AAKA,UAAMC,IAAI,GAAG,MAAML,QAAQ,CAACM,IAAT,EAAnB;AAEA,UAAMC,GAAG,GAAG,IAAIC,MAAM,CAACC,SAAX,GAAuBC,eAAvB,CAAwCL,IAAxC,EAA8C,WAA9C,CAAZ;AAEA,UAAMM,SAAS,GAAGC,KAAK,CAACC,IAAN,CACjBN,GAAG,CAACO,gBAAJ,CAAsB,+BAAtB,CADiB,EAEhBC,MAFgB,CAGfC,KAAF,IAAaA,KAAK,CAACC,EAAN,IAAY,CAAEpC,QAAQ,CAACqC,cAAT,CAAyBF,KAAK,CAACC,EAA/B,CAHV,CAAlB;AAMA;AACF;AACA;AACA;;AACE,SAAM,MAAME,QAAZ,IAAwBR,SAAxB,EAAoC;AACnC,YAAMpC,SAAS,CAAE4C,QAAF,CAAf;AACA;AACD;;AA/Be,CAAjB;AAkCA,eAAerB,QAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport apiFetch from '@wordpress/api-fetch';\n\n/**\n * Load an asset for a block.\n *\n * This function returns a Promise that will resolve once the asset is loaded,\n * or in the case of Stylesheets and Inline JavaScript, will resolve immediately.\n *\n * @param {HTMLElement} el A HTML Element asset to inject.\n *\n * @return {Promise} Promise which will resolve when the asset is loaded.\n */\nexport const loadAsset = ( el ) => {\n\treturn new Promise( ( resolve, reject ) => {\n\t\t/*\n\t\t * Reconstruct the passed element, this is required as inserting the Node directly\n\t\t * won't always fire the required onload events, even if the asset wasn't already loaded.\n\t\t */\n\t\tconst newNode = document.createElement( el.nodeName );\n\n\t\t[ 'id', 'rel', 'src', 'href', 'type' ].forEach( ( attr ) => {\n\t\t\tif ( el[ attr ] ) {\n\t\t\t\tnewNode[ attr ] = el[ attr ];\n\t\t\t}\n\t\t} );\n\n\t\t// Append inline <script> contents.\n\t\tif ( el.innerHTML ) {\n\t\t\tnewNode.appendChild( document.createTextNode( el.innerHTML ) );\n\t\t}\n\n\t\tnewNode.onload = () => resolve( true );\n\t\tnewNode.onerror = () => reject( new Error( 'Error loading asset.' ) );\n\n\t\tdocument.body.appendChild( newNode );\n\n\t\t// Resolve Stylesheets and Inline JavaScript immediately.\n\t\tif (\n\t\t\t'link' === newNode.nodeName.toLowerCase() ||\n\t\t\t( 'script' === newNode.nodeName.toLowerCase() && ! newNode.src )\n\t\t) {\n\t\t\tresolve();\n\t\t}\n\t} );\n};\n\n/**\n * Load the asset files for a block\n *\n * @param {Array} assets A collection of URLs for the assets.\n *\n * @return {Object} Control descriptor.\n */\nexport function loadAssets( assets ) {\n\treturn {\n\t\ttype: 'LOAD_ASSETS',\n\t\tassets,\n\t};\n}\n\nconst controls = {\n\tasync LOAD_ASSETS() {\n\t\t/*\n\t\t * Fetch the current URL (post-new.php, or post.php?post=1&action=edit) and compare the\n\t\t * JavaScript and CSS assets loaded between the pages. This imports the required assets\n\t\t * for the block into the current page while not requiring that we know them up-front.\n\t\t * In the future this can be improved by reliance upon block.json and/or a script-loader\n\t\t * dependency API.\n\t\t */\n\t\tconst response = await apiFetch( {\n\t\t\turl: document.location.href,\n\t\t\tparse: false,\n\t\t} );\n\n\t\tconst data = await response.text();\n\n\t\tconst doc = new window.DOMParser().parseFromString( data, 'text/html' );\n\n\t\tconst newAssets = Array.from(\n\t\t\tdoc.querySelectorAll( 'link[rel=\"stylesheet\"],script' )\n\t\t).filter(\n\t\t\t( asset ) => asset.id && ! document.getElementById( asset.id )\n\t\t);\n\n\t\t/*\n\t\t * Load each asset in order, as they may depend upon an earlier loaded script.\n\t\t * Stylesheets and Inline Scripts will resolve immediately upon insertion.\n\t\t */\n\t\tfor ( const newAsset of newAssets ) {\n\t\t\tawait loadAsset( newAsset );\n\t\t}\n\t},\n};\n\nexport default controls;\n"]}