Pd publish not working (500 error) with custom component

Hello Pipedream team,

I am trying to update a custom component that I use across many sources. I found that I am not able to publish with the latest CLI:

$ pd publish pipedream_http_source.js
Detected local requires, creating zip archive...
- pmnh-tools/pipedream_http_source.js
- pipedream/components/http/http.app.mjs
component create api call responded with status: 500, body: {"error":"unexpected error, please contact support@pipedream.com"}

I have been able to publish this component in the past (probably a year ago) - I tried publishing under a new name and no luck. Any suggestions on how to debug this problem?

Thanks!
~~ Peter

1 Like

Hi Peter,

Would it be possible for you to share your custom action code here? That would be the best way we could help.

The other alternative is pasting your action code into a Node.js code step in a workflow and seeing if there’s a syntax or runtime error when you attempt to run it.

You may need to remove Action specific properties like version and type and also wrap the action code with export default defineComponent( ... but that might give you more insight into why your code is being rejected.

2 Likes

Actually I think with some trial and error I just figured it out :slight_smile:

I had an import statement like so:

const http_app = import('../../pentest/pipedream/components/http/http.app.mjs')

If I changed this to:

const http_app = import('../pipedream/components/http/http.app.mjs')

Then I started getting expected errors (syntax error and the like). The output of the PD CLI as far as packaging was exactly the same, but it seems like the “…/…/” was triggering some kind of server-side problem?

Note that both the first and second relative paths were valid.

Thanks so much for providing Pipedream by the way, I literally use it every day and it’s a fantastic resource!

Cheers,
~~ Peter

Sample, much simplified, code to reproduce (please adjust paths accordingly but the “…/…/” must be correct to see the 500 error):

const http_app = import('../../pentest/pipedream/components/http/http.app.mjs')

// Core HTTP component
module.exports = {
  key: "pmnh-custom-requests-bug-demo",
  name: "HTTP Request Handler by @pmnh",
  description: "Sample script to reproduce issue",
  version: "0.0.7",
  props: {
    http: {
      type: "$.interface.http",
      customResponse: true,
    },
    theSlug: {
      type: "string",
      label: "Project Slug",
      description: "Slug for the project name, e.g. Uber",
      optional: false,
      default: "unknown"
    },
    emitBodyOnly: {
      type: "boolean",
      label: "Body Only",
      description: "This source emits an event representing the full HTTP request by default. Select TRUE to emit the body only.",
      optional: true,
      default: false,
    },
    resStatusCode: {
      type: "string",
      label: "Response Status Code",
      description: "The status code to return in the HTTP response.",
      optional: true,
      default: '200',
    },
    resContentType: {
      type: "string",
      label: "Response Content-Type",
      description: "The content-type of the body returned in the HTTP response.",
      optional: true,
      default: `application/json`,
    },
    resBody: {
      type: "string",
      label: "Response Body",
      description: "The body to return in the HTTP response.",
      optional: true,
      default: `{ "success": true }`,
    },
  },
  async run(event) {
    const summary = `${event.method} ${event.path}`
    var headers = {
        "content-type": this.resContentType,
      };

    host = event.headers["host"]

    this.http.respond({
      status: this.resStatusCode,
      body: this.resBody,
      headers: headers,
    });

    event.key = this.key
    if(this.emitBodyOnly) {
      this.$emit(event.body, { summary })
    } else {
      this.$emit(event, { summary })
    }
  }
}

Hi Peter,

Thanks for sharing! Very helpful, and I’m glad you were able to trial and error your way to a solution.

I think the issue is the import statement syntax. We encourage the use of ESM syntax instead of CommonJS.

In general, I just recommend using:

import http_app from '../../pentest/pipedream/components/http/http.app.mjs'

Instead of the older CommonJS syntax:

const http_app = require('../../pentest/pipedream/components/http/http.app.mjs')

The syntax you shared is not the typical way of importing modules. The relative importing might be slightly different.

Lastly, you can change your module.exports to simply export default:

// Core HTTP component
export default {
  key: "pmnh-custom-requests-bug-demo",
  name: "HTTP Request Handler by @pmnh",
  // ... rest of component
}

Here’s the complete MDN docs on importing / exporting ESM modules.

PS - looks like you might be using Pipedream actions to conduct security research, very cool use. If you have any more comments or suggestions on custom component development, we’d love your feedback.

We’ve also started a video course on them here if you prefer watching over reading docs:

Hi pierce,

Thanks so much! Happy to provide insight into how I’m using PD. Feel free to DM me on Twitter (https://twitter.com/h1pmnh) and I’ll share my contact info.

Appreciate the advice on better structuring my module!

Cheers,
~~ Peter