Create A New Job with VisualPing API on New Attachment Received from Gmail (Developer App) API

Pipedream makes it easy to connect APIs for VisualPing, Gmail (Developer App) and 2,000+ other apps remarkably fast.

Trigger workflow on

New Attachment Received from the Gmail (Developer App) API

Next, do this

Create A New Job with the VisualPing API

No credit card required

▶

Watch us build a workflow

8 min

Watch now ➜

Trusted by 800,000+ developers from startups to Fortune 500 companies

Developers ♥ Pipedream

Getting Started#

This integration creates a workflow with a Gmail (Developer App) trigger and VisualPing action. When you configure and deploy the workflow, it will run on Pipedream's servers 24x7 for free.

Select this integration
Configure the New Attachment Received trigger
1. Connect your Gmail (Developer App) account
2. Configure timer
3. Optional- Configure Search Query
4. Optional- Select one or more Labels
Configure the Create A New Job action
1. Connect your VisualPing account
2. Optional- Configure Email
3. Optional- Configure Business
4. Optional- Configure Locale
5. Optional- Configure Site Referer
6. Optional- Configure Ad Campaign
7. Optional- Configure Origin
8. Optional- Configure Content Type
9. Configure URL
10. Configure Description
11. Select a Mode
12. Configure Active
13. Configure Interval
14. Configure Trigger
15. Select a Target Device
16. Optional- Configure Proxy
17. Optional- Configure Fixed Proxy Alias
18. Optional- Configure Xpath
19. Optional- Configure Renderer
20. Optional- Configure Disable JS
21. Optional- Configure Page Height
22. Optional- Configure Wait Time
23. Optional- Configure Preactions Active
24. Optional- Configure Preactions Objects
25. Optional- Configure Advanced Schedule Active
26. Optional- Configure Multicheck Enabled
27. Configure Enable SMS Alert
28. Configure Enable Email Alert
29. Configure Use Slack Notification
30. Configure Use Teams Notification
31. Configure Use Webhook Notification
32. Configure Use Discord Notification
33. Configure Use Slack App Notification
34. Select a Workspace ID
Deploy the workflow
Send a test event to validate your setup
Turn on the trigger

Details#

This integration uses pre-built, source-available components from Pipedream's GitHub repo. These components are developed by Pipedream and the community, and verified and maintained by Pipedream.

To contribute an update to an existing component or create a new component, create a PR on GitHub. If you're new to Pipedream component development, you can start with quickstarts for trigger span and action development, and then review the component API reference.

Trigger#

New Attachment Received on Gmail (Developer App)

Description:Emit new event for each attachment in a message received. This source is capped at 100 max new messages per run.

Version:0.0.7

Key:gmail_custom_oauth-new-attachment-received

View on GitHub

Gmail (Developer App) Overview#

With the Gmail (Developer App) API on Pipedream, you can automate a variety of email-related tasks, directly manipulating your Gmail account to streamline workflows. From sending emails programmatically to parsing new inbound messages for data extraction, the API allows for deep interaction with your Gmail inbox. Use cases include automating follow-ups, organizing your inbox with filters and labels, and synchronizing important email events with other services to act upon new information instantly.

Trigger Code#

import common from "../common/polling.mjs";

export default {
  ...common,
  key: "gmail_custom_oauth-new-attachment-received",
  name: "New Attachment Received",
  description: "Emit new event for each attachment in a message received. This source is capped at 100 max new messages per run.",
  version: "0.0.7",
  type: "source",
  dedupe: "unique",
  methods: {
    ...common.methods,
    generateMeta(attachment, message) {
      return {
        id: attachment.body.attachmentId,
        summary: `New attachment: ${attachment.filename}`,
        ts: message.internalDate,
      };
    },
    emitEvents(messages) {
      for (const message of messages) {
        const attachments = message.payload.parts.filter((part) => part.body.attachmentId);
        const numAttachments = attachments.length;
        if (!numAttachments) continue;
        const suffix = numAttachments === 1
          ? ""
          : "s";
        console.log(`Emitting event${suffix} for ${numAttachments} attachment${suffix} found for message`);
        for (const attachment of attachments) {
          const meta = this.generateMeta(attachment, message);
          this.$emit({
            message,
            attachment,
          }, meta);
        }
      }
    },
    filterMessagesWithAttachments(messages) {
      return messages.filter(
        (message) => message.payload.parts?.filter((part) => part.body?.attachmentId).length,
      );
    },
    async processMessageIds(messageIds) {
      const messages = this.filterMessagesWithAttachments(
        await this.gmail.getMessages(messageIds),
      );
      this.emitEvents(messages);
    },
  },
};

Trigger Configuration#

This component may be configured based on the props defined in the component code. Pipedream automatically prompts for input values in the UI and CLI.

Label	Prop	Type	Description
Gmail (Developer App)	`gmail`	`app`	This component uses the Gmail (Developer App) app.
N/A	`db`	`$.service.db`	This component uses `$.service.db` to maintain state between executions.
	`timer`	`$.interface.timer`
Search Query	`q`	`string`	Apply a search filter using Gmail's standard search operators
Labels	`labels`	`string[]`	Select a value from the drop down menu.

Trigger Authentication#

Gmail (Developer App) uses OAuth authentication. When you connect your Gmail (Developer App) account, Pipedream will open a popup window where you can sign into Gmail (Developer App) and grant Pipedream permission to connect to your account. Pipedream securely stores and automatically refreshes the OAuth tokens so you can easily authenticate any Gmail (Developer App) API.

Pipedream requests the following authorization scopes when you connect your account:

do not use

About Gmail (Developer App)#

Private and secure email by Google at no cost, for business and consumer accounts. Use this app to connect your own developer account credentials.

Action#

Create A New Job on VisualPing

Description:Creates a new job that will belong to a given user or workspace. [See the docs here](https://develop.api.visualping.io/doc.html#tag/Jobs/paths/~1v2~1jobs/post)

Version:0.0.2

Key:visualping-create-job

View on GitHub

VisualPing Overview#

VisualPing is a tool that lets you monitor web pages for changes. Using its API with Pipedream, you can automate reactions to those changes. For instance, you can set up workflows that notify you or your team when specific parts of a web page update, or use changes to trigger downstream actions in other apps. Pipedream's serverless platform enables you to connect VisualPing with a vast array of apps to create custom, automated workflows without writing a lot of code.

Action Code#

import visualping from "../../app/visualping.app.mjs";

export default {
  key: "visualping-create-job",
  name: "Create A New Job",
  version: "0.0.2",
  description: "Creates a new job that will belong to a given user or workspace. [See the docs here](https://develop.api.visualping.io/doc.html#tag/Jobs/paths/~1v2~1jobs/post)",
  type: "action",
  props: {
    visualping,
    email: {
      propDefinition: [
        visualping,
        "email",
      ],
      optional: true,
    },
    business: {
      propDefinition: [
        visualping,
        "business",
      ],
      optional: true,
    },
    locale: {
      propDefinition: [
        visualping,
        "locale",
      ],
      optional: true,
    },
    siteReferer: {
      propDefinition: [
        visualping,
        "siteReferer",
      ],
      optional: true,
    },
    adCampaign: {
      propDefinition: [
        visualping,
        "adCampaign",
      ],
      optional: true,
    },
    origin: {
      propDefinition: [
        visualping,
        "origin",
      ],
      optional: true,
    },
    contentType: {
      propDefinition: [
        visualping,
        "contentType",
      ],
      optional: true,
    },
    url: {
      propDefinition: [
        visualping,
        "url",
      ],
    },
    description: {
      propDefinition: [
        visualping,
        "description",
      ],
    },
    mode: {
      propDefinition: [
        visualping,
        "mode",
      ],
      reloadProps: true,
    },
    active: {
      propDefinition: [
        visualping,
        "active",
      ],
    },
    interval: {
      propDefinition: [
        visualping,
        "interval",
      ],
    },
    trigger: {
      propDefinition: [
        visualping,
        "trigger",
      ],
    },
    targetDevice: {
      propDefinition: [
        visualping,
        "targetDevice",
      ],
      reloadProps: true,
    },
    proxy: {
      propDefinition: [
        visualping,
        "proxy",
      ],
      optional: true,
    },
    fixedProxyAlias: {
      propDefinition: [
        visualping,
        "fixedProxyAlias",
      ],
      optional: true,
    },
    xpath: {
      propDefinition: [
        visualping,
        "xpath",
      ],
      optional: true,
    },
    renderer: {
      propDefinition: [
        visualping,
        "renderer",
      ],
      optional: true,
    },
    disableJS: {
      propDefinition: [
        visualping,
        "disableJS",
      ],
      optional: true,
    },
    pageHeight: {
      propDefinition: [
        visualping,
        "pageHeight",
      ],
      optional: true,
    },
    waitTime: {
      propDefinition: [
        visualping,
        "waitTime",
      ],
      optional: true,
    },
    preactionsActive: {
      propDefinition: [
        visualping,
        "preactionsActive",
      ],
      optional: true,
    },
    preactionsObjects: {
      propDefinition: [
        visualping,
        "preactionsObjects",
      ],
      optional: true,
    },
    advancedScheduleActive: {
      propDefinition: [
        visualping,
        "advancedScheduleActive",
      ],
      optional: true,
      reloadProps: true,
    },
    multicheckEnabled: {
      propDefinition: [
        visualping,
        "multicheckEnabled",
      ],
      optional: true,
    },
    enableSmsAlert: {
      propDefinition: [
        visualping,
        "enableSmsAlert",
      ],
      default: false,
    },
    enableEmailAlert: {
      propDefinition: [
        visualping,
        "enableEmailAlert",
      ],
      default: false,
    },
    useSlackNotification: {
      propDefinition: [
        visualping,
        "useSlackNotification",
      ],
      default: false,
      reloadProps: true,
    },
    useTeamsNotification: {
      propDefinition: [
        visualping,
        "useTeamsNotification",
      ],
      default: false,
      reloadProps: true,
    },
    useWebhookNotification: {
      propDefinition: [
        visualping,
        "useWebhookNotification",
      ],
      default: false,
      reloadProps: true,
    },
    useDiscordNotification: {
      propDefinition: [
        visualping,
        "useDiscordNotification",
      ],
      default: false,
      reloadProps: true,
    },
    useSlackAppNotification: {
      propDefinition: [
        visualping,
        "useSlackAppNotification",
      ],
      default: false,
      reloadProps: true,
    },
    workspaceId: {
      propDefinition: [
        visualping,
        "workspaceId",
      ],
    },
  },
  async additionalProps() {
    const props = {};
    if (this.targetDevice && (this.targetDevice === "1" || this.targetDevice === "3")) {
      props.cropX = {
        type: "integer",
        label: "Crop X",
        description: "Start X position to the crop.",
      };
      props.cropY = {
        type: "integer",
        label: "Crop Y",
        description: "Start Y position to the crop.",
      };
      props.cropWidth = {
        type: "integer",
        label: "Crop Width",
        description: "The width of the crop.",
      };
      props.cropHeight = {
        type: "integer",
        label: "Crop Height",
        description: "The height of the crop.",
      };
    }
    if (this.mode && this.mode === "TEXT") {
      props.keywordAction = {
        type: "string",
        label: "Keyword Action",
        description: "Keyword detection mode.",
        optional: true,
        options: [
          "ADDED",
          "ALL",
          "DELETED",
        ],
      };
      props.keywords = {
        type: "string[]",
        label: "Keywords",
        description: "List of keywords.",
        optional: true,
      };
    }
    if (this.advancedScheduleActive) {
      props.stopTime = {
        type: "integer",
        min: 0,
        max: 24,
        label: "Stop Time",
        description: "The time to stop.",
      };
      props.startTime = {
        type: "integer",
        min: 0,
        max: 24,
        label: "Start Time",
        description: "The time to start.",
      };
      props.activeDays = {
        type: "integer[]",
        label: "Active days",
        description: "List of days from 1 to 7.",
      };
    }
    if (this.useSlackNotification) {
      props.slackUrl = {
        type: "string",
        label: "Slack URL",
        description: "The URL to the slack notification.",
      };
      props.slackChannels = {
        type: "string[]",
        label: "Slack Channels",
        description: "A list of slack's channels.",
      };
    }
    if (this.useTeamsNotification) {
      props.teamsUrl = {
        type: "string",
        label: "Teams URL",
        description: "The URL to the teams notification.",
      };
    }
    if (this.useWebhookNotification) {
      props.webhookUrl = {
        type: "string",
        label: "Webhook URL",
        description: "The URL to the webhook notification.",
      };
    }
    if (this.useDiscordNotification) {
      props.discordUrl = {
        type: "string",
        label: "Discord URL",
        description: "The URL to the discord notification.",
      };
    }
    if (this.useSlackAppNotification) {
      props.slackAppUrl = {
        type: "string",
        label: "Slack App URL",
        description: "The URL to the slack app notification.",
      };
      props.slackAppChannels = {
        type: "string[]",
        label: "Slack App Channels",
        description: "A list of slack app' channels.",
      };
    }
    return props;
  },
  async run({ $ }) {
    const {
      visualping,
      adCampaign,
      targetDevice,
      fixedProxyAlias,
      disableJS,
      pageHeight,
      waitTime,
      preactionsActive,
      preactionsObjects,
      advancedScheduleActive,
      multicheckEnabled,
      enableSmsAlert,
      enableEmailAlert,
      useSlackNotification,
      useTeamsNotification,
      useWebhookNotification,
      useDiscordNotification,
      useSlackAppNotification,
      workspaceId,
      cropX,
      cropY,
      cropWidth,
      cropHeight,
      keywordAction,
      keywords,
      mode,
      trigger,
      stopTime,
      startTime,
      activeDays,
      slackUrl,
      slackChannels,
      teamsUrl,
      webhookUrl,
      discordUrl,
      slackAppUrl,
      slackAppChannels,
      ...data
    } = this;

    const advancedSchedule = advancedScheduleActive
      ? {
        stop_time: stopTime,
        start_time: startTime,
        active_days: activeDays,
      }
      : null;

    const nofiticationConfig = {};
    if (useSlackNotification) {
      nofiticationConfig.slack = {
        url: slackUrl,
        active: true,
        channels: slackChannels,
      };
    }
    if (useTeamsNotification) {
      nofiticationConfig.teams = {
        url: teamsUrl,
        active: true,
      };
    }
    if (useWebhookNotification) {
      nofiticationConfig.webhook = {
        url: webhookUrl,
        active: true,
      };
    }
    if (useDiscordNotification) {
      nofiticationConfig.discord = {
        url: discordUrl,
        active: true,
      };
    }
    if (useSlackAppNotification) {
      nofiticationConfig.slack_app = {
        url: slackAppUrl,
        active: true,
        channels: slackAppChannels,
      };
    }

    const crop = (this.targetDevice && (this.targetDevice === "1" || this.targetDevice === "3")) ?
      {
        x: cropX,
        y: cropY,
        width: cropWidth,
        height: cropHeight,
      }
      : null;

    const response = await visualping.createJob({
      $,
      data: {
        ...data,
        ad_campaign: adCampaign,
        target_device: targetDevice,
        fixed_proxy_alias: fixedProxyAlias,
        disable_js: disableJS,
        page_height: pageHeight,
        wait_time: waitTime,
        preactions: {
          active: preactionsActive,
          actions: preactionsObjects,
        },
        trigger,
        advanced_schedule: advancedSchedule,
        mode,
        multicheck_enabled: multicheckEnabled,
        notification: {
          enableSmsAlert,
          enableEmailAlert,
          configuration: {
            ...nofiticationConfig,
          },
          threshold: {
            VISUAL: parseFloat(trigger),
            TEXT: parseFloat(trigger),
            WEB: parseFloat(trigger),
          },
        },
        workspaceId,
        crop,
        keyword_action: keywordAction,
        keywords: keywords && keywords.toString(),
      },
    });

    $.export("$summary", `A new job with id ${response.id} was successfully created!`);
    return response;
  },
};

Action Configuration#

This component may be configured based on the props defined in the component code. Pipedream automatically prompts for input values in the UI.

Label	Prop	Type	Description
VisualPing	`visualping`	`app`	This component uses the VisualPing app.
Email	`email`	`string`	An email for internal use.
Business	`business`	`boolean`	For internal use.
Locale	`locale`	`string`	Locale for internal use.
Site Referer	`siteReferer`	`string`	Site Referer for internal use.
Ad Campaign	`adCampaign`	`object`	For internal use.
Origin	`origin`	`string`	For internal use.
Content Type	`contentType`	`string`	For internal use.
URL	`url`	`string`	Url of the web page monitored by this job.
Description	`description`	`string`	Job Description
Mode	`mode`	`string`	Select a value from the drop down menu:`TEXTVISUALWEB`
Active	`active`	`boolean`	Whether the job is active or paused.
Interval	`interval`	`string`	Job's crawling interval expressed in minutes. Examples: `5`, `15`, `1440`...
Trigger	`trigger`	`string`	Job's diff detection trigger expressed in percents. Examples: `0.1`, `25`...
Target Device	`targetDevice`	`string`	Select a value from the drop down menu:`{ "label": "1 - Area", "value": "1" }{ "label": "2 - Mobile", "value": "2" }{ "label": "3 - Specific Fold", "value": "3" }{ "label": "4 - All Page", "value": "4" }`
Proxy	`proxy`	`string`	String code representing the optional proxy to use for this job. Contact Visualping for details.
Fixed Proxy Alias	`fixedProxyAlias`	`string`	For internal use.
Xpath	`xpath`	`string`	Optional xpath representing the root web element to consider for this job.
Renderer	`renderer`	`string`	For internal use.
Disable JS	`disableJS`	`boolean`	For internal use.
Page Height	`pageHeight`	`string`	For internal use.
Wait Time	`waitTime`	`integer`	Number of seconds to wait the crawling and before applying any actions on the wab page.
Preactions Active	`preactionsActive`	`boolean`	Whether Preactions is active or not.
Preactions Objects	`preactionsObjects`	`any`	Array of `LegacyJobPreAction` objects.
Advanced Schedule Active	`advancedScheduleActive`	`boolean`	Whether advanced schedule is active or not.
Multicheck Enabled	`multicheckEnabled`	`string`	For internal use.
Enable SMS Alert	`enableSmsAlert`	`boolean`	Used to enable sms notifications for the considered job. Typically false.
Enable Email Alert	`enableEmailAlert`	`boolean`	Used to enable email notifications for the considered job. Typically false.
Use Slack Notification	`useSlackNotification`	`boolean`	If this job uses slack notification.
Use Teams Notification	`useTeamsNotification`	`boolean`	If this job uses teams notification.
Use Webhook Notification	`useWebhookNotification`	`boolean`	If this job uses webhook notification.
Use Discord Notification	`useDiscordNotification`	`boolean`	If this job uses discord notification.
Use Slack App Notification	`useSlackAppNotification`	`boolean`	If this job uses slack app notification.
Workspace ID	`workspaceId`	`string`	Select a value from the drop down menu.

Action Authentication#

VisualPing uses OAuth authentication. When you connect your VisualPing account, Pipedream will open a popup window where you can sign into VisualPing and grant Pipedream permission to connect to your account. Pipedream securely stores and automatically refreshes the OAuth tokens so you can easily authenticate any VisualPing API.

Pipedream requests the following authorization scopes when you connect your account:

Create A New Job with VisualPing API on New Attachment Received from Gmail (Developer App) API

Pipedream makes it easy to connect APIs for VisualPing, Gmail (Developer App) and 2,000+ other apps remarkably fast.

Trusted by 800,000+ developers from startups to Fortune 500 companies

Developers ♥ Pipedream

1-24of2,000+apps by most popular

1
-
24
of
2,000+
apps by most popular