capybara-lockstep 2.1.0 → 2.2.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 514789431b5b017176575acd43c1a5b6558040f31cf7cb4ac119cf10e756dbee
-  data.tar.gz: 2945ac3b32b7f83a7bc2bd14848f67950c12e5063033d8dbe2063788dfe8c024
+  metadata.gz: fa4a510d3f4745ef60812fdf3ab03f6c3e8ede0c6ea4046cb87364d6664e2a7d
+  data.tar.gz: 78be38bdb5aa4fcb9147394ac3adb11f3112c18539ba53a096c214931be753cb
 SHA512:
-  metadata.gz: b2dac0508c3caaa13fd28fe285c9c3b7d2b796dfba6c2bf788578ffee90135b6504a2e9b731d8bf4496806723d26c28bf5ccb536e5de21c2b5661b354a9e2de1
-  data.tar.gz: 4e80b685b588dfded10cb0783cbe62aceb00517199ef5527ce76fb76a234c96eb913ec0e7d08df2e22a7dd5a2b2d475bed0d4318add6ddee9fd27403afc2e0fe
+  metadata.gz: 356df47acf01a2642769be49f54c48736ea030c803a92b3c059c587e5e82bb927fa0b4e5dcf7953060162a46491cf0122c6a2d0debd1f607cbd1b09cc8608ff2
+  data.tar.gz: c5d1189ee309d32197f19765dad9014cc59f13a8d9f6a17287537045cbf02664b480ce9d087e933b3fad1a2c63b4460b5dc5e61e20d3e0b98d76cde9d90eaff3

data/.github/workflows/test.yml

@@ -3,13 +3,13 @@ name: Tests
 on:
   push:
     branches:
-    - master
+    - main
   pull_request:
     branches:
-    - master
+    - main
   workflow_dispatch:
     branches:
-    - master
+    - main
 jobs:
   test:
     runs-on: ubuntu-20.04

data/CHANGELOG.md

@@ -3,6 +3,13 @@ All notable changes to this project will be documented in this file.
 This project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
 
+# 2.2.0
+
+- We now wait for `<video>` and `<audio>` elements to load their metadata. This addresses a race condition where a media element is inserted into the DOM, but another user action deletes or renames the source before the browser could load the initial metadata frames. 
+- We now wait for `<script type="module">`.
+- We no longer wait for `<img loading="lazy">` or `<iframe loading="lazy">`. This prevents a deadlock where we would wait forever for an element that defers loading until it is scrolled into the viewport.
+
+
 # 2.1.0
 
 - We now synchronize for an additional [JavaScript task](https://jakearchibald.com/2015/tasks-microtasks-queues-and-schedules/) after `history.pushState()`, `history.replaceState()`, `history.forward()`, `history.back()` and `history.go()`.

data/Gemfile.lock

@@ -1,7 +1,7 @@
 PATH
   remote: .
   specs:
-    capybara-lockstep (2.1.0)
+    capybara-lockstep (2.2.0)
       activesupport (>= 4.2)
       capybara (>= 3.0)
       ruby2_keywords

data/README.md

@@ -71,7 +71,8 @@ When capybara-lockstep synchronizes it will:
 - wait for client-side JavaScript to render or hydrate DOM elements.
 - wait for any pending AJAX requests to finish and their callbacks to be called.
 - wait for dynamically inserted `<script>`s to load (e.g. from [dynamic imports](https://webpack.js.org/guides/code-splitting/#dynamic-imports) or Analytics snippets).
-- waits for dynamically inserted `<img>` or `<iframe>` elements to load.
+- waits for dynamically inserted `<img>` or `<iframe>` elements to load (ignoring [lazy-loaded](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#lazy) elements).
+- waits for dynamically inserted `<audio>` and `<video>` elements to load their [metadata](https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/loadedmetadata_event)
 
 In summary Capybara can no longer observe or interact with the page while HTTP requests are in flight.
 This covers most async work that causes flaky tests.
@@ -158,7 +159,23 @@ use Capybara::Lockstep::Middleware
 # Other middleware here
 ```
 
+### Configuring Selenium WebDriver (recommended)
 
+By default, webdrivers will automatically dismiss any user prompts (like alerts) when trying to perform an action.
+While capybara-lockstep carefully detects alerts before synchronizing, and will skip interaction with the browser to avoid accidentally dismissing alerts, it can not synchronize around some rare race conditions.
+
+[We recommend](https://makandracards.com/makandra/617366-how-to-configure-selenium-webdriver-to-not-automatically-close-alerts-or-other-browser-dialogs) you configure your webdriver to not automatically dismiss user prompts by setting the "unhandled prompt behavior" capability to [`ignore`](https://w3c.github.io/webdriver/#dfn-known-prompt-handling-approaches-table). Using "ignore", errors are raised like with the default behavior, but user prompts are kept open.
+
+For example, the Chrome driver can be configured like this:
+```ruby
+Capybara.register_driver(:selenium) do |app|
+  options = Selenium::WebDriver::Chrome::Options.new(
+    unhandled_prompt_behavior: 'ignore',
+    # ...
+  )
+  Capybara::Selenium::Driver.new(app, browser: :chrome, options: options)
+end
+```
 
 ### Verify successful integration
 

data/capybara-lockstep.gemspec

@@ -15,7 +15,7 @@ Gem::Specification.new do |spec|
   spec.metadata["source_code_uri"] = spec.homepage
 
   spec.metadata["bug_tracker_uri"] = "https://github.com/makandra/capybara-lockstep/issues"
-  spec.metadata["changelog_uri"] = "https://github.com/makandra/capybara-lockstep/blob/master/CHANGELOG.md"
+  spec.metadata["changelog_uri"] = "https://github.com/makandra/capybara-lockstep/blob/main/CHANGELOG.md"
   spec.metadata["rubygems_mfa_required"] = 'true'
 
   # Specify which files should be added to the gem when it is released.

data/lib/capybara-lockstep/helper.js

@@ -177,39 +177,47 @@ window.CapybaraLockstep = (function() {
   }
 
   function isRemoteScript(element) {
-    if (element.tagName === 'SCRIPT') {
-      let src = element.getAttribute('src')
-      let type = element.getAttribute('type')
+    return element.matches('script[src]') && !hasDataSource(element)
+  }
 
-      return src && (!type || /javascript/i.test(type))
-    }
+  function isTrackableImage(element) {
+    return element.matches('img') &&
+      !element.complete &&
+      !hasDataSource(element) &&
+      element.getAttribute('loading') !== 'lazy'
   }
 
-  function isRemoteImage(element) {
-    if (element.tagName === 'IMG' && !element.complete) {
-      let src = element.getAttribute('src')
-      let srcSet = element.getAttribute('srcset')
+  function isTrackableIFrame(element) {
+    return element.matches('iframe') &&
+      !hasDataSource(element) &&
+      element.getAttribute('loading') !== 'lazy'
+  }
+
+  function hasDataSource(element) {
+    // <img> can have <img src> and <img srcset>
+    // <video> can have <video src> or <video><source src>
+    // <audio> can have <audio src> or <audio><source src>
+    return element.matches('[src*="data:"], [srcset*="data:"]') ||
+      !!element.querySelector('source [src*="data:"], source [srcset*="data:"]')
+  }
 
-      let localSrcPattern = /^data:/
-      let localSrcSetPattern = /(^|\s)data:/
+  function isTrackableMediaElement(element) {
+    return element.matches('audio, video') &&
+      element.readyState === 0 && // no metadata known
+      !hasDataSource(element) &&
+      element.getAttribute('preload') !== 'none'
+  }
 
-      let hasLocalSrc = src && localSrcPattern.test(src)
-      let hasLocalSrcSet = srcSet && localSrcSetPattern.test(srcSet)
+  function trackRemoteElement(element, condition, workTag) {
+    trackLoadingElement(element, condition, workTag, 'load', 'error')
 
-      return (src && !hasLocalSrc) || (srcSet && !hasLocalSrcSet)
-    }
   }
 
-  function isRemoteInlineFrame(element) {
-    if (element.tagName === 'IFRAME') {
-      let src = element.getAttribute('src')
-      let localSrcPattern = /^data:/
-      let hasLocalSrc = src && localSrcPattern.test(src)
-      return (src && !hasLocalSrc)
-    }
+  function trackMediaElement(element, condition, workTag) {
+    trackLoadingElement(element, condition, workTag, 'loadedmetadata', 'error')
   }
 
-  function trackRemoteElement(element, condition, workTag) {
+  function trackLoadingElement(element, condition, workTag, loadEvent, errorEvent) {
     if (!condition(element)) {
       return
     }
@@ -220,8 +228,8 @@ window.CapybaraLockstep = (function() {
 
     let doStop = function() {
       stopped = true
-      element.removeEventListener('load', doStop)
-      element.removeEventListener('error', doStop)
+      element.removeEventListener(loadEvent, doStop)
+      element.removeEventListener(errorEvent, doStop)
       stopWork(workTag)
     }
 
@@ -240,11 +248,11 @@ window.CapybaraLockstep = (function() {
     }
 
     let scheduleCheckCondition = function() {
-      setTimeout(checkCondition, 200)
+      setTimeout(checkCondition, 150)
     }
 
-    element.addEventListener('load', doStop)
-    element.addEventListener('error', doStop)
+    element.addEventListener(loadEvent, doStop)
+    element.addEventListener(errorEvent, doStop)
 
     // We periodically check whether we still think the element will
     // produce a `load` or `error` event.
@@ -256,8 +264,9 @@ window.CapybaraLockstep = (function() {
       change.addedNodes.forEach(function(addedNode) {
         if (addedNode.nodeType === Node.ELEMENT_NODE) {
           trackRemoteElement(addedNode, isRemoteScript, 'Script')
-          trackRemoteElement(addedNode, isRemoteImage, 'Image')
-          trackRemoteElement(addedNode, isRemoteInlineFrame, 'Inline frame')
+          trackRemoteElement(addedNode, isTrackableImage, 'Image')
+          trackRemoteElement(addedNode, isTrackableIFrame, 'Inline frame')
+          trackMediaElement(addedNode, isTrackableMediaElement, 'Media element')
         }
       })
     })

data/lib/capybara-lockstep/version.rb

@@ -1,5 +1,5 @@
 module Capybara
   module Lockstep
-    VERSION = "2.1.0"
+    VERSION = "2.2.0"
   end
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: capybara-lockstep
 version: !ruby/object:Gem::Version
-  version: 2.1.0
+  version: 2.2.0
 platform: ruby
 authors:
 - Henning Koch
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2024-01-10 00:00:00.000000000 Z
+date: 2024-02-12 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: capybara
@@ -107,7 +107,7 @@ metadata:
   homepage_uri: https://github.com/makandra/capybara-lockstep
   source_code_uri: https://github.com/makandra/capybara-lockstep
   bug_tracker_uri: https://github.com/makandra/capybara-lockstep/issues
-  changelog_uri: https://github.com/makandra/capybara-lockstep/blob/master/CHANGELOG.md
+  changelog_uri: https://github.com/makandra/capybara-lockstep/blob/main/CHANGELOG.md
   rubygems_mfa_required: 'true'
 post_install_message: 
 rdoc_options: []