Block Editor: Improve Detection

resources/backend/js/gutenberg-block-formatters.js

@@ -13,7 +13,7 @@
 // Register Gutenberg Block Toolbar formatters if the Gutenberg Editor is loaded on screen.
 // This prevents JS errors if this script is accidentally enqueued on a non-
 // Gutenberg editor screen, or the Classic Editor Plugin is active.
-if (typeof wp !== 'undefined' && typeof wp.blockEditor !== 'undefined') {
+if (convertKitGutenbergEnabled()) {
 	// Register each ConvertKit formatter in Gutenberg.
 	for (const formatter in convertkit_block_formatters) {
 		convertKitGutenbergRegisterBlockFormatter(

resources/backend/js/gutenberg.js

@@ -13,17 +13,19 @@
 // Register Gutenberg Blocks if the Gutenberg Editor is loaded on screen.
 // This prevents JS errors if this script is accidentally enqueued on a non-
 // Gutenberg editor screen, or the Classic Editor Plugin is active.
-if (typeof wp !== 'undefined' && typeof wp.blockEditor !== 'undefined') {
+if (convertKitGutenbergEnabled()) {
 	// Register each ConvertKit Block in Gutenberg.
 	for (const block in convertkit_blocks) {
 		convertKitGutenbergRegisterBlock(convertkit_blocks[block]);
 	}
 
-	// Register ConvertKit Pre-publish actions in Gutenberg.
-	if (typeof convertkit_pre_publish_actions !== 'undefined') {
-		convertKitGutenbergRegisterPrePublishActions(
-			convertkit_pre_publish_actions
-		);
+	// Register ConvertKit Pre-publish actions in Gutenberg if we're editing a Post.
+	if (convertKitEditingPostInGutenberg()) {
+		if (typeof convertkit_pre_publish_actions !== 'undefined') {
+			convertKitGutenbergRegisterPrePublishActions(
+				convertkit_pre_publish_actions
+			);
+		}
 	}
 }
 
@@ -928,3 +930,29 @@ function convertKitGutenbergDisplayBlockNotice(block_name, notice) {
 		notice
 	);
 }
+
+/**
+ * Checks if the user is editing a post in the block editor.
+ *
+ * @since   3.0.8
+ *
+ * @return {boolean} User is editing in the block editor
+ */
+function convertKitEditingPostInGutenberg() {
+	// If the user is editing a post in the block editor, wp.editPost will be defined.
+	return typeof wp !== 'undefined' && typeof wp.editPost !== 'undefined';
+}
+
+/**
+ * Checks if the Gutenberg editor is loaded on screen.
+ *
+ * Returns true when editing a Post, Page or Custom Post Type in the block editor,
+ * or using the site editor.
+ *
+ * @since   3.0.8
+ *
+ * @return {boolean} Block editor is loaded
+ */
+function convertKitGutenbergEnabled() {
+	return typeof wp !== 'undefined' && typeof wp.blockEditor !== 'undefined';
+}

resources/backend/js/refresh-resources.js

@@ -201,7 +201,7 @@ function convertKitRefreshResources(button) {
  */
 function convertKitRefreshResourcesRemoveNotices() {
 	// If we're editing a Page, Post or Custom Post Type in Gutenberg, use wp.data.dispatch to remove the error.
-	if (typeof wp !== 'undefined' && typeof wp.blockEditor !== 'undefined') {
+	if (convertKitEditingPostInGutenberg()) {
 		// Gutenberg Editor.
 		wp.data.dispatch('core/notices').removeNotice('convertkit-error');
 		return;
@@ -226,7 +226,7 @@ function convertKitRefreshResourcesOutputErrorNotice(message) {
 	message = 'ConvertKit: ' + message;
 
 	// If we're editing a Page, Post or Custom Post Type in Gutenberg, use wp.data.dispatch to show the error.
-	if (typeof wp !== 'undefined' && typeof wp.blockEditor !== 'undefined') {
+	if (convertKitEditingPostInGutenberg()) {
 		// Gutenberg Editor.
 		wp.data
 			.dispatch('core/notices')

tests/EndToEnd/integrations/divi-builder/DiviPluginBroadcastsCest.php

@@ -243,8 +243,11 @@ public function testBroadcastsModuleInFrontendEditorWhenNoCredentials(EndToEndTe
 		);
 
 		// Confirm the on screen message displays.
-		$I->seeInSource('Not connected to Kit');
-		$I->seeInSource('Connect your Kit account at Settings > Kit, and then refresh this page to configure broadcasts to display.');
+		$I->seeTextInDiviModule(
+			$I,
+			title: 'Not connected to Kit',
+			text: 'Connect your Kit account at Settings > Kit, and then refresh this page to configure broadcasts to display.'
+		);
 	}
 
 	/**
@@ -272,8 +275,11 @@ public function testBroadcastsModuleInFrontendEditorWhenNoBroadcasts(EndToEndTes
 		);
 
 		// Confirm the on screen message displays.
-		$I->seeInSource('No broadcasts exist in Kit');
-		$I->seeInSource('Add a broadcast to your Kit account, and then refresh this page to configure broadcasts to display.');
+		$I->seeTextInDiviModule(
+			$I,
+			title: 'No broadcasts exist in Kit',
+			text: 'Add a broadcast to your Kit account, and then refresh this page to configure broadcasts to display.'
+		);
 	}
 
 	/**

tests/EndToEnd/integrations/divi-builder/DiviPluginFormCest.php

@@ -116,8 +116,11 @@ public function testFormModuleInFrontendEditorWhenNoCredentials(EndToEndTester $
 		);
 
 		// Confirm the on screen message displays.
-		$I->seeInSource('Not connected to Kit');
-		$I->seeInSource('Connect your Kit account at Settings > Kit, and then refresh this page to select a form.');
+		$I->seeTextInDiviModule(
+			$I,
+			title: 'Not connected to Kit',
+			text: 'Connect your Kit account at Settings > Kit, and then refresh this page to select a form.'
+		);
 	}
 
 	/**
@@ -145,8 +148,11 @@ public function testFormModuleInFrontendEditorWhenNoForms(EndToEndTester $I)
 		);
 
 		// Confirm the on screen message displays.
-		$I->seeInSource('No forms exist in Kit');
-		$I->seeInSource('Add a form to your Kit account, and then refresh this page to select a form.');
+		$I->seeTextInDiviModule(
+			$I,
+			title: 'No forms exist in Kit',
+			text: 'Add a form to your Kit account, and then refresh this page to select a form.'
+		);
 	}
 
 	/**

tests/EndToEnd/integrations/divi-builder/DiviPluginFormTriggerCest.php

@@ -122,8 +122,11 @@ public function testFormTriggerModuleInFrontendEditorWhenNoCredentials(EndToEndT
 		);
 
 		// Confirm the on screen message displays.
-		$I->seeInSource('Not connected to Kit');
-		$I->seeInSource('Connect your Kit account at Settings > Kit, and then refresh this page to select a form.');
+		$I->seeTextInDiviModule(
+			$I,
+			title: 'Not connected to Kit',
+			text: 'Connect your Kit account at Settings > Kit, and then refresh this page to select a form.'
+		);
 	}
 
 	/**
@@ -151,8 +154,11 @@ public function testFormTriggerModuleInFrontendEditorWhenNoForms(EndToEndTester
 		);
 
 		// Confirm the on screen message displays.
-		$I->seeInSource('No modal, sticky bar or slide in forms exist in Kit');
-		$I->seeInSource('Add a non-inline form to your Kit account, and then refresh this page to select a form.');
+		$I->seeTextInDiviModule(
+			$I,
+			title: 'No modal, sticky bar or slide in forms exist in Kit',
+			text: 'Add a non-inline form to your Kit account, and then refresh this page to select a form.'
+		);
 	}
 
 	/**

tests/EndToEnd/integrations/divi-builder/DiviPluginProductCest.php

@@ -114,8 +114,11 @@ public function testProductModuleInFrontendEditorWhenNoCredentials(EndToEndTeste
 		);
 
 		// Confirm the on screen message displays.
-		$I->seeInSource('Not connected to Kit');
-		$I->seeInSource('Connect your Kit account at Settings > Kit, and then refresh this page to select a product.');
+		$I->seeTextInDiviModule(
+			$I,
+			title: 'Not connected to Kit',
+			text: 'Connect your Kit account at Settings > Kit, and then refresh this page to select a product.'
+		);
 	}
 
 	/**
@@ -143,8 +146,11 @@ public function testProductModuleInFrontendEditorWhenNoProducts(EndToEndTester $
 		);
 
 		// Confirm the on screen message displays.
-		$I->seeInSource('No products exist in Kit');
-		$I->seeInSource('Add a product to your Kit account, and then refresh this page to select a product.');
+		$I->seeTextInDiviModule(
+			$I,
+			title: 'No products exist in Kit',
+			text: 'Add a product to your Kit account, and then refresh this page to select a product.'
+		);
 	}
 
 	/**

tests/EndToEnd/integrations/divi-theme/DiviThemeBroadcastsCest.php

@@ -245,8 +245,11 @@ public function testBroadcastsModuleInFrontendEditorWhenNoCredentials(EndToEndTe
 		);
 
 		// Confirm the on screen message displays.
-		$I->seeInSource('Not connected to Kit');
-		$I->seeInSource('Connect your Kit account at Settings > Kit, and then refresh this page to configure broadcasts to display.');
+		$I->seeTextInDiviModule(
+			$I,
+			title: 'Not connected to Kit',
+			text: 'Connect your Kit account at Settings > Kit, and then refresh this page to configure broadcasts to display.'
+		);
 	}
 
 	/**
@@ -274,8 +277,11 @@ public function testBroadcastsModuleInFrontendEditorWhenNoBroadcasts(EndToEndTes
 		);
 
 		// Confirm the on screen message displays.
-		$I->seeInSource('No broadcasts exist in Kit');
-		$I->seeInSource('Add a broadcast to your Kit account, and then refresh this page to configure broadcasts to display.');
+		$I->seeTextInDiviModule(
+			$I,
+			title: 'No broadcasts exist in Kit',
+			text: 'Add a broadcast to your Kit account, and then refresh this page to configure broadcasts to display.'
+		);
 	}
 
 	/**

tests/EndToEnd/integrations/divi-theme/DiviThemeFormCest.php

@@ -116,8 +116,11 @@ public function testFormModuleInFrontendEditorWhenNoCredentials(EndToEndTester $
 		);
 
 		// Confirm the on screen message displays.
-		$I->seeInSource('Not connected to Kit');
-		$I->seeInSource('Connect your Kit account at Settings > Kit, and then refresh this page to select a form.');
+		$I->seeTextInDiviModule(
+			$I,
+			title: 'Not connected to Kit',
+			text: 'Connect your Kit account at Settings > Kit, and then refresh this page to select a form.'
+		);
 	}
 
 	/**
@@ -145,8 +148,11 @@ public function testFormModuleInFrontendEditorWhenNoForms(EndToEndTester $I)
 		);
 
 		// Confirm the on screen message displays.
-		$I->seeInSource('No forms exist in Kit');
-		$I->seeInSource('Add a form to your Kit account, and then refresh this page to select a form.');
+		$I->seeTextInDiviModule(
+			$I,
+			title: 'No forms exist in Kit',
+			text: 'Add a form to your Kit account, and then refresh this page to select a form.'
+		);
 	}
 
 	/**

tests/EndToEnd/integrations/divi-theme/DiviThemeFormTriggerCest.php

@@ -122,8 +122,11 @@ public function testFormTriggerModuleInFrontendEditorWhenNoCredentials(EndToEndT
 		);
 
 		// Confirm the on screen message displays.
-		$I->seeInSource('Not connected to Kit');
-		$I->seeInSource('Connect your Kit account at Settings > Kit, and then refresh this page to select a form.');
+		$I->seeTextInDiviModule(
+			$I,
+			title: 'Not connected to Kit',
+			text: 'Connect your Kit account at Settings > Kit, and then refresh this page to select a form.'
+		);
 	}
 
 	/**
@@ -151,8 +154,11 @@ public function testFormTriggerModuleInFrontendEditorWhenNoForms(EndToEndTester
 		);
 
 		// Confirm the on screen message displays.
-		$I->seeInSource('No modal, sticky bar or slide in forms exist in Kit');
-		$I->seeInSource('Add a non-inline form to your Kit account, and then refresh this page to select a form.');
+		$I->seeTextInDiviModule(
+			$I,
+			title: 'No modal, sticky bar or slide in forms exist in Kit',
+			text: 'Add a non-inline form to your Kit account, and then refresh this page to select a form.'
+		);
 	}
 
 	/**

tests/EndToEnd/integrations/divi-theme/DiviThemeProductCest.php

@@ -114,8 +114,11 @@ public function testProductModuleInFrontendEditorWhenNoCredentials(EndToEndTeste
 		);
 
 		// Confirm the on screen message displays.
-		$I->seeInSource('Not connected to Kit');
-		$I->seeInSource('Connect your Kit account at Settings > Kit, and then refresh this page to select a product.');
+		$I->seeTextInDiviModule(
+			$I,
+			title: 'Not connected to Kit',
+			text: 'Connect your Kit account at Settings > Kit, and then refresh this page to select a product.'
+		);
 	}
 
 	/**
@@ -143,8 +146,11 @@ public function testProductModuleInFrontendEditorWhenNoProducts(EndToEndTester $
 		);
 
 		// Confirm the on screen message displays.
-		$I->seeInSource('No products exist in Kit');
-		$I->seeInSource('Add a product to your Kit account, and then refresh this page to select a product.');
+		$I->seeTextInDiviModule(
+			$I,
+			title: 'No products exist in Kit',
+			text: 'Add a product to your Kit account, and then refresh this page to select a product.'
+		);
 	}
 
 	/**

tests/Support/Helper/DiviBuilder.php

@@ -168,13 +168,13 @@ public function saveDiviModuleInBackendEditorAndViewPage($I)
 		// Update page.
 		$I->click('Update');
 
-		// Load the Page on the frontend site.
+		// Wait for the save to complete.
+		$I->waitForElementVisible('#message');
+		$I->see('Page updated.', '#message');
 		$I->waitForElementNotVisible('.et-fb-preloader');
-		$I->wait(2);
-		$I->waitForElementVisible('.notice-success');
-		$I->click('.notice-success a');
 
-		// Wait for frontend web site to load.
+		// Load the Page on the frontend site.
+		$I->click('.notice-success a');
 		$I->waitForElementVisible('body');
 
 		// Check that no PHP warnings or notices were output.
@@ -211,6 +211,29 @@ public function saveDiviModuleInFrontendEditorAndViewPage($I, $url)
 		$I->checkNoWarningsAndNoticesOnScreen($I);
 	}
 
+	/**
+	 * Helper method to see specific text is displayed in a Divi module.
+	 *
+	 * @since   3.0.8
+	 *
+	 * @param   EndToEndTester $I      EndToEnd Tester.
+	 * @param   string         $title  Title of the module.
+	 * @param   string         $text   Text to confirm is displayed.
+	 */
+	public function seeTextInDiviModule($I, $title, $text)
+	{
+		// Switch to Divi Builder iframe.
+		$I->switchToIFrame('iframe[id="et-fb-app-frame"]');
+
+		// Confirm the on screen message displays.
+		$I->waitForElementVisible('div.convertkit-divi-module');
+		$I->see($title, 'div.convertkit-divi-module');
+		$I->see($text, 'div.convertkit-divi-module');
+
+		// Switch back to main window.
+		$I->switchToIFrame();
+	}
+
 	/**
 	 * Create a Page in the database comprising of Divi Page Builder data
 	 * containing a Kit module.