pixelmatch
awesome-regression-testing
Our great sponsors
| pixelmatch | awesome-regression-testing | |
|---|---|---|
| 5 | 5 | |
| 5,837 | 2,102 | |
| 1.5% | - | |
| 3.1 | 3.3 | |
| 8 months ago | about 2 months ago | |
| JavaScript | ||
| ISC License | Creative Commons Attribution Share Alike 4.0 |
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
pixelmatch
-
Immich - High-performance self-hosted backup photos/videos from your mobile phone (kinda like a Google Photos replacement) - Progress update July 27th, 2022. The album feature on the web is here 🎉
I'm the dev for a javascript-based reddit bot that implements image comparisons using both pixel matching and/or perceptual hashes (that could be stored in a DB). I'd be happy to go over high-level or implementation details if its something your team would be interested in. Either on github or elsewhere.
-
JS Question
There are quite a few image comparison libraries in pure Javascript for both node and browser.
-
Show HN: Instantly create a GitHub repository to take screenshots of a web page
You could absolutely get this working with GitHub Actions with a bit of creativity.
I've been playing around with my own image-diff tool for this kind of thing, but it's not yet in a decent state: https://github.com/simonw/image-diff - there are other, better options out there such as https://github.com/mapbox/pixelmatch
Needle is an older system that did this using Selenium - updating that to work with Playwright (or Playwight via shot-scraper) would be an interesting project: https://github.com/python-needle/needle
-
Visual Regression Testing with Playwright
Internally, Playwright Test uses the pixelmatch library to compare screenshots for visual differences. It is possible to pass several options to this library, to fine-tune the comparison of images. The most important option is the threshold option, which indicates the threshold amount of differences allowed between two images.
-
An Introduction to Scraping (Almost) Anything With Puppeteer and Node.js
Other use-cases include combining screenshots with the Autocode scheduler, a file hosting platform like Box, and a package like pixelmatch to create daily screenshot diffs for regression testing.
awesome-regression-testing
-
Ask HN: How do you track copy changes on websites/emails?
Visual Regression Testing: Awesome List
https://github.com/mojoaxel/awesome-regression-testing
- Mojoaxel/awesome-regression-testing: visual regression testing
-
Way to High Confidence: The Ideal Testing Trophy
… There are many tools for visual testing.
-
Poor man's visual regression testing
You could set up automatic visual regression testing on your CI pipeline with tools from the "Awesome Visual Regression Testing" list. That would probably be the safest option. But it requires some setup and time to get used to the tools.
-
Show HN: Instantly create a GitHub repository to take screenshots of a web page
https://github.com/mojoaxel/awesome-regression-testing#tools...
"visual-regression": https://github.com/topics/visual-regression
Cypress.io can run in a CI job, does Time Travel, works with DevTools debugger, can take screenshots and video, and it looks like there's a visual regression testing thing for it: https://github.com/mjhea0/cypress-visual-regression
What are some alternatives?
odiff - The fastest pixel-by-pixel image visual difference tool in the world.
awesome-htmx - Awesome things about htmx
Cypress - Fast, easy and reliable testing for anything that runs in a browser.
needle - Automated tests for your CSS.
loki - 👁 Visual Regression Testing for Storybook
news-homepages - An open-source archive that gathers, saves, shares and analyzes news homepages
BackstopJS - Catch CSS curve balls.
shot-scraper-template - Template repository for setting up shot-scraper
vue-testing-library - 🦎 Simple and complete Vue.js testing utilities that encourage good testing practices.
image-diff - CLI tool for comparing images
cypress-visual-regression - Module for adding visual regression testing to Cypress
UneJournaux - https://www.liberation.fr/