Watir-webdriver screenshot write to html file

Question

I created a method that takes a screenshot and then writes to an html file, inserting that screenshot into a table.

When I used Watir it worked fine (only really used IE browser).

Now I am using Watir-Webdriver and it takes the screenshots (on Firefox) and saves them just fine. However, when I write them to the html file they just show up on my html page as the little ripped paper icon.

This is my method:

def LogCapture(testID, passFail)

@passFail = passFail
@testID = testID
@time = Time.now.strftime("%m.%d.%Y %H.%M.%S")
@shotLoc = $FolderPath + "\\" + @passFail + @time + ".png"
$browser.screenshot.save @shotLoc

$fileHtml.puts"<TR><TD><@testID + " " + @passFail + " " + @time + "></TD></TR>"
$fileHtml.puts"<TR><TD><img src='" + @shotLoc + "'></TD></TR>" 
$log.info(@passFail)

end

I know that the Watir-Webdriver screenshots capture the entire length of the page, unlike Watir, but I have no idea why the screenshots are failing to display on my html file/page.

Thanks y'all

*SOLUTION: got it to display in both FF and IE when writing to the html file I just had to include: "file:\\localhost\" before my file path.

Thanks Justin! Go Maple Leafs!

I assume the "little ripped paper icon" means that the html file is not finding the required image. Did you validate that the html in the fileHtml output is correct and that the image exists where it should? — Justin Ko
That is what I assumed as well but I checked and it does have the correct path in the output. — Matt Pistella
I believe in firefox, you need to prefix the file path in the src with "file:///". For example "file:///C:/folder/image.jpg". But then I think it will only work in Firefox and not in IE. I guess you need to pick a single browser to view the report in. — Justin Ko
You can also use relative uri. (And I think it is better : you will be able to send the whole report with pictures to someone to show it) — Fabrice31
If your html file is in C:\Users\jetthehawk\Documents\WatirTests\Report => You should use ..\PostMigrationTests\ScreenLogs\PASSED. Logged In.06.07.2013 13.14.03.png — Fabrice31

p0deje p0deje · Accepted Answer · 2013-06-08T04:13:19

I prefer to save screenshots in base64 format instead of saving to PNG file as it works around all path issues and easy keeps history:

screenshot = $browser.screenshot.base64
$fileHtml.puts "<img src='data:image/png;base64,#{screenshot}'>"

Watir-webdriver screenshot write to html file

1 Answers