Capture screenshots and upload to UI SCAN with one click. Easily spot design and code differences to improve quality efficiently.

Latest Version

Version
1.0.0
Update
June 27, 2024
Size
298KiB
Developer
Category
Users
37
Rating
4.5 ★
Manifest Version
3
Web Store Status
Languages Support
English
日本語
See more
Permissions
ActiveTab
Tabs
Debugger
Scripting
Storage
ContextMenus
See more

UI SCAN SS Uploader Extension

Automatically Detect Differences Between In-Development Web Pages and Designs

The UI SCAN SS Uploader is a tool designed to capture screenshots of mobile web pages under development and automatically upload them to UI SCAN. UI SCAN is an automated visual testing service that compares Figma designs with these screenshots to detect any differences.

By using the extension, you can automatically take screenshots of web pages under development from the same perspective as your Figma designs. These screenshots are then matched with Figma data on UI SCAN and scanned automatically.

The steps to use the UI SCAN SS Uploader are very simple:

1. After adding the extension to your browser, restart the browser.
2. Pin the UI SCAN SS Uploader icon to your toolbar.
3. Click the icon to launch the extension and enter your UI SCAN API key.
4. Select the \"Team\" and \"Project\" for which you want to upload screenshots.
5. Click the icon again, select the design screen to perform matching, and press the \"OK\" button.
6. The screenshot capture and scan will be executed immediately, so please check the results.

For subsequent uses, simply clicking the icon will allow you to take screenshots. To use the UI SCAN SS Uploader, you must register for UI SCAN and obtain an API key.

For more detailed instructions on how to use the extension, please visit the following guide sites:
https://help.ui-scan.com/en/upload-screenshots/use-chrome-ext

★★★ About UI SCAN ★★★
UI SCAN is a visual check tool that, for the first time, automatically compares \"design files (Figma data)\" with \"screenshots\" using a unique engine to detect differences. With UI SCAN, visual testing becomes much easier than before. For more details about UI SCAN, please visit the product page.
https://ui-scan.com/

If you encounter any issues with the extension or wish to provide feedback, please feel free to contact us using the form below.
https://ui-scan.com/ja-jp/inquiries-before-use
Read more

Source Manifest.json

{"update_url": "https://clients2.google.com/service/update2/crx", "name": "__MSG_name__", "manifest_version": 3, "version": "1.0.0", "description": "__MSG_extension_description__", "permissions": [ "activeTab", "tabs", "debugger", "scripting", "storage", "contextMenus" ], "icons": { "16": "./chrome/icon-16.png", "32": "./chrome/icon-32.png", "48": "./chrome/icon-48.png", "128": "./chrome/icon-128.png" }, "host_permissions": ["*://api.ui-scan.com/*"], "action": { "default_icon": { "16": "./chrome/icon-16.png", "24": "./chrome/icon-24.png", "32": "./chrome/icon-32.png" }, "default_title": "__MSG_name__", "default_popup": "./chrome/popup.html" }, "background": { "service_worker": "./chrome/background.js" }, "default_locale": "en", "options_ui": { "page": "./chrome/options.html", "open_in_tab": true }}
Read more