fix(javascript): unhandled promise rejections (#201)

mxschmitt · Apr 12, 2021 · b327a70 · b327a70
1 parent 58055ec
commit b327a70
Show file tree

Hide file tree

Showing 9 changed files with 49 additions and 52 deletions.
diff --git a/control-service/workers.go b/control-service/workers.go
@@ -195,12 +195,12 @@ func (w *Worker) createPod() error {
 						Limits: v1.ResourceList{
 							v1.ResourceMemory:           resource.MustParse("1024Mi"),
 							v1.ResourceCPU:              resource.MustParse("1000m"),
-							v1.ResourceEphemeralStorage: resource.MustParse("512Mi"),
+							v1.ResourceEphemeralStorage: resource.MustParse("128Mi"),
 						},
 						Requests: v1.ResourceList{
 							v1.ResourceMemory:           resource.MustParse("128Mi"),
 							v1.ResourceCPU:              resource.MustParse("200m"),
-							v1.ResourceEphemeralStorage: resource.MustParse("512Mi"),
+							v1.ResourceEphemeralStorage: resource.MustParse("128Mi"),
 						},
 					},
 				},

diff --git a/e2e/tests/visual.spec.ts b/e2e/tests/visual.spec.ts
@@ -150,7 +150,7 @@ describe("should handle platform core related features", test => {
     await page.keyboard.type("();")
 
     await page.click("text='Run'")
-    await page.waitForSelector("text='Error: Execution timeout!'", {
+    await page.waitForSelector("text=Execution timeout!", {
       timeout: 70 * 1000
     })
   })

diff --git a/frontend/src/api.d.ts b/frontend/src/api.d.ts
@@ -4,17 +4,11 @@ interface FileWrapper {
   extension: string;
 }
 
-type ErroredExecutionResponse = {
-  success: false
+type ExecutionResponse = Partial<{
+  success: boolean
   error: string
-}
-
-type SuccessExecutionResponse ={
-  success: true
   version: string;
   duration?: number;
   files: FileWrapper[];
   output: string;
-}
-
-type ExecutionResponse = ErroredExecutionResponse | SuccessExecutionResponse
+}>
diff --git a/frontend/src/components/App/index.tsx b/frontend/src/components/App/index.tsx
@@ -13,22 +13,15 @@ import CodeLanguageSelector from '../CodeLanguageSelector';
 const App: React.FunctionComponent = () => {
   const { code, onChangeRightPanelMode } = useContext(CodeContext)
   const [loading, setLoading] = useState<boolean>(false)
-  const [resp, setResponse] = useState<SuccessExecutionResponse | null>(null)
-  const [error, setError] = useState<string | null>(null)
+  const [resp, setResponse] = useState<ExecutionResponse|null>(null)
   const handleExecutionRef = useRef<() => Promise<void>>()
 
   const handleExecution = async (): Promise<void> => {
     setLoading(true)
     setResponse(null)
-    setError(null)
 
     trackEvent()
-    try {
-      const resp = await runCode(code)
-      setResponse(resp)
-    } catch (err) {
-      setError(err.toString())
-    }
+    setResponse(await runCode(code))
     setLoading(false)
     onChangeRightPanelMode(false)
   }
@@ -59,7 +52,7 @@ const App: React.FunctionComponent = () => {
           </Panel>
         </Col>
         <Col xs={24} md={12}>
-          <RightPanel resp={resp} error={error}/>
+          <RightPanel resp={resp} />
         </Col>
       </Grid >
     </>

diff --git a/frontend/src/components/RightPanel/RightOutputPanel/index.tsx b/frontend/src/components/RightPanel/RightOutputPanel/index.tsx
@@ -5,28 +5,38 @@ import ResponseFile from '../../ResponseFile'
 import styles from './index.module.css'
 
 interface RightOutputPanelProps {
-    resp: SuccessExecutionResponse | null;
-    error: string | null
+    resp: ExecutionResponse | null;
 }
 
-const RightOutputPanel: React.FunctionComponent<RightOutputPanelProps> = ({ resp, error }) => {
+const RightOutputPanel: React.FunctionComponent<RightOutputPanelProps> = ({ resp }) => {
     return (
         <>
-            {!error && resp && <>
-                {resp.output.length > 0 && <h4>Logs</h4>}
-                <code className={styles.logsWrapper}>{resp.output.split("\n").map((entry, idx) => <React.Fragment key={idx}>
-                    {entry}
-                    <br />
-                </React.Fragment>)}</code>
-                {resp.files.length > 0 && <h4>Files</h4>}
-                {resp.files.map((file, idx) => <ResponseFile file={file} key={idx} />)}
-                <p>Duration of {resp.duration} ms with Playwright version {resp.version}.</p>
-            </>}
-            {error && <>
-                <h4>Error</h4>
-                <pre>
-                    {error}
-                </pre>
+            {resp && <>
+                {resp.error && <>
+                    <h4>Error</h4>
+                    <pre>
+                        {resp.error}
+                    </pre>
+                </>}
+
+                {resp.output && <>
+                    {resp.output.length > 0 && <h4>Logs</h4>}
+                    <code className={styles.logsWrapper}>
+                    {resp.output.split("\n").map((entry, idx) => <React.Fragment key={idx}>
+                        {entry}
+                        <br />
+                    </React.Fragment>)}
+                    </code>
+                </>}
+
+                {resp.files && <>
+                    {resp.files.length > 0 && <h4>Files</h4>}
+                    {resp.files.map((file, idx) => <ResponseFile file={file} key={idx} />)}
+                </>}
+
+                {resp.success && <>
+                    <p>Duration of {resp.duration} ms with Playwright version {resp.version}.</p>
+                </>}
             </>}
         </>
     )

diff --git a/frontend/src/components/RightPanel/index.tsx b/frontend/src/components/RightPanel/index.tsx
@@ -10,15 +10,14 @@ import { CodeContext } from '../CodeContext'
 import styles from './index.module.css'
 
 interface RightPanelProps {
-    resp: SuccessExecutionResponse | null;
-    error: string | null
+    resp: ExecutionResponse | null;
 }
 
 const getHeaderText = (mode: boolean): string => {
     return mode ? "Output" : "Examples"
 }
 
-const RightPanel: React.FunctionComponent<RightPanelProps> = ({ resp, error }) => {
+const RightPanel: React.FunctionComponent<RightPanelProps> = ({ resp }) => {
     const { rightPanelMode, onChangeRightPanelMode } = useContext(CodeContext)
     const handleShowExamplesClick = (): void => onChangeRightPanelMode(!rightPanelMode)
 
@@ -34,7 +33,7 @@ const RightPanel: React.FunctionComponent<RightPanelProps> = ({ resp, error }) =
             }
         >
             <div className={styles.rightPanelWrapper}>
-                {rightPanelMode ? <RightExamplesPanel /> : <RightOutputPanel resp={resp} error={error}/>}
+                {rightPanelMode ? <RightExamplesPanel /> : <RightOutputPanel resp={resp} />}
             </div>
         </Panel>
     )

diff --git a/frontend/src/utils.ts b/frontend/src/utils.ts
@@ -1,7 +1,7 @@
 import { CodeLanguage, LANGUAGES } from "./constants";
 import { Example } from "./examples";
 
-export const runCode = async (code: string): Promise<SuccessExecutionResponse> => {
+export const runCode = async (code: string): Promise<ExecutionResponse> => {
   const resp = await fetch("/service/control/run", {
     method: "POST",
     headers: {
@@ -12,15 +12,15 @@ export const runCode = async (code: string): Promise<SuccessExecutionResponse> =
       language: determineLanguage()
     })
   })
+
   if (!resp.ok) {
     if (resp.status === 429) {
-      throw new Error("You are rate limited, please try again in a few minutes.")
+      return { error: "You are rate limited, please try again in a few minutes." }
     }
     if (resp.headers.get("Content-Type")?.includes("application/json")) {
-      const error = await resp.json()
-      throw new Error(error.error)
+      return await resp.json()
     }
-    throw new Error("Execution was not successful, please try again in a few minutes.")
+    return { error: "Execution was not successful, please try again in a few minutes." }
   }
   return await resp.json()
 }

diff --git a/internal/worker/worker.go b/internal/worker/worker.go
@@ -3,6 +3,7 @@ package worker
 import (
 	"bytes"
 	"encoding/json"
+	"errors"
 	"fmt"
 	"io"
 	"log"
@@ -94,7 +95,7 @@ func (w *Worker) ExecCommand(name string, args ...string) error {
 		),
 	}
 	if err := c.Run(); err != nil {
-		return fmt.Errorf("could not run command: %s", w.options.TransformOutput(w.output.String()))
+		return errors.New("could not run command")
 	}
 	files, err := collector.Collect()
 	if err != nil {
@@ -116,12 +117,12 @@ func (w *Worker) consumeMessage(incomingMessages <-chan amqp.Delivery) error {
 		outgoingMessage.Error = err.Error()
 	} else {
 		outgoingMessage.Success = true
-		outgoingMessage.Output = w.options.TransformOutput(w.output.String())
 		outgoingMessage.Files, err = w.uploadFiles()
 		if err != nil {
 			return fmt.Errorf("could not upload files: %w", err)
 		}
 	}
+	outgoingMessage.Output = w.options.TransformOutput(w.output.String())
 	outgoingMessageBody, err := json.Marshal(outgoingMessage)
 	if err != nil {
 		return fmt.Errorf("could not marshal outgoing message payload: %w", err)

diff --git a/worker-javascript/main.go b/worker-javascript/main.go
@@ -5,7 +5,7 @@ import (
 )
 
 func handler(w *worker.Worker, code string) error {
-	return w.ExecCommand("node", "-e", code)
+	return w.ExecCommand("node", "--unhandled-rejections=strict", "-e", code)
 }
 
 func main() {