pixelmatch
loki
Our great sponsors
pixelmatch | loki | |
---|---|---|
5 | 5 | |
5,837 | 1,734 | |
1.5% | - | |
3.1 | 6.9 | |
8 months ago | 24 days ago | |
JavaScript | JavaScript | |
ISC License | MIT License |
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.
loki
-
Has anyone automated storybook for visual regression tests with loki.js?
I am looking to automate storybook as part of visual testing on components. Client has suggested to try loki.js - https://loki.js.org/ . Any leads would be much appreciated!
-
Is there a way to automatically find UI related/CSS bugs, something that works like unit testing but it's UI?
I’ve used https://loki.js.org/ in the past. Would recommend.
-
Visual regression tests for Storybook with Loki
Loki is a tool that makes it easy to test Storybook projects for visual regressions. Loki was used for the trial stage at Thoughtworks tech radar.
- Loki – Visual Regression Testing for Storybook
-
Visual Regression Testing with Playwright
Popular libraries such as BackstopJS for Puppeteer, or Loki provides developers and QA with powerful techniques to quickly, and easily, set up visual regression testing.
What are some alternatives?
odiff - The fastest pixel-by-pixel image visual difference tool in the world.
BackstopJS - Catch CSS curve balls.
Cypress - Fast, easy and reliable testing for anything that runs in a browser.
AyeSpy - A performant visual regression testing tool
cavy - An integration test framework for React Native.
vue-testing-library - 🦎 Simple and complete Vue.js testing utilities that encourage good testing practices.
applitools-eyes-action - GitHub Action to add automated, AI-powered Visual Testing to your app
cypress-visual-regression - Module for adding visual regression testing to Cypress
react-native-typography - Pixel–perfect, native–looking typographic styles for React Native ✒️
TestCafe - A Node.js tool to automate end-to-end web testing.
eleventy-react - Use React components in Eleventy.