Html video element or iframe inside the plugin

Adobe XD
1

Hi guys,

it seems like currently you don’t support adding videos/iframe to the plugin itself (tell me if i am wrong)

i tried this way

     <iframe width="420" height="315" src="https://www.youtube.com/embed/tgbNymZ7vqY"></iframe>
          <video width="750" height="500" muted autoPlay className="QuickTipsModal_video">
            <source src="Imagen de iOS_1.MOV" type="video/mp4"></source>
          </video>

and both examples didn’t work.

i saw you post here regarding it:

but i wanted to clarify if you don’t support it, and when will you.

2

also one more thing i want to support it lottie json files.
i tried to install the “react-lottie” and follow the instructions but it seems like i get this error:

Plugin TypeError: Cannot set property ‘fillStyle’ of null

3

While only folks from Adobe are capable of answering

To the best of my knowledge, indeed, there’s currently no practical way to add videos or iframes to plugins.

May I, in part out of curiosity and in part since it might lead to devs having faced similar challenges to share their solutions, ask what your Use-Case for having videos within your plugin is?

While I haven’t used Lottie a lot, before, and am not too familiar with the technologies behind it, fillStyle looks like a canvas API (CanvasRenderingContext2D: fillStyle property - Web APIs | MDN). Canvas elements, like video and iframe, aren’t supported by UXP, as of right now (a somewhat related topic that also mentions canvases is Draw image using UXP).

I’m not sure if UXP allows for alternative rendering methods where, perhaps, some might work in UXP… But since any “more complex” animation library (such as Lottie appears to be) has a heavy focus on running in browsers using some “more advanced” browser features for performance optimization, I, unfortunately, don’t believe the chances of getting it to work are high, as of right now.

Again: If you could, perhaps, write about your Use-Case, somebody might be able to share a solution :slightly_smiling_face:

I hope that this helps, even though it’s probably not the answer you were hoping for :wink:

Happy Coding,
Pablo

4

Hi,

thank for the quick update.

the scenario is that we want to add videos to Anima product tour (the first time you will open the plugin, we want to show a flow of how to use it), we prefer adding mp4 videos/lottie because it is so smaller than gif usually.

that is our usecase.

1 Like