Skip to content

Releases: webdriverio/visual-testing

@wdio/[email protected]

23 Jul 04:30
8b49c62
Compare
Choose a tag to compare

Major Changes

  • 1326e99: ## 💥 Major Release: New @wdio/image-comparison-core Package

    🏗️ Architectural Refactor

    This release introduces a completely new core architecture with the dedicated @wdio/image-comparison-core package, replacing the generic webdriver-image-comparison module with a WDIO-specific solution.

    What was the problem?

    • The old webdriver-image-comparison package was designed for generic webdriver usage
    • Complex integration between generic and WDIO-specific code
    • Limited test coverage (~58%) making maintenance difficult
    • Mixed responsibilities between core logic and service integration

    What changed?

    New dedicated core package: @wdio/image-comparison-core - purpose-built for WebdriverIO
    Cleaner architecture: Modular design with clear separation of concerns
    Enhanced test coverage: Improved from ~58% to ~90% across all metrics
    Better maintainability: Organized codebase with comprehensive TypeScript interfaces
    WDIO-specific dependencies: Only depends on @wdio/logger, @wdio/types, etc.

    🧪 Testing Improvements

    • 100% branch coverage on critical decision points
    • Comprehensive unit tests for all major functions
    • Optimized mocks for complex scenarios
    • Better test isolation and reliability
    Before/After % Stmts % Branch % Funcs % Lines
    Previous 58.59 91.4 80.71 58.59
    After refactor 90.55 96.38 93.99 90.55

    🔧 Service Integration

    The @wdio/visual-service now imports from the new @wdio/image-comparison-core package while maintaining the same public API and functionality for users.

    📈 Performance & Quality

    • Modular architecture: Easier to maintain and extend
    • Type safety: Comprehensive TypeScript coverage
    • Clean exports: Well-defined public API
    • Internal interfaces: Proper separation of concerns

    🔄 Backward Compatibility

    No breaking changes for end users
    Same public API maintained
    Existing configurations continue to work
    All existing functionality preserved

    🎯 Future Benefits

    This refactor sets the foundation for:

    • Easier addition of new features
    • Better bug fixing capabilities
    • Enhanced mobile and native app support
    • More reliable MultiRemote functionality

    📦 Dependency Updates

    • Updated most dependencies to their latest versions
    • Improved security with latest package versions
    • Better compatibility with current WebdriverIO ecosystem
    • Enhanced performance through updated dependencies

    Note: This is an architectural improvement that modernizes the codebase while maintaining full backward compatibility. All existing functionality remains unchanged for users.


Patch Changes

@wdio/[email protected]

23 Jul 04:30
8b49c62
Compare
Choose a tag to compare

Patch Changes

  • 3dbfa0e: fix: 990mclean script from package.json is now working on Windows

    Committers: 1

@wdio/[email protected]

23 Jul 04:30
8b49c62
Compare
Choose a tag to compare

Patch Changes

  • 75d31d1: fix: 657 in multiremote, commands are now executed on the requested instances (ocrGetText no longer loop)

    Committers: 1

@wdio/[email protected]

23 Jul 04:30
8b49c62
Compare
Choose a tag to compare

Major Changes

  • 1326e99: ## 💥 Major Release: New @wdio/image-comparison-core Package

    🏗️ Architectural Refactor

    This release introduces a completely new core architecture with the dedicated @wdio/image-comparison-core package, replacing the generic webdriver-image-comparison module with a WDIO-specific solution.

    What was the problem?

    • The old webdriver-image-comparison package was designed for generic webdriver usage
    • Complex integration between generic and WDIO-specific code
    • Limited test coverage (~58%) making maintenance difficult
    • Mixed responsibilities between core logic and service integration

    What changed?

    New dedicated core package: @wdio/image-comparison-core - purpose-built for WebdriverIO
    Cleaner architecture: Modular design with clear separation of concerns
    Enhanced test coverage: Improved from ~58% to ~90% across all metrics
    Better maintainability: Organized codebase with comprehensive TypeScript interfaces
    WDIO-specific dependencies: Only depends on @wdio/logger, @wdio/types, etc.

    🧪 Testing Improvements

    • 100% branch coverage on critical decision points
    • Comprehensive unit tests for all major functions
    • Optimized mocks for complex scenarios
    • Better test isolation and reliability
    Before/After % Stmts % Branch % Funcs % Lines
    Previous 58.59 91.4 80.71 58.59
    After refactor 90.55 96.38 93.99 90.55

    🔧 Service Integration

    The @wdio/visual-service now imports from the new @wdio/image-comparison-core package while maintaining the same public API and functionality for users.

    📈 Performance & Quality

    • Modular architecture: Easier to maintain and extend
    • Type safety: Comprehensive TypeScript coverage
    • Clean exports: Well-defined public API
    • Internal interfaces: Proper separation of concerns

    🔄 Backward Compatibility

    No breaking changes for end users
    Same public API maintained
    Existing configurations continue to work
    All existing functionality preserved

    🎯 Future Benefits

    This refactor sets the foundation for:

    • Easier addition of new features
    • Better bug fixing capabilities
    • Enhanced mobile and native app support
    • More reliable MultiRemote functionality

    📦 Dependency Updates

    • Updated most dependencies to their latest versions
    • Improved security with latest package versions
    • Better compatibility with current WebdriverIO ecosystem
    • Enhanced performance through updated dependencies
    • Remove unused packages

    Note: This is an architectural improvement that modernizes the codebase while maintaining full backward compatibility. All existing functionality remains unchanged for users.


    Committers: 1

[email protected]

25 May 06:33
9a0b63c
Compare
Choose a tag to compare

Patch Changes

  • d88d8dd: Optimize Mobile and Emulated device support

    🐛 Bugfixes

    #969 Fix layer injection on mobile devices

    On some devices the layer injection, to determine the exact position of the webview, was failing. It exceeded the appium timeout and returned an error like

    [1] [0-0] 2025-05-23T08:04:11.788Z INFO webdriver: COMMAND getUrl()
    [1] [0-0] 2025-05-23T08:04:11.789Z INFO webdriver: [GET] https://hub-cloud.browserstack.com/wd/hub/session/xxxxx/url
    [1] [0-0] 2025-05-23T08:04:12.036Z INFO webdriver: RESULT about:blank
    [1] [0-0] 2025-05-23T08:04:12.038Z INFO webdriver: COMMAND navigateTo("data:text/html;base64,CiAgICAgICAgPG .... LONG LIST OF CHARACTERS=")
    [1] [0-0] 2025-05-23T08:04:12.038Z INFO webdriver: [POST] https://hub-cloud.browserstack.com/wd/hub/session/xxxx/url
    [1] [0-0] 2025-05-23T08:04:12.038Z INFO webdriver: DATA {
    [1] [0-0]   url: 'data:text/html;base64,CiAgICAgICAgPGh0bWw.... LONG LIST OF CHARACTERS='
    [1] [0-0] }
    [1] [0-0] 2025-05-23T08:05:42.132Z ERROR @wdio/utils:shim: Error: WebDriverError: The operation was aborted due to timeout when running "url" with method "POST" and args "{"url":"data:text/html;base64,CiAgICAgICAgPGh0b.... LONG LIST OF CHARACTERS="}"
    [1] [0-0]     at FetchRequest._libRequest (file:///xxxxxxx/node_modules/webdriver/build/node.js:1836:13)
    [1] [0-0] 2025-05-23T08:05:42.132Z DEBUG @wdio/utils:shim: Finished to run "before" hook in 91147ms
    [1] [0-0]     at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    [1] [0-0]     at async FetchRequest._request (file:///C:/xxxxxx/node_modules/webdriver/build/node.js:1846:20)
    [1] [0-0]     at Browser.wrapCommandFn (c:/Projects/xxxxxx/node_modules/@wdio/utils/build/index.js:907:23)
    [1] [0-0]     at Browser.url (c:/Projects/xxxxxxx/node_modules/webdriverio/build/node.js:5682:3)
    [1] [0-0]     at Browser.wrapCommandFn (c:/Projects/xxxxxx/node_modules/@wdio/utils/build/index.js:907:23)
    [1] [0-0]     at async loadBase64Html (file:///C:/Projects/xxxxxx/node_modules/webdriver-image-comparison/dist/helpers/utils.js:377:5)
    [1] [0-0]     at async getMobileViewPortPosition (file:///C:/Projects/xxxxxx/node_modules/webdriver-image-comparison/dist/helpers/utils.js:417:9)
    [1] [0-0]     at async getMobileInstanceData (file:///C:/Projects/xxxxxx/node_modules/@wdio/visual-service/dist/utils.js:58:28)
    [1] [0-0]     at async getInstanceData (file:///C:/Projects/xxxxxxx/node_modules/@wdio/visual-service/dist/utils.js:189:77)
    [1] [0-0] 2025-05-23T08:05:42.144Z INFO @wdio/browserstack-service: Update job with sessionId xxxxx
    

    This was caused by the await url(data:text/html;base64,${base64Html}) that injected the layer. Some browsers couldn't handle the data:text/html;base64.

    We now fixed that with a different injection. It was tested on Android/iOS and on Sims/Emus/Real Devices and it worked

    Improve determining if a device is emulated

    In a previous release we added a function to determine if a device was emulated. This resulted in incorrect screen sizes that were used for the files names for devices. This caused or failing baselines, or new files to be created because the screen sizes were not available
    We now improved the check and the correct screen sizes are added again to the file names and made sure that the previous generated base line could be used again.

    Committers: 1

@wdio/[email protected]

25 May 06:33
9a0b63c
Compare
Choose a tag to compare

Patch Changes

  • d88d8dd: Optimize Mobile and Emulated device support

    🐛 Bugfixes

    #969 Fix layer injection on mobile devices

    On some devices the layer injection, to determine the exact position of the webview, was failing. It exceeded the appium timeout and returned an error like

    [1] [0-0] 2025-05-23T08:04:11.788Z INFO webdriver: COMMAND getUrl()
    [1] [0-0] 2025-05-23T08:04:11.789Z INFO webdriver: [GET] https://hub-cloud.browserstack.com/wd/hub/session/xxxxx/url
    [1] [0-0] 2025-05-23T08:04:12.036Z INFO webdriver: RESULT about:blank
    [1] [0-0] 2025-05-23T08:04:12.038Z INFO webdriver: COMMAND navigateTo("data:text/html;base64,CiAgICAgICAgPG .... LONG LIST OF CHARACTERS=")
    [1] [0-0] 2025-05-23T08:04:12.038Z INFO webdriver: [POST] https://hub-cloud.browserstack.com/wd/hub/session/xxxx/url
    [1] [0-0] 2025-05-23T08:04:12.038Z INFO webdriver: DATA {
    [1] [0-0]   url: 'data:text/html;base64,CiAgICAgICAgPGh0bWw.... LONG LIST OF CHARACTERS='
    [1] [0-0] }
    [1] [0-0] 2025-05-23T08:05:42.132Z ERROR @wdio/utils:shim: Error: WebDriverError: The operation was aborted due to timeout when running "url" with method "POST" and args "{"url":"data:text/html;base64,CiAgICAgICAgPGh0b.... LONG LIST OF CHARACTERS="}"
    [1] [0-0]     at FetchRequest._libRequest (file:///xxxxxxx/node_modules/webdriver/build/node.js:1836:13)
    [1] [0-0] 2025-05-23T08:05:42.132Z DEBUG @wdio/utils:shim: Finished to run "before" hook in 91147ms
    [1] [0-0]     at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    [1] [0-0]     at async FetchRequest._request (file:///C:/xxxxxx/node_modules/webdriver/build/node.js:1846:20)
    [1] [0-0]     at Browser.wrapCommandFn (c:/Projects/xxxxxx/node_modules/@wdio/utils/build/index.js:907:23)
    [1] [0-0]     at Browser.url (c:/Projects/xxxxxxx/node_modules/webdriverio/build/node.js:5682:3)
    [1] [0-0]     at Browser.wrapCommandFn (c:/Projects/xxxxxx/node_modules/@wdio/utils/build/index.js:907:23)
    [1] [0-0]     at async loadBase64Html (file:///C:/Projects/xxxxxx/node_modules/webdriver-image-comparison/dist/helpers/utils.js:377:5)
    [1] [0-0]     at async getMobileViewPortPosition (file:///C:/Projects/xxxxxx/node_modules/webdriver-image-comparison/dist/helpers/utils.js:417:9)
    [1] [0-0]     at async getMobileInstanceData (file:///C:/Projects/xxxxxx/node_modules/@wdio/visual-service/dist/utils.js:58:28)
    [1] [0-0]     at async getInstanceData (file:///C:/Projects/xxxxxxx/node_modules/@wdio/visual-service/dist/utils.js:189:77)
    [1] [0-0] 2025-05-23T08:05:42.144Z INFO @wdio/browserstack-service: Update job with sessionId xxxxx
    

    This was caused by the await url(data:text/html;base64,${base64Html}) that injected the layer. Some browsers couldn't handle the data:text/html;base64.

    We now fixed that with a different injection. It was tested on Android/iOS and on Sims/Emus/Real Devices and it worked

    Improve determining if a device is emulated

    In a previous release we added a function to determine if a device was emulated. This resulted in incorrect screen sizes that were used for the files names for devices. This caused or failing baselines, or new files to be created because the screen sizes were not available
    We now improved the check and the correct screen sizes are added again to the file names and made sure that the previous generated base line could be used again.

    Committers: 1

  • Updated dependencies [d88d8dd]

[email protected]

24 May 06:24
fd6d9db
Compare
Choose a tag to compare

Patch Changes

  • 2f9ec42: ## 🐛 Bug-fixes

    #967: Emulated device crops with enableLegacyScreenshotMethod set to true are not correct

    When a screenshot of an emulated device is taken, but the browser was initially started as a "desktop" session, so not with emulated caps, and the enableLegacyScreenshotMethod property is set to true, the DPR of the emulated device is taken. This resulted in incorrect crop. We now store the original dpr and use that for the crop when it's an emulated device and started as a desktop browser session.

    BiDi Fullpage screenshots for emulated device are broken

    The BiDi fullpage screenshot for an emulated device is broken in the driver. We now fallback to the legacy screenshot method for BiDi and emulated devices

    💅 Polish

    • Updated the multiple interfaces to use JS-Doc for better docs
    • When createJsonReportFiles is set to true and there are a lot of differences we kept waiting. We now limited that to check a max of 5M diff-pixels or a diff threshold of 20%. If it's bigger the report will show a full coverage and extra logs are shown in the WDIO logs, something like this
    [0-0] 2025-05-24T06:02:18.887Z INFO @wdio/visual-service:webdriver-image-comparison:pixelDiffProcessing: Processing diff pixels started
    [0-0] 2025-05-24T06:02:18.888Z INFO @wdio/visual-service:webdriver-image-comparison:pixelDiffProcessing: Processing 20143900 diff pixels
    [0-0] 2025-05-24T06:02:19.770Z INFO @wdio/visual-service:webdriver-image-comparison:pixelDiffProcessing: Total pixels in image: 52,184,160
    [0-0] 2025-05-24T06:02:19.770Z INFO @wdio/visual-service:webdriver-image-comparison:pixelDiffProcessing: Number of diff pixels: 20,143,900
    [0-0] 2025-05-24T06:02:19.770Z INFO @wdio/visual-service:webdriver-image-comparison:pixelDiffProcessing: Diff percentage: 38.60%
    [0-0] 2025-05-24T06:02:19.770Z ERROR @wdio/visual-service:webdriver-image-comparison:pixelDiffProcessing: Too many differences detected! Diff percentage: 38.60%, Diff pixels: 20,143,900
    [0-0] 2025-05-24T06:02:19.771Z ERROR @wdio/visual-service:webdriver-image-comparison:pixelDiffProcessing: This likely indicates a major visual difference or an issue with the comparison.
    [0-0] 2025-05-24T06:02:19.771Z ERROR @wdio/visual-service:webdriver-image-comparison:pixelDiffProcessing: Consider checking if the baseline image is correct or if there are major UI changes.
    

    Committers: 1

@wdio/[email protected]

24 May 06:24
fd6d9db
Compare
Choose a tag to compare

Patch Changes

  • 2f9ec42: ## 🐛 Bug-fixes

    #967: Emulated device crops with enableLegacyScreenshotMethod set to true are not correct

    When a screenshot of an emulated device is taken, but the browser was initially started as a "desktop" session, so not with emulated caps, and the enableLegacyScreenshotMethod property is set to true, the DPR of the emulated device is taken. This resulted in incorrect crop. We now store the original dpr and use that for the crop when it's an emulated device and started as a desktop browser session.

    BiDi Fullpage screenshots for emulated device are broken

    The BiDi fullpage screenshot for an emulated device is broken in the driver. We now fallback to the legacy screenshot method for BiDi and emulated devices

    💅 Polish

    • Updated the multiple interfaces to use JS-Doc for better docs
    • When createJsonReportFiles is set to true and there are a lot of differences we kept waiting. We now limited that to check a max of 5M diff-pixels or a diff threshold of 20%. If it's bigger the report will show a full coverage and extra logs are shown in the WDIO logs, something like this
    [0-0] 2025-05-24T06:02:18.887Z INFO @wdio/visual-service:webdriver-image-comparison:pixelDiffProcessing: Processing diff pixels started
    [0-0] 2025-05-24T06:02:18.888Z INFO @wdio/visual-service:webdriver-image-comparison:pixelDiffProcessing: Processing 20143900 diff pixels
    [0-0] 2025-05-24T06:02:19.770Z INFO @wdio/visual-service:webdriver-image-comparison:pixelDiffProcessing: Total pixels in image: 52,184,160
    [0-0] 2025-05-24T06:02:19.770Z INFO @wdio/visual-service:webdriver-image-comparison:pixelDiffProcessing: Number of diff pixels: 20,143,900
    [0-0] 2025-05-24T06:02:19.770Z INFO @wdio/visual-service:webdriver-image-comparison:pixelDiffProcessing: Diff percentage: 38.60%
    [0-0] 2025-05-24T06:02:19.770Z ERROR @wdio/visual-service:webdriver-image-comparison:pixelDiffProcessing: Too many differences detected! Diff percentage: 38.60%, Diff pixels: 20,143,900
    [0-0] 2025-05-24T06:02:19.771Z ERROR @wdio/visual-service:webdriver-image-comparison:pixelDiffProcessing: This likely indicates a major visual difference or an issue with the comparison.
    [0-0] 2025-05-24T06:02:19.771Z ERROR @wdio/visual-service:webdriver-image-comparison:pixelDiffProcessing: Consider checking if the baseline image is correct or if there are major UI changes.
    

    Committers: 1

  • Updated dependencies [2f9ec42]

[email protected]

17 May 20:17
b11986d
Compare
Choose a tag to compare

Patch Changes

  • 9363467: ## 🐛 Bug-fixes

    • #946: Visual Regression Changes in WDIO v9
      • Fixed screen size detection in emulated mode for filenames. Previously used incorrect browser window size.
      • Fixed screenshot behavior when enableLegacyScreenshotMethod: true, now correctly captures emulated screen instead of complete screen.
      • Fixed emulated device handling for Chrome and Edge browsers, now properly sets device metrics based on deviceMetrics or deviceName capabilities.

    Committers: 1

@wdio/[email protected]

17 May 20:17
b11986d
Compare
Choose a tag to compare

Patch Changes

  • 9363467: ## 🐛 Bug-fixes

    • #946: Visual Regression Changes in WDIO v9
      • Fixed screen size detection in emulated mode for filenames. Previously used incorrect browser window size.
      • Fixed screenshot behavior when enableLegacyScreenshotMethod: true, now correctly captures emulated screen instead of complete screen.
      • Fixed emulated device handling for Chrome and Edge browsers, now properly sets device metrics based on deviceMetrics or deviceName capabilities.

    Committers: 1

  • Updated dependencies [9363467]