Include original error message in error message box

[fluiddot]

Related to 9309-gh-Automattic/dotcom-forge.

Proposed Changes

• Add an IPC handler to display the error message box. It removes the potential prepended error message when the exception comes from an IPC handler.
• Update different areas of the app that were displaying an error message box and use the new IPC handler.
• Handle exceptions produced when archiving a site and display the error message.

Testing Instructions

Preparation:

• Apply the following patch:

diff --git forkSrcPrefix/src/ipc-handlers.ts forkDstPrefix/src/ipc-handlers.ts
index c1bd18ff8803404bf6b687455fcf01f8cd2dd057..4e47690ff63cc8009891b3cc2ae9974517cba0c9 100644
--- forkSrcPrefix/src/ipc-handlers.ts
+++ forkDstPrefix/src/ipc-handlers.ts
@@ -111,6 +111,7 @@ export async function importSite(
 				parentWindow.webContents.send( 'on-import', data, id );
 			}
 		};
+		// throw new Error( 'Error Test - importSite' );
 		const result = await importBackup( backupFile, site.details, onEvent, defaultImporterOptions );
 		if ( ! result ) {
 			return;
@@ -170,6 +171,8 @@ export async function createSite(
 
 	const server = SiteServer.create( details );
 
+	// throw new Error( `Error Test - createSite` );
+
 	if ( isWordPressDirectory( path ) ) {
 		// If the directory contains a WordPress installation, and user wants to force SQLite
 		// integration, let's rename the wp-config.php file to allow WP Now to create a new one
@@ -225,6 +228,8 @@ export async function startServer(
 		return null;
 	}
 
+	// throw new Error( `Error Test - startServer` );
+
 	await keepSqliteIntegrationUpdated( server.details.path );
 
 	const parentWindow = BrowserWindow.fromWebContents( event.sender );
@@ -372,6 +377,7 @@ export async function archiveSite( event: IpcMainInvokeEvent, id: string ) {
 	}
 	const sitePath = site.details.path;
 	const zipPath = `${ TEMP_DIR }site_${ id }.zip`;
+	// throw new Error( 'Error Test - archiveSite' );
 	await zipWordPressDirectory( {
 		source: sitePath,
 		zipPath,
@@ -401,6 +407,8 @@ export async function deleteSite( event: IpcMainInvokeEvent, id: string, deleteF
 	if ( ! server ) {
 		throw new Error( 'Site not found.' );
 	}
+	// throw new Error( 'Error Test - deleteSite' );
+
 	const userData = await loadUserData();
 	await server.delete();
 	try {
@@ -458,6 +466,7 @@ export async function exportSite(
 				parentWindow.webContents.send( 'on-export', data, siteId );
 			}
 		};
+		// throw new Error( 'Error Test - exportSite' );
 		return await exportBackup( options, onEvent );
 	} catch ( e ) {
 		Sentry.captureException( e );
@@ -501,6 +510,7 @@ export async function openSiteURL(
 }
 
 export async function openURL( event: IpcMainInvokeEvent, url: string ) {
+	// throw new Error( 'Error Test - openURL' );
 	return shell.openExternal( url );
 }
 

Create site

• Uncomment the error throw statement in ipc-handlers.ts file related to creating a site.
• Create a site.
• Observe that the error message box is displayed and includes the error message of the exception.

Start site

• Uncomment the error throw statement in ipc-handlers.ts file related to starting a site.
• Start a site.
• Observe that the error message box is displayed and includes the error message of the exception.

Delete site

• Uncomment the error throw statement in ipc-handlers.ts file related to deleting a site.
• Delete a site.
• Observe that the error message box is displayed and includes the error message of the exception.

Opening link from Assistant

• Uncomment the error throw statement in ipc-handlers.ts file related to opening an URL.
• Log in to WPCOM with a user that has access to the Assistant feature.
• Navigate to the Assistant tab.
• Submit a prompt that will display a link (e.g. How can I access the plugins list?).
• Wait for the response and try to open a link.
• Observe that the error message box is displayed and includes the error message of the exception.

Add demo site

• Uncomment the error throw statement in ipc-handlers.ts file related to archiving a site.
• Navigate to the Share tab
• Add a demo site.
• Observe that the error message box is displayed and includes the error message of the exception.

Update demo site

• Uncomment the error throw statement in ipc-handlers.ts file related to archiving a site.
• Navigate to the Share tab
• Add a demo site if needed.
• Update the demo site.
• Observe that the error message box is displayed and includes the error message of the exception.

Import site

• Uncomment the error throw statement in ipc-handlers.ts file related to importing a site.
• Navigate to the Import/Export tab.
• Import a site.
• Observe that the error message box is displayed and includes the error message of the exception.

Export site

• Uncomment the error throw statement in ipc-handlers.ts file related to exporting a site.
• Navigate to the Import/Export tab.
• Export a site.
• Observe that the error message box is displayed and includes the error message of the exception.

Pre-merge Checklist

• Have you checked for TypeScript, React or other console errors?

[fluiddot]

We let the exception bubble up so we can display the original error message.

[sejas]

Love it!
Thanks for adding the context, this will help to receive better reports from users, and it will help them to possibly fix their issues, or at least understanding the root cause of them.

I've applied the diff and I've tested all the use cases except update and delete a demo site.
I like how the OK button array is not required anymore. Well done!

FkG2Ly.mp4