Linux 软件免费装
Banner图

VRTs - Visual Regression Tests

开发者 bleechberlin
更新时间 2024年3月13日 18:25
PHP版本: 7.0 及以上
WordPress版本: 6.4
版权: GPLv2 or later
版权网址: 版权信息

标签

visual tests regression vrts visual regression

下载

1.2.0 1.2.1 1.5.0 1.5.1 1.1.0 1.0.0 1.2.2 1.2.4 1.3.0 1.4.0 1.7.0 1.5.2 1.2.3 1.3.1 1.6.0 1.7.1 1.8.0

详情介绍:

VRTs - Visual Regression Tests is a plugin to test your website for unwanted visual changes. The plugin runs automatic daily tests for chosen pages and posts. The tool creates daily comparison screenshots and compares them with a reference snapshot. If there is a difference between the screenshots, you'll be automatically notified via email. Use three comparison modes to spot the differences easily. Please note: The website must be publicly accessible in order to set up and run the tests. Password protection or any kind of firewall might prevent the plugin from working correctly. YOUR STRATEGY TO SPOT UNWANTED CHANGES How do you usually check your website after updates and code changes? Do you go manually through all pages or do you just hope everything will run ok? Visual regression testing provides you a method that helps you find errors and visual abnormalities. The VRTs plugin gives you an environment to automate your process.
  1. Activate daily tests for any page or post: Upon activation, a reference screenshot is taken. This will be renewed when a post is saved or updated.
  2. Receive instant alerts: If a change is detected between the snapshot and the comparison screenshot, the plugin will create an alert and notify you via email. The daily test will be paused, until the alert is resolved.
  3. Compare two screenshots: Detect differences between the two snapshots with the difference, split screen or side-by-side view.
  4. Exclude elements: Prevent false positives by excluding dynamic elements, ads and animations from snapshots.
  5. Resolve tests: After fixing an issue, mark the alert as resolved. A new snapshot will be generated and the test will start running again.
USE CASES In which cases can visual regression testing help you spot issues? FEATURES FREE FOREVER GO PRO Do you like VRTs and want to run more tests? Unlock more features with our paid plans: See all pricing plans BUG-REPORT You found a bug? Please report it by creating an issue on the support forum. READ MORE You want to learn more about VRTs? Official product page: VRTs – Visual Regression Tests Resources: How does visual regression testing work?

安装:

INSTALL VRTS WITHIN WORDPRESS (recommended)
  1. Open Plugins > Add new
  2. Search for Visual Regression Tests
  3. Click install and activate the plugin
INSTALL VRTS MANUALLY THROUGH FTP
  1. Download the plugin on the WordPress plugin page
  2. Upload the ‘visual-regression-tests’ folder to the /wp-content/plugins/ directory
  3. Activate the VRTs plugin through the ‘Plugins’ menu in WordPress
AFTER ACTIVATION UPGRADE TO VRTS PRO
  1. Open VRTs > Upgrade
  2. Click Buy Pro
  3. Enter license key you have received after purchasing the plugin

屏幕截图:

  • Get an overview of all running and paused tests.
  • Get an overview of your alerts. Review and resolve them one by one.
  • The **difference view** merges the reference snapshot and the newly created screenshot. Differences between them are highlighted in red.
  • In the **split view** you can compare two snapshots with a vertical slider.
  • The **side by side view** displays two snapshots next to each other.
  • Run unlimited manual tests.

常见问题:

What is Visual Regression Testing?

With visual regression testing, you can detect errors and unwanted changes on your website by comparing a previous state of the website with a more recent one. For example, errors in the frontend can be caused by plugin updates and changes. For small websites, you may be able to find them right away, but for complex websites, it becomes difficult. A tool can help by taking pictures of pages and posts to detect visual changes and inform you automatically.

How does visual regression testing work?

Tests can be done manually, pixel-by-pixel, DOM-based or AI-based. In all cases you compare an earlier website state with a newer website state. Our Visual Regression Tests Plugin takes periodical screenshots and compares them on a split screen.

Why should I use a tool for visual regression tests?

You can do visual testing either manually or with automated tools. Checking your website for errors manually is time-consuming and less accurate. Automated tests may find errors that are minimal and irrelevant. But the chance of finding critical errors is much higher with a tool. As soon as you discover an error, you'll receive a warning so that you can fix the problem as soon as possible.

Is the testing done on my server?

Screenshots and comparisons are performed on an external server and sent to your WordPress website. Only required meta data is stored in your database.

Why are email notifications not working properly?

If our external screenshot service can not access your WordPress installation directly, test status updates and sending emails will be handled by the WP-Cron system. In order to be notified by the plugin about new alerts, please make sure that your WordPress instance can send emails and that the WordPress cron system is set up correctly. The default configuration of the WordPress cron system does not work reliably if you cache your site heavily, do not have frequent visitors or do not use wp-admin regularly. In this case, you should hook the WP-Cron into the system task scheduler, or use an external cron job scheduling service.

Does the plugin work with cookie consent banners?

Yes, cookie banners are not an issue. Before taking a snapshot, the tool can automatically trigger the Accept button to hide the banner. This option can be configured with CSS selectors in the plugin settings.

Can I test custom post type archives with VRTs?

The VRTs plugin primarily supports WordPress pages and posts. Automated visual testing of pages with dynamically changing content can lead to false positives. However, you can test such pages by following these steps:

  • Create a new blank page or post in WordPress.
  • Set up a redirect from this page to your desired URL.
  • Configure a test for this page. The screenshotter will follow the redirect.

更新日志:

1.8.0 1.7.1 1.7.0 1.6.0 1.5.2 1.5.1 1.5.0 1.4.0 1.3.1 1.3.0 1.2.4 1.2.3 1.2.2 1.2.1 1.2 1.1 1.0