Hide AMP Noloading toggle if block does not have specified setting

assets/src/block-editor/helpers/index.js

@@ -411,13 +411,19 @@ AmpLayoutControl.propTypes = {
 /**
  * Get AMP Noloading toggle control.
  *
+ * @deprecated As of v2.1. Blocks with the `ampNoLoading` attribute will still be able to use the control.
+ *
  * @param {Object} props Props.
  *
  * @return {ReactElement} Element.
  */
-const AmpNoloadingToggle = ( props ) => {
+export const AmpNoloadingToggle = ( props ) => {
 	const { attributes: { ampNoLoading }, setAttributes } = props;
 
+	if ( undefined === ampNoLoading ) {
+		return null;
+	}
+
 	const label = __( 'AMP Noloading', 'amp' );
 
 	return (

assets/src/block-editor/helpers/test/AmpNoloadingToggle.js

@@ -0,0 +1,46 @@
+/**
+ * External dependencies
+ */
+import { act } from 'react-dom/test-utils';
+
+/**
+ * WordPress dependencies
+ */
+import { render } from '@wordpress/element';
+
+/**
+ * Internal dependencies
+ */
+import { AmpNoloadingToggle } from '../';
+
+let container;
+
+describe( 'AmpNoloadingToggle', () => {
+	beforeEach( () => {
+		container = document.createElement( 'div' );
+		document.body.appendChild( container );
+	} );
+
+	afterEach( () => {
+		document.body.removeChild( container );
+		container = null;
+	} );
+
+	it( 'should not render if ampNoLoading is undefined', function() {
+		act( () => {
+			render( <AmpNoloadingToggle setAttributes={ () => {} } attributes={ {} } />, container );
+		} );
+
+		const selectControl = container.querySelector( 'input' );
+		expect( selectControl ).toBeNull();
+	} );
+
+	it( 'should render if ampNoLoading is defined', function() {
+		act( () => {
+			render( <AmpNoloadingToggle setAttributes={ () => {} } attributes={ { ampNoLoading: true } } />, container );
+		} );
+
+		const selectControl = container.querySelector( 'input' );
+		expect( selectControl ).not.toBeNull();
+	} );
+} );