V3: retry utilities (#913)

* WIP * retry.fetch w/intercepting to test * Fixed the incorrect renaming of limit to maxAttempts in v2 * Fixed source map support in dev * Cleanup background worker files once they close
triggerdotdev · Feb 27, 2024 · 8d6e710 · 8d6e710
1 parent 90a302f
commit 8d6e710
Show file tree

Hide file tree

Showing 31 changed files with 1,363 additions and 218 deletions.
diff --git a/apps/webapp/app/components/primitives/DateTime.tsx b/apps/webapp/app/components/primitives/DateTime.tsx
@@ -77,7 +77,6 @@ export const DateTimeAccurate = ({ date, timeZone = "UTC" }: DateTimeProps) => {
 
 function formatDateTimeAccurate(date: Date, timeZone: string, locales: string[]): string {
   const formattedDateTime = new Intl.DateTimeFormat(locales, {
-    year: "numeric",
     month: "short",
     day: "numeric",
     hour: "numeric",

diff --git a/apps/webapp/app/components/runs/v3/SpanEvents.tsx b/apps/webapp/app/components/runs/v3/SpanEvents.tsx
@@ -1,6 +1,6 @@
 import { CodeBlock } from "~/components/code/CodeBlock";
 import { Callout } from "~/components/primitives/Callout";
-import { DateTime } from "~/components/primitives/DateTime";
+import { DateTime, DateTimeAccurate } from "~/components/primitives/DateTime";
 import { Header2, Header3 } from "~/components/primitives/Headers";
 import { Paragraph } from "~/components/primitives/Paragraph";
 import type { OtelExceptionProperty, OtelSpanEvent } from "~/presenters/v3/SpanPresenter.server";
@@ -32,7 +32,7 @@ function SpanEventHeader({
     <div className="flex items-center justify-between">
       <Header2 className={titleClassName}>{title}</Header2>
       <Paragraph variant="small">
-        <DateTime date={time} />
+        <DateTimeAccurate date={time} />
       </Paragraph>
     </div>
   );
@@ -64,7 +64,14 @@ function SpanEventError({
     <div className="flex flex-col gap-2 rounded-sm border border-rose-500/50 p-3">
       <SpanEventHeader title={"Error"} time={spanEvent.time} titleClassName="text-rose-500" />
       {exception.message && <Callout variant="error">{exception.message}</Callout>}
-      {exception.stacktrace && <CodeBlock code={exception.stacktrace} maxLines={20} />}
+      {exception.stacktrace && (
+        <CodeBlock
+          showCopyButton={false}
+          showLineNumbers={false}
+          code={exception.stacktrace}
+          maxLines={20}
+        />
+      )}
     </div>
   );
 }
diff --git a/apps/webapp/app/presenters/v3/SpanPresenter.server.ts b/apps/webapp/app/presenters/v3/SpanPresenter.server.ts
@@ -1,5 +1,9 @@
 import { Attributes } from "@opentelemetry/api";
-import { SemanticInternalAttributes, TaskEventStyle } from "@trigger.dev/core/v3";
+import {
+  SemanticInternalAttributes,
+  TaskEventStyle,
+  correctErrorStackTrace,
+} from "@trigger.dev/core/v3";
 import { unflattenAttributes } from "@trigger.dev/core/v3";
 import { z } from "zod";
 import { PrismaClient, prisma, Prisma } from "~/db.server";
@@ -27,6 +31,7 @@ const OtelSpanEvent = z.object({
 });
 
 const OtelSpanEvents = z.array(OtelSpanEvent).optional();
+type OtelSpanEvents = z.infer<typeof OtelSpanEvents>;
 
 export type OtelSpanEvent = z.infer<typeof OtelSpanEvent>;
 
@@ -93,7 +98,7 @@ export class SpanPresenter {
     return {
       event: {
         ...event,
-        events,
+        events: transformEvents(events, event.metadata as Attributes),
         output: isEmptyJson(event.output) ? null : JSON.stringify(event.output, null, 2),
         payload: payload ? JSON.stringify(payload, null, 2) : undefined,
         properties: sanitizedAttributesStringified(event.properties),
@@ -104,6 +109,43 @@ export class SpanPresenter {
   }
 }
 
+function transformEvents(events: OtelSpanEvents, properties: Attributes): OtelSpanEvents {
+  return (events ?? []).map((event) => transformEvent(event, properties));
+}
+
+function transformEvent(event: OtelSpanEvent, properties: Attributes): OtelSpanEvent {
+  if (!event.properties?.exception) {
+    return event;
+  }
+
+  return {
+    ...event,
+    properties: {
+      exception: transformException(event.properties.exception, properties),
+    },
+  };
+}
+
+function transformException(
+  exception: OtelExceptionProperty,
+  properties: Attributes
+): OtelExceptionProperty {
+  const projectDirAttributeValue = properties[SemanticInternalAttributes.PROJECT_DIR];
+
+  if (typeof projectDirAttributeValue !== "string") {
+    return exception;
+  }
+
+  return {
+    ...exception,
+    stacktrace: exception.stacktrace
+      ? correctErrorStackTrace(exception.stacktrace, projectDirAttributeValue, {
+          removeFirstLine: true,
+        })
+      : undefined,
+  };
+}
+
 function filteredAttributes(attributes: Attributes, prefix: string): Attributes {
   const result: Attributes = {};
 

diff --git a/...rgs.$organizationSlug.projects.v3.$projectParam.runs.$runParam.spans.$spanParam/route.tsx b/...rgs.$organizationSlug.projects.v3.$projectParam.runs.$runParam.spans.$spanParam/route.tsx
@@ -5,7 +5,7 @@ import { typedjson, useTypedLoaderData } from "remix-typedjson";
 import { VersionLabel } from "~/components/VersionLabel";
 import { CodeBlock } from "~/components/code/CodeBlock";
 import { InlineCode } from "~/components/code/InlineCode";
-import { DateTime } from "~/components/primitives/DateTime";
+import { DateTime, DateTimeAccurate } from "~/components/primitives/DateTime";
 import { Header2 } from "~/components/primitives/Headers";
 import { Paragraph } from "~/components/primitives/Paragraph";
 import { ShortcutKey } from "~/components/primitives/ShortcutKey";
@@ -67,7 +67,7 @@ export default function Page() {
             ) : (
               <Property label="Timestamp">
                 <Paragraph variant="small/bright">
-                  <DateTime date={event.startTime} /> UTC
+                  <DateTimeAccurate date={event.startTime} /> UTC
                 </Paragraph>
               </Property>
             )}
@@ -163,13 +163,15 @@ function Timeline({ startTime, duration, inProgress, isError }: TimelineProps) {
     <div className="flex w-full flex-col">
       <div className="flex items-center justify-between gap-1">
         <Paragraph variant="small">
-          <DateTime date={startTime} /> UTC
+          <DateTimeAccurate date={startTime} /> UTC
         </Paragraph>
         {state === "pending" ? (
           <LiveTimer startTime={startTime} className="" />
         ) : (
           <Paragraph variant="small">
-            <DateTime date={new Date(startTime.getTime() + nanosecondsToMilliseconds(duration))} />
+            <DateTimeAccurate
+              date={new Date(startTime.getTime() + nanosecondsToMilliseconds(duration))}
+            />
           </Paragraph>
         )}
       </div>

diff --git a/packages/cli-v3/package.json b/packages/cli-v3/package.json
@@ -111,7 +111,7 @@
     "react": "^18.2.0",
     "react-error-boundary": "^4.0.12",
     "simple-git": "^3.19.0",
-    "source-map": "^0.7.4",
+    "source-map-support": "^0.5.21",
     "supports-color": "^9.4.0",
     "terminal-link": "^3.0.0",
     "update-check": "^1.5.4",

diff --git a/packages/cli-v3/src/commands/dev.tsx b/packages/cli-v3/src/commands/dev.tsx
@@ -314,7 +314,7 @@ function useDev({ config, apiUrl, apiKey, environmentClient, projectName, debugg
         metafile: true,
         write: false,
         minify: false,
-        sourcemap: debuggerOn ? "inline" : true,
+        sourcemap: "external", // does not set the //# sourceMappingURL= comment in the file, we handle it ourselves
         logLevel: "warning",
         platform: "node",
         format: "esm",
@@ -377,9 +377,14 @@ function useDev({ config, apiUrl, apiKey, environmentClient, projectName, debugg
 
                 // Create a file at join(dir, ".trigger", path) with the fileContents
                 const fullPath = join(config.projectDir, ".trigger", `${contentHash}.mjs`);
+                const sourceMapPath = `${fullPath}.map`;
+
+                const outputFileWithSourceMap = `${
+                  outputFile.text
+                }\n//# sourceMappingURL=${basename(sourceMapPath)}`;
 
                 await fs.promises.mkdir(dirname(fullPath), { recursive: true });
-                await fs.promises.writeFile(fullPath, outputFile.text);
+                await fs.promises.writeFile(fullPath, outputFileWithSourceMap);
 
                 if (sourceMapFile) {
                   const sourceMapPath = `${fullPath}.map`;