Automated tests for your CSS.

python-needle, updated šŸ•„ 2022-11-05 17:23:40

Needle

Build Status

Needle is a tool for testing visuals with Selenium and nose.

It checks that visuals (CSS/fonts/images/SVG/etc.) render correctly by taking screenshots of portions of a website and comparing them against known good screenshots. It also provides tools for testing calculated CSS values and the position of HTML elements.

Example

This is what a Needle test case looks like:

```python from needle.cases import NeedleTestCase

class BBCNewsTest(NeedleTestCase): def test_masthead(self): self.driver.get('http://www.bbc.co.uk/news/') self.assertScreenshot('#blq-mast', 'bbc-masthead') ```

This example checks for regressions in the appearance of the BBC's masthead.

Documentation

Full documentation available on Read the Docs.

If you'd like to build the documentation yourself, first install sphinx:

pip install sphinx

Then run:

cd docs
make html

The documentation will then be available browsable from docs/_build/index.html.

Running Needle's test suite

First install tox (usually via pip install tox). Then:

$ tox

Issues

There is no heat map/color difference pytest-needly using PIL

opened on 2020-04-13 06:31:45 by rafeekabid

Team, Iā€™m using pytest-needle 0.3.11 using PIL engine to evaluate visual testing. Everything working as expected but in report unable to find the colour difference in the diff screenshot. In report, its showing actual screenshot, expected screenshot and difference. But unable to identify what is the difference. Is there any solution to get heat map (color) difference between two screenshot.

Thanks in advance and looking forward your support.

Regards, Rafeek

Empty diff file when using PerceptualDiff

opened on 2019-10-21 15:16:58 by timdiels

This is actually a duplicate of #61 but it got closed by the reporter.

I'm using the latest perceptualdiff, needle 0.5.0, python 3.7 (and pytest-needle 0.3.11).

When running a simple test and the new image does not match the baseline:

Traceback (most recent call last): File ".../test.py", line 174, in test needle.assert_screenshot('something') File ".../lib/python3.7/site-packages/pytest_needle/driver.py", line 322, in assert_screenshot self.engine.assertSameFiles(fresh_image_file, baseline_image, threshold) File ".../lib/python3.7/site-packages/needle/engines/perceptualdiff_engine.py", line 38, in assertSameFiles Image.open(diff_ppm).save(diff_png) File ".../lib/python3.7/site-packages/PIL/Image.py", line 2818, in open raise IOError("cannot identify image file %r" % (filename if filename else fp)) OSError: cannot identify image file '.../screenshots/something.diff.ppm'

something.diff.ppm turns out to be an empty file. When running perceptualdiff manually:

$ perceptualdiff baseline/something.png something.png --output some.ppm FAIL: Images are visibly different 86451 pixels are different Failed to save to 'some.ppm'

It shows an error, but as it turns out, this does work:

$ perceptualdiff baseline/something.png something.png --output some.png FAIL: Images are visibly different 86451 pixels are different Wrote difference image to some.png

perceptualdiff uses FreeImage since 1.0.2 (and it still does):

1.0.2 - [jt] Converted the loading and saving routines to use FreeImage

Even though FreeImage supports PPM, for some reason it doesn't work on my machine. Oddly enough gimp can write PPM and my image viewer can view it too. Anyway, all this can be avoided by requesting a png from perceptualdiff instead of a ppm and then converting it to png; and update the docs to require at least perceptualdiff >= 1.0.2.

Fix for miscropping on retina display

opened on 2019-05-05 00:47:46 by joshuamckenty

High resolution displays have more pixels than they ought to - image width and height has to be adjusted by the devicePixelRatio.

Test various mobile device and browser

opened on 2019-01-28 13:21:20 by tuan91

Hi, is it possible to test various mobile devices and browser? If so, how can I do that? Thank you!

Fix space problem in paths

opened on 2019-01-10 18:31:47 by sawt00th

Fix defect when ImageMagic compare utility or screenshot paths have space and tests were fall with error. Sandbox: Windows 7 x64 Python 3.6.5 x32

Element screenshots incorrect when page has been scrolled

opened on 2018-04-19 12:54:57 by jorenko

When the page has been scrolled, the element coordinates returned by NeedleWebElementMixin.get_dimensions() are relative to the top-left of the page, but the screenshot that get_screenshot() crops starts at the current scroll position. This results in the returned screenshot being of either the wrong part of the page or mostly/all blank, depending on the browser. To fix this, the current scroll position needs to be subtracted from the position, like so:

``` diff --git a/home/jjurack/.local/share/virtualenvs/test_web-6ViYfjms/lib/python3.6/site-packages/needle/driver-orig.py b/home/jjurack/.local/share/virtualenvs/test_web-6ViYfjms/lib/python3.6/site-packages/needle/driver.py index cd10b49..eceafe5 100644 --- a/home/jjurack/.local/share/virtualenvs/test_web-6ViYfjms/lib/python3.6/site-packages/needle/driver-orig.py +++ b/home/jjurack/.local/share/virtualenvs/test_web-6ViYfjms/lib/python3.6/site-packages/needle/driver.py @@ -63,8 +63,8 @@ class NeedleWebElementMixin(object): d = self.get_dimensions()

     # Cast values to int in order for _ImageCrop not to break
  • d['left'] = int(d['left'])
  • d['top'] = int(d['top'])
  • d['left'] = int(d['left']) - self._parent.execute_script('return window.scrollX')
  • d['top'] = int(d['top']) - self._parent.execute_script('return window.scrollY') d['width'] = int(d['width']) d['height'] = int(d['height']) ```

python css screenshot testing