> For the complete documentation index, see [llms.txt](https://help.blings.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.blings.io/role-guides/developer/getting-started/how-to-connect-my-data-to-the-sdk/test-data-connection-with-a-dummy-video.md).

# Test data connection with a dummy video

### Why Test with a Dummy Video?

To ensure seamless data integration, it's crucial to test with a dummy MP5 video. This allows developers and testers to confirm that data connections between the video, HTML page, and personalized data are correctly established.

For project-specific QA, use Platform Simulation to test the actual Dynamic Data fields and selected lineup for the MP5 project.

{% content-ref url="/pages/VkH17x1J2SH1VmvzEgwU" %}
[Simulation](/apps/blings-platform/simulation.md)
{% endcontent-ref %}

### How to Test

Use the dummy video to validate data integration across various platforms—whether it's a webpage, CRM campaign, or mobile interface. Once your video design is finalized, simply swap out the dummy video with the final version in the SDK.

### Parameters and Testing

The dummy video accepts a variety of parameters—texts, numbers, media, etc. For testing, use only the parameters essential to your use case. For instance, to test an automated email sent from Hubspot upon a product purchase, you can use the following parameters

```jsx
data = {
  TEXT: {
    parameter_text_1: "contact.first_name",
    parameter_text_2: "delivery set to " + "delivery.time",
  },
  IMAGES: {
    parameter_image_1: "delivery.product.image_main",
  },
  LINKS: {
    parameter_url_1: "delivery.verify_deeplink",
  },
};
```

A successful test will display a dummy video featuring the user's name, delivery details, etc. Note that variable names will be updated to match those in the final video once it’s ready.

[**Online Demo Video**](https://assets.blings.io/player/index.html?env=master\&p=4ffd4332-17a7-4a79-b93c-b2b2af1f8ef7\&scenes=Scene%201\&id=test)

***

## Implementation Details:

**Project id**: `4ffd4332-17a7-4a79-b93c-b2b2af1f8ef7`

### **Supported Parameters**

The video accepts the following parameters:

| **Variable name**   | **Type**        | **Example usage**                                                         |
| ------------------- | --------------- | ------------------------------------------------------------------------- |
| parameter\_text\_1  | text            | first name, dynamic copy, personal offering, formatted price…             |
| parameter\_text\_2  | text            | “                                                                         |
| parameter\_text\_3  | text            | “                                                                         |
| parameter\_number   | number          | loyalty points, age, price…                                               |
| parameter\_image\_l | image URL       | product image, avatar…                                                    |
| parameter\_image\_2 | image URL       | “                                                                         |
| parameter\_url\_1   | URL             | CTA link, landing page…                                                   |
| parameter\_url\_2   | URL             | “                                                                         |
| parameter\_audio\_l | audio URL (mp3) | dynamic voice-over, win\lose sound effect…                                |
| Parameter\_video\_2 | video URL (mp4) | video clip, speaking avatar, dynamic footage, influencer reccomendations… |

With this data structure:

```tsx
interface variables_for_dummy_video {
    TEXT: {
        parameter_text_1
        parameter_text_2
        parameter_text_3
				parameter_number
    },
    IMAGES: {
        parameter_image_1
        parameter_image_2
    },
    LINKS: {
        parameter_url_1
        parameter_url_2
    },
    MEDIA: {
        parameter_audio_1
				parameter_video_1
    }
};
```

### demo code

```javascript
var settings = {
  // Blings video will replace an HTML element on screen
  container: document.getElementById("YOUR-HTML-ELEMENT"),
  // This option creates a full-screen video over black background
  cinematic: true,
};

// This is the data that will be used in the video.
// You can gather the data from any resource or API in real time
// and replace the values listed below.
// This data is never exposed to Blings.io!
var data = {
  TEXT: {
    parameter_text_1: "Text1x",
    parameter_text_2: "Text2x",
    parameter_text_3: "Text3x",
    parameter_number: 40,
  },
  IMAGES: {
    parameter_image_1: "https://d1t5lnx6iwscgl.cloudfront.net/projects/4ffd4332-17a7-4a79-b93c-b2b2af1f8ef7/assets/image/1696264168740_White_Blings_Logo_Horizontal.svg",
    parameter_image_2: "https://d1t5lnx6iwscgl.cloudfront.net/projects/4ffd4332-17a7-4a79-b93c-b2b2af1f8ef7/assets/image/1696242760858_White_Blings_Logo_Vertical-01.png",
  },
  LINKS: {
    parameter_url_1: "www.blings.io",
    parameter_url_2: "www.google.com",
  },
  MEDIA: {
    parameter_audio_1:
      "https://file-examples.com/storage/fe1e98be1065198f8a74ddc/2017/11/file_example_MP3_700KB.mp3",
    parameter_video_1:
      "https://d1t5lnx6iwscgl.cloudfront.net/projects/4ffd4332-17a7-4a79-b93c-b2b2af1f8ef7/assets/video/1696260756993_ForBiggerBlazes.mp4",
  },
};

// Define the scenes from which the video will be created
var scenes = [
  "Scene 1",
  //  "Scene 2",
  //  "Scene 3",
  //  "Scene 4",
  //  "Scene 5"
];

// Finally create the video
BlingsPlayer.create({
  project: { id: "4ffd4332-17a7-4a79-b93c-b2b2af1f8ef7" },
  data,
  settings,
  scenes,
});
```
