Skip to content

Commit

Permalink
Add some tests for shadow DOM element interaction
Browse files Browse the repository at this point in the history
  • Loading branch information
twalpole committed May 6, 2022
1 parent a9cfb0a commit 2fece8d
Show file tree
Hide file tree
Showing 3 changed files with 25 additions and 4 deletions.
2 changes: 1 addition & 1 deletion History.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ Release date: unreleased

* [Beta] CSP nonces inserted into animation disabler additions - Issue #2542
* Support `<base>` element in rack-test driver - ISsue #2544
* [Beta] `Element#shadow_root` support. Requires selenium-webdriver 4.1+. Only currently supported with Chrome when using the selenium driver. Note: only CSS can be used to find elements inside the shadow dom so you won't be able to use most Capybara helper methods (`fill_in`, `click_link`, `find_field`, etc) since those locators are built using XPath. Stick to `find(:css, ...)` and direct interaction methods.
* [Beta] `Element#shadow_root` support. Requires selenium-webdriver 4.1+. Only currently supported with Chrome when using the selenium driver. Note: only CSS can be used to find elements from the shadow root. Therefore you won't be able to use most Capybara helper methods (`fill_in`, `click_link`, `find_field`, etc) directly from the shadow root since those locators are built using XPath. If you first locate a descendant from the shadow root using CSS then you should be able to use all the Capybara methods from there.

### Fixed

Expand Down
19 changes: 19 additions & 0 deletions lib/capybara/spec/session/node_spec.rb
Original file line number Diff line number Diff line change
Expand Up @@ -1197,6 +1197,25 @@
nested_shadow_root = shadow_root.find(:css, '#nested_shadow_host').shadow_root
expect(nested_shadow_root).to have_css('#nested_shadow_content', text: 'nested text')
end

it 'should click on elements' do
@session.visit('/with_shadow')
shadow_root = @session.find(:css, '#shadow_host').shadow_root
checkbox = shadow_root.find(:css, 'input[type="checkbox"]')
expect(checkbox).not_to be_checked
checkbox.click
expect(checkbox).to be_checked
end

it 'should use convenience methods once moved to a descendant of the shadow root' do
@session.visit('/with_shadow')
shadow_root = @session.find(:css, '#shadow_host').shadow_root
descendant = shadow_root.find(:css, '#controls_wrapper')
expect do
descendant.check('shadow_checkbox')
end.not_to raise_error
expect(descendant).to have_checked_field('shadow_checkbox')
end
end

describe '#reload', requires: [:js] do
Expand Down
8 changes: 5 additions & 3 deletions lib/capybara/spec/views/with_shadow.erb
Original file line number Diff line number Diff line change
Expand Up @@ -15,9 +15,11 @@
<span class="wrapper" id="shadow_content"><span class="info">some text</span></span>
<div id="nested_shadow_host"></div>
<a href="scroll.html">scroll.html</a>
<input type="text" />
<input type="checkbox" />
<input type="file" />
<div id="controls_wrapper">
<input type="text" />
<input type="checkbox" id="shadow_checkbox" />
<input type="file" />
</div>
`;

let nestedShadowRoot = shadowRoot.getElementById('nested_shadow_host').attachShadow({mode: 'open'});
Expand Down

0 comments on commit 2fece8d

Please sign in to comment.