[New Plugin]: Screenshot Element Pro

Showcase
21

Yeah, actually it’s possible but the source code should be changed.
I will try to add iFrame support in next plugin release!

2 Likes
22

That would be amazing! Thank you

1 Like
23

Purchased the plugin as a sign of support! Hopefully you can make the iFrames work. Otherwise, still $7 worth spending to support y’all.

2 Likes
24

Hi @gbenchanoch ,

I really appreciate your support! :pray: Thank you so much!
However, I have bad news here :confused: Actually it looks like it’s technically not possible to take a screenshot of an iframe with the library that this plugin uses. It’s because of the CORS security. Which means you can screenshot an iframe rendering an URL on the same domain as your Bubble app.
I’m really sorry to promise something that I couldn’t do…

1 Like
25

It’s ok! Are there any libraries that can capture iFrames?

26

Hi @BubbleSam

Please view this image: Screenshot-2021-08-03-210151 — ImgBB
When using your plugin to capture the circle. I want it include the map behind it. How can it be done?

Thank you.

27

@BubbleSam do you think this screenshot plugin would work with this plugin’s element?

28

Hi @locnguyen1312 have you tried to group both elements and capture the parent?

29

Well… I think it should work!
If you want, you can create a simple demo app using that plugin and we can test it together.

30

Hi @BubbleSam,
Love the plugin so far, although I think there’s a bug with the plugin having two ScreenshotElement elements on the same page with 2 screenshot URLs being generated at a single click.

How to replicate:

  1. Have two screenshotelement elements on a page. (e.g A and B)
  2. Assign workflow to a button that generates two URLs for screenshot element A and B.
  3. Create a thing that stores URL A and B.
  4. Click the button to generate both URLs and only 1 URL will be stored (either A or B) in the database. (although file manager shows the both URLs are generated)
    However, if you click the button to generate the URLs again both will be stored consistently until you refresh again and only 1 URL will be stored. If you always refresh the page before you press the button then only 1 URL will be saved.

Screenshots for reference:

c4
c41301×469 95.7 KB

c2
c21544×720 25.5 KB

c3
c31545×743 44.4 KB

*note how screenshot element A’s URL is always being stored but B’s

This happens consistently on all of my pages, so I’m not sure if its a bug or if I did something wrong, thanks for having a look at it!

EDIT:
After more testing the way to work around this is apparently just switching the steps of generating URLs of A and B and it consistently stores both URLs regardless of if you refresh the page or not

e.g:

image
image1800×580 21.3 KB

2 Likes
31

Thank you for your detailed feedback and I’m happy that you’ve found a workaround!
However, we’ll try to replicate the issue and fix it ASAP, if possible!

32

This works perfectly for me, with the exception of one glitch. When I put on image on a page, I have the option of rescaling, zooming, or stretching. The screenshot of the element seems to ignore what I select (zoom) and stretches it instead.

33

Hi @BubbleSam ,

I have tested the plugin and when I try to screenshot a video player element (which is not playing but showing the image of the first frame of the video prior to playing). I get a black image.

I am attempting to screenshot via Element ID using Video.js plugin. I tested the workflow with a static image and it works fine so seems to be an issue with the video player element.

Does this work for video player elements?

Any help much appreciated!

Scott

34

@BubbleSam

For context on the above I am trying to create a thumbnail image for a video and save it to my bubble app database.

Thank you.
Scott

35

Hi @jeffmccutcheon ,
Hi @scott.ETK ,

I’m afraid it won’t be possible to easily fix these issues :frowning: This plugin depends on a JS library that is responsible for capturing the screen. But I’m looking for a solution… Maybe we’ll need to use another method to take screenshots…

36

My screenshots are missing the element (10 pixels to the left) Here is a screenshot of an empty group with a solid border
ad.jpg(8)

37

Hi @jeffmccutcheon ,
Thank you for reporting this.

  1. This behaviour is the same on different browsers (Chrome, FF, Safari) ?
  2. Could you please send me a simple demo app that reproduces the issue?
38

Hello. It happens in all browsers (mac and windows) except Safari

I cannot recreate the issue on a new site, so there’s something conflicting on my site. However I uninstalled every other plugin and the problem persisted. Can you think of what it might be? I can invite you as a collab if that helps

39

Hi,
I purchased the advanced/pro version.

Is there a way to generate a screenshot from API/backend workflows using a recurring workflow.

For each user, I need to generate a chart screenshot, put it in the data type, then send an email with the chart in it. The email needs to be sent out automatically, daily, whether the user logs in or not.

Thanks,
Guy

40

Hi Guy,

This extension allows to capture screenshots only on the client side. So unfortunately it won’t work on the server side. The screenshot element must be placed on the page and called from the same page.