How to embed base64 image in HTML using pytest-html?

Question

I am using python-appium client and generating a HTML report after the tests are finished. I would like to add the embedded images of the failure tests in the HTML report. The reason to embed the image is that I can access it from the remote machine as well. Here is the code which I tried and doesn't work on another system but locally it works:

@pytest.mark.hookwrapper
def pytest_runtest_makereport(item):
pytest_html = item.config.pluginmanager.getplugin('html')
outcome = yield
report = outcome.get_result()
extra = getattr(report, 'extra', [])

if report.when == 'call' or report.when == 'setup':
    xfail = hasattr(report, 'wasxfail')
    if (report.skipped and xfail) or (report.failed and not xfail):
        screenshot = driver.get_screenshot_as_base64()
        extra.append(pytest_html.extras.image(screenshot, ''))
    report.extra = extra

It seems to me that the encoded image is not generated properly as this is what I can see in the output HTML file:

<td class="extra" colspan="4">
        <div class="image"><a href="assets/75870bcbdda50df90d4691fa21d5958b.png"><img src="assets/75870bcbdda50df90d4691fa21d5958b.png"/></a></div>

and I expect "src" to not to end with ".png" and it should be long string of characters. I have no idea how to resolve this.

Answer 1

Your code is correct. However, the standard behaviour of pytest-html is that even if you pass the image as base64 string, it will still store a file in the assets directory. If you want to embed the assets in the report file, you need to pass the --self-contained-html option:

$ pytest --html=report.html --self-contained-html

Or store the option in the pytest.ini:

 # pytest.ini (or tox.ini or setup.cfg)
 [pytest]
 addopts = --self-contained-html

For the sake of completeness, here's the relevant spot in pytest-html readme:

Creating a self-contained report

In order to respect the Content Security Policy (CSP), several assets such as CSS and images are stored separately by default. You can alternatively create a self-contained report, which can be more convenient when sharing your results. This can be done in the following way:

$ pytest --html=report.html --self-contained-html

Images added as files or links are going to be linked as external resources, meaning that the standalone report HTML-file may not display these images as expected.

The plugin will issue a warning when adding files or links to the standalone report.