Skip to content
This repository has been archived by the owner. It is now read-only.

[Extent 3.0.1] base64 string image won't display on lightbox #715

Closed
egeaksoz opened this issue Dec 13, 2016 · 10 comments
Closed

[Extent 3.0.1] base64 string image won't display on lightbox #715

egeaksoz opened this issue Dec 13, 2016 · 10 comments
Labels

Comments

@egeaksoz
Copy link

@egeaksoz egeaksoz commented Dec 13, 2016

Hi @anshooarora,

I was able to create a base64string image on report with the following code:

String base64Screenshot = "data:image/png;base64,"+ ((TakesScreenshot)driver.getScreenshotAs(OutputType.BASE64);
test.log(Status.FAIL, "Test Failed", test.addScreenCapture(base64Screenshot));

Though it shows the screenshot on test report, lightbox won't work and displays blank page.

@anshooarora
Copy link
Owner

@anshooarora anshooarora commented Dec 28, 2016

Base64 images are currently not supported in this version due to issues they have caused on the previous versions and ExtentX. Due to the amount of space they take (these can be extremely long strings) - they blow up the size of the HTML file and also slow down queries in ExtentX.

There have been similar requests earlier but I do not plan to add this feature in version 3 due to the above. Or, maybe I will add it and not support issues that arise out of it. I am leaning more towards the latter, will update this thread soon with my decision.

@email2vimalraj
Copy link
Collaborator

@email2vimalraj email2vimalraj commented Dec 29, 2016

We might have to look this problem in a different way. The addBase64Screenshot should be changed to take the base64 string and compress using gzip technique. Then in the report, we should use some javascript to unzip the compressed base64 string. This would help in reducing the size of the file and the data sent to the database.

@SrinivasTangella
Copy link

@SrinivasTangella SrinivasTangella commented Jan 2, 2017

@savatagean , @email2vimalraj @anshooarora
I have experienced same issues earlier ( Size of screenshots and not able to add the images inline in the latest 3.x versions.
Below is the solution:

  1. Reducing the size of the screenshots
    I have searched the web and with the help of some Java blogs, came up with an idea of resizing the screenshot. So credit goes to the guys who posted the help in the blogs. I don't exactly remember the links.
  2. Adding screenshots inline.

Reducing the size of the screenshots:

  • Create a function that will do the resizing and call it. See below:

public void processPicture(String inputFilePath, String outputFilePath, int interpolationMethod, double sigmaFactor) {

	double scaleFactor = 0.1;

	Opener opener = new Opener();

    ImageProcessor ip = opener.openImage(inputFile).getProcessor();
    

 //  for medium sized screenshot use scaleFactor 0.15.
    scaleFactor = 0.2;
    	
ip.blurGaussian(sigmaFactor / scaleFactor);
ip.setInterpolationMethod(interpolationMethod);
ImageProcessor outputProcessor = ip.resize((int)(ip.getWidth() * scaleFactor), (int)(ip.getHeight()*scaleFactor));
IJ.saveAs(new ImagePlus("", outputProcessor), outputFilePath.substring(outputFilePath.lastIndexOf('.')+1), outputFilePath);
    }

}`

Now call the function:
processPicture(imageFile, imageFile_resized, ImageProcessor.NONE, 0.3);

Result: In my case, for a mobile screenshot , the original size may be around 1MB or more. With the processing as given above the size of the screenshot comes down to very very less size of around 10 to 30KB only.

Adding inline screenshot images in Extent 3.0
Add the below string in your log statements. It will add the required image file under the log statement in your extent html logs.

<ul class='screenshots'>
<li>
<img data-featherlight= imageFilePath width='20%' src='' data-src=' imageFilePath'>
</li>
</ul>

Hope that helps.

@egeaksoz
Copy link
Author

@egeaksoz egeaksoz commented Jan 2, 2017

Thank you guys for your answers. I switched back to v2.4. But @SrinivasTangella I will try it and tell if it works or not.

@SrinivasTangella
Copy link

@SrinivasTangella SrinivasTangella commented Jan 2, 2017

@savatagean

By the by, I have forgot to mention that while capturing the screenshot do it as below:
OutputType.FILE, but not OutputType.BASE64

File scrFile = ((TakesScreenshot) getDriver()).getScreenshotAs(OutputType.FILE);

It should work. Because I had similar issue and the fix I have mentioned is what I have currently implemented and working.

@danielsidler
Copy link

@danielsidler danielsidler commented Apr 6, 2017

Hi Anshoo. Any update on Base64 image support for version 3.x? I email the reports out to clients who don't have shared folder access, and this is the only way I know to give them screenshots in the report.

@tibile
Copy link

@tibile tibile commented May 10, 2017

Hi @anshooarora,
Is there have any update on Base64 image in ExtentReport 3.0.5 and higher?
Now, I'm unable to send the email report with to my client because the attach screenshot does not add into it, so fails to view in the client view :(.
Could you provide me a solution for this issue?
Thanks!

@harsh976
Copy link

@harsh976 harsh976 commented Jul 6, 2017

@anshooarora
Hi can i use base64 string in v3.0.4 I can't see any method like addBase64ScreenShot.Please help on how to do that.

@anshooarora
Copy link
Owner

@anshooarora anshooarora commented Jul 8, 2017

This feature will be part of 3.0.7.

@harsh976
Copy link

@harsh976 harsh976 commented Jul 8, 2017

When will 3.0.7 will be available and with that will the screenshot be displayed in extentx as well ?

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
7 participants
You can’t perform that action at this time.