Attaching screenshots doesn't work for html reports

[nonkor]

Describe the bug The standard method of attaching screenshots embed (and its new alias attach) doesn't work anymore.

Both:

# 1
browser.screenshot.save path
attach path, 'image/png'

#2
encoded_img = browser.screenshot.base64
attach encoded_img, 'image/png;base64'

are showing the same results: label Embedded image without actual content

To Reproduce Steps to reproduce the behavior:

1. Embed screenshot in your code
2. Run the test with HTML formatter
3. Observe results

Expected behavior Image is attached in HTML report

Screenshots If applicable, add screenshots to help explain your problem.

Your Environment

• cucumber (4.1.0)
• macOS Catalina 10.15.4

[karamosky]

Hi @nonkor Thanks for reporting :) This seems to be a duplicate of #1420 Can you try updating the html-formatter dependency as described here

[vincent-psarga]

No @karamosky, 4.1 should have the latest html-formatter, so the screenshots should embed correctly. Could you provide the content of the file that is attached ? (The base64 encoded data)

(I'm wondering if there's some double base64 encoding happening there)

[nonkor]

@vincent-psarga here you go screenshot attached as a file:

<img alt="Embedded Image" src="data:image/png;base64,cmVzdWx0cy9zY3JlZW5zaG90MjAyMDA3MTBUMTU0NDMyLnBuZw==" class="attachment-image">

screenshot attached as base64 (it's huge, so, separate file) https://drive.google.com/file/d/1M0gZRaH_dZaNVtq3YowODn_cN_vFcHa-/view

[vincent-psarga]

Thanks for the data, so I've been able to reproduce the problem. What happens is that you are embedding a base64 encoded image and cucumber will encode it once again.

Can you try something like this ?

#2
encoded_img = browser.screenshot
attach encoded_img, 'image/png'

(so not using .base64 when attaching the file. I'm guessing that if you don't ask for base64 it'll produce the original content).

[nonkor]

Thanks, it works for next embedding:

img = browser.screenshot.png # there is no point to return browser.screenshot as it's just Watir::Screenshot instance
attach img, 'image/png'

The only thing confusing me - is there any way to hide screenshot? Attaching it as is makes html-report a bit ugly

[vincent-psarga]

Thanks, it works for next embedding:

Cool :)

The only thing confusing me - is there any way to hide screenshot? Attaching it as is makes html-report a bit ugly

Right now there's no option for that but it could be something interesting to work on (like using. a thumbnail by default).

[nonkor]

Great, i think ticket can be closed then. Thanks a lot!

[aslakhellesoy]

I'm reopening this since it should be possible to attach images as pre-encoded base64. See https://github.com/cucumber/cucumber/issues/1116#issuecomment-670480059

[aslakhellesoy]

People frequently misuse the attach method like this:

attach(path, 'image/png')

This will attach the filename as an image, which isn't what the user wants. This is correct usage:

attach(File.read(path, 'rb'), 'image/png')

This isn't obvious to users, so we should detect the improper usage and throw an error if people try to attach file paths as images.

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed in a week if no further activity occurs.

[stale[bot]]

This issue has been automatically closed because of inactivity. You can support the Cucumber core team on opencollective.

[harihere]

Do we have any workaround to this issue ?

[aurelien-reeves]

Hi @harihere

Several topics have been mentioned as part of this issue. What issue are you talking about? What are you trying to achieve without success?

[harihere]

@aurelien-reeves ,

Not able to attach base 64 screenshots to cucumber reports. io.cucumber - 6.9.1 Report - net.masterthought cucumber-reporting -5.6.1 Language -- Java

Example :

final  String  Screenshot =((TakesScreenshot) driver).getScreenshotAs(OutputType.BASE64);
SCENARIO.attach(Screenshot,"image/png","BASE64");

[aurelien-reeves]

Ok, thanks.

The workaround for this is to not encode the screenshot to base64. Cucumber will encode the data itself. Unfortunately there is no other workaround yet for this :(

At least for cucumber-ruby. As you are using cucumber-jvm, there may be some differences.

May I suggest to continue the discussion here: https://github.com/cucumber/common/issues/1116?

[atulsarkar1]

Finally it's works for me. ✅

ruby: 2.7.3
cucumber (5.3.0)

After do |scenario|
  Dir::mkdir('screenshots') unless File.directory?('screenshots')
  screenshot = "./screenshots/FAILED_#{scenario.name.gsub(' ', '_').gsub(/[^0-9A-Za-z_]/, '')}.png"
  if scenario.failed?
    @browser.driver.save_screenshot(screenshot)
    # Read the screenshot file as binary data
    screenshot_data = File.read(screenshot, mode: 'rb')
    # Encode the screenshot data to base64
    attach(screenshot_data, 'image/png')
    attach @browser.browser.url, 'text/html'
    attach get_js_errors, 'text/html'
  end
  @browser.close
end