Add new error message for awaiting the client export

update test

Author: huozhi

packages/react-server-dom-turbopack/src/ReactFlightTurbopackReferences.js

@@ -133,6 +133,11 @@ const deepProxyHandlers = {
             `Instead, you can export a Client Component wrapper ` +
             `that itself renders a Client Context Provider.`,
         );
+      case 'then':
+        throw new Error(
+          `Cannot await or return from a thenable. ` +
+            `You cannot await a client module from a server component.`,
+        );
     }
     // eslint-disable-next-line react-internal/safe-string-coercion
     const expression = String(target.name) + '.' + String(name);

packages/react-server-dom-webpack/src/ReactFlightWebpackReferences.js

@@ -141,6 +141,11 @@ const deepProxyHandlers = {
             `Instead, you can export a Client Component wrapper ` +
             `that itself renders a Client Context Provider.`,
         );
+      case 'then':
+        throw new Error(
+          `Cannot await or return from a thenable. ` +
+            `You cannot await a client module from a server component.`,
+        );
     }
     // eslint-disable-next-line react-internal/safe-string-coercion
     const expression = String(target.name) + '.' + String(name);

packages/react-server-dom-webpack/src/__tests__/ReactFlightDOM-test.js

@@ -623,6 +623,19 @@ describe('ReactFlightDOM', () => {
     );
   });
 
+  it('throws when await a client module prop of client exports', () => {
+    const ClientModule = clientExports({
+      Component: function () {},
+    });
+    async function read() {
+      return await ClientModule.then(mod => mod.Component);
+    }
+    expect(read).toThrowError(
+      `Cannot await or return from a thenable. ` +
+        `You cannot await a client module from a server component.`,
+    );
+  });
+
   it('throws when accessing a symbol prop from client exports', () => {
     const symbol = Symbol('test');
     const ClientModule = clientExports({