test setting values to controlled text inputs with react

lib/capybara/selenium/nodes/chrome_node.rb

@@ -5,6 +5,13 @@ require 'capybara/selenium/extensions/html5_drag'
 class Capybara::Selenium::ChromeNode < Capybara::Selenium::Node
   include Html5Drag
 
+  def set_text(value, clear: nil, **_unused)
+    super.tap do
+      # React doesn't see the chromedriver element clear
+      send_keys(:space, :backspace) if value.to_s.empty? && clear.nil?
+    end
+  end
+
   def set_file(value) # rubocop:disable Naming/AccessorMethodName
     super(value)
   rescue ::Selenium::WebDriver::Error::ExpectedError => err

spec/shared_selenium_session.rb

@@ -462,6 +462,26 @@ RSpec.shared_examples 'Capybara::Session' do |session, mode|
         expect(session).to have_selector(:element, "{custom}": 'abcdef')
       end
     end
+
+    describe 'with react' do
+      context "controlled components" do
+        it 'can set and clear a text field' do
+          session.visit 'https://reactjs.org/docs/forms.html'
+          session.all(:css, 'h2#controlled-components ~ p a', text: 'Try it on CodePen')[0].click
+          sleep 2 # give codepen a chance to stabilize result frame
+          session.within_frame(:css, 'iframe.result-iframe') do
+            session.fill_in('Name:', with: 'abc')
+            session.accept_prompt "A name was submitted: abc" do
+              session.click_button('Submit')
+            end
+            session.fill_in('Name:', with: '')
+            session.accept_prompt /A name was submitted: $/ do
+              session.click_button('Submit')
+            end
+          end
+        end
+      end
+    end
   end
 
   def headless_or_remote?