Skip to content

Ignore ancestor opacity for open popovers and modal dialogs #328

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
lukasedw wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Ignore ancestor opacity for open popovers and modal dialogs #328

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 13 additions & 1 deletion lib/capybara/cuprite/javascripts/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -77,15 +77,27 @@ class Cuprite {
}
}

let ancestorOpacityApplies = true;

while (node) {
if (node instanceof ShadowRoot) {
node = node.host;
} else {
style = window.getComputedStyle(node);
if (style.display === "none" || style.visibility === "hidden" || parseFloat(style.opacity) === 0) {
if (style.display === "none" || style.visibility === "hidden" || (ancestorOpacityApplies && parseFloat(style.opacity) === 0)) {
return false;
}

// A node matching :modal or :popover-open is a top-layer element, so
// an ancestor's opacity no longer applies to it once shown.
if (ancestorOpacityApplies) {
try {
if (node.matches(":modal") || node.matches(":popover-open")) {
ancestorOpacityApplies = false;
}
} catch (e) {}
}

let parent = node.parentElement;
if (parent && parent.tagName === "DETAILS" && !parent.open) {
// In a closed <details> only the first <summary> (and its subtree) is rendered.
Expand Down
28 changes: 28 additions & 0 deletions spec/features/session_spec.rb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -410,6 +410,34 @@
it "element with all children hidden returns empty text" do
expect(@session.find(:css, "div").text).to eq("")
end

it "considers a shown popover to be visible past opacity: 0" do
popover = @session.find(:css, "#popover_in_transparent", visible: false)
expect(popover.visible?).to be false

popover.execute_script("this.showPopover()")

expect(popover.visible?).to be true
end

it "considers a shown modal dialog to be visible past opacity: 0" do
dialog = @session.find(:css, "#dialog_in_transparent", visible: false)
expect(dialog.visible?).to be false

dialog.execute_script("this.showModal()")
expect(dialog.visible?).to be true

dialog.execute_script("this.close(); this.show()")
expect(dialog.visible?).to be false
end

it "considers a shown popover to not be visible past display: none" do
popover = @session.find(:css, "#popover_in_display_none", visible: false)

popover.execute_script("this.showPopover()")

expect(popover.visible?).to be false
end
end

describe "Node#checked?" do
Expand Down
7 changes: 7 additions & 0 deletions spec/support/views/visible.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,5 +15,12 @@
<span style="display: none">Display None</span>
<span style="visibility: hidden">Hidden</span>
</div>
<section style="opacity: 0.0">
<div popover id="popover_in_transparent">Popover In Transparent</div>
<dialog id="dialog_in_transparent">Dialog In Transparent</dialog>
</section>
<section style="display: none">
<div popover id="popover_in_display_none">Popover In Display None</div>
</section>
</body>
</html>
Loading