Open Bug 1901000 Opened 8 months ago Updated 2 months ago

www.eyebuydirect.ca - Paypal button does not work

Categories

(Web Compatibility :: Site Reports, defect, P3)

Product:
Web Compatibility
Component:
Site Reports
Version:
Firefox 128
Platform:
Desktop
All
Type:
defect

Tracking

(firefox126 affected, firefox128 affected)

Status:
ASSIGNED
Tracking Flags:
Tracking Status
firefox126 --- affected
firefox128 --- affected

People

(Reporter: ctanase, Assigned: twisniewski)

References

(Blocks 1 open bug,
URL
)

Details

(Keywords: leave-open, webcompat:needs-diagnosis, webcompat:sitepatch-applied)

User Story

platform:windows,mac,linux,android
impact:workflow-broken
configuration:general
affects:all

Attachments

(2 files)

FF vs Chrome.mp4
3.02 MB, video/mp4
Details
Bug 1901000 - add a CSS intervention to unbreak the PayPal button on EyeBuyDirect.ca; r?ksenia
48 bytes, text/x-phabricator-request
Details | Review

Environment:
Operating system: Linux / Windows 10
Firefox version: Firefox 126/128

Steps to reproduce:

  1. Go to https://www.eyebuydirect.ca
  2. Add a product to the cart.
  3. Access the cart.
  4. Click on the Paypal button.

Expected Behavior:
A new window redirecting to paypal opens.

Actual Behavior:
Nothing happens.

Notes:

  • Reproduces regardless of the status of ETP
  • Reproduces in Firefox Nightly, Firefox Release
  • Does not reproduce in Chrome

Created from https://github.com/webcompat/web-bugs/issues/137777

Attached video FF vs Chrome.mp4 —
status-firefox126: --- → affected
status-firefox128: --- → affected
OS: Unspecified → All
Hardware: Unspecified → Desktop
Version: unspecified → Firefox 128
Severity: -- → S2
User Story: (updated)
Keywords: webcompat:needs-diagnosis
Priority: -- → P3

I see the following in the console:

Uncaught Error: zoid destroyed all components
    e https://www.paypal.com/sdk/js?client-id=AXSBliolnV_Tf2Gn8x9EV3dabvIY4CDblp7cKFSpcb1MW76iGeOyTZ-7bo2RV7_KCbgNBxmmgSodcnHE&components=messages:2
    o https://www.paypal.com/sdk/js?client-id=AXSBliolnV_Tf2Gn8x9EV3dabvIY4CDblp7cKFSpcb1MW76iGeOyTZ-7bo2RV7_KCbgNBxmmgSodcnHE&components=messages:2
    Ne https://www.paypal.com/sdk/js?client-id=AXSBliolnV_Tf2Gn8x9EV3dabvIY4CDblp7cKFSpcb1MW76iGeOyTZ-7bo2RV7_KCbgNBxmmgSodcnHE&components=messages:2
    all https://www.paypal.com/sdk/js?client-id=AXSBliolnV_Tf2Gn8x9EV3dabvIY4CDblp7cKFSpcb1MW76iGeOyTZ-7bo2RV7_KCbgNBxmmgSodcnHE&components=messages:2
    xu https://www.paypal.com/sdk/js?client-id=AXSBliolnV_Tf2Gn8x9EV3dabvIY4CDblp7cKFSpcb1MW76iGeOyTZ-7bo2RV7_KCbgNBxmmgSodcnHE&components=messages:2
    value https://www.paypal.com/sdk/js?client-id=AXSBliolnV_Tf2Gn8x9EV3dabvIY4CDblp7cKFSpcb1MW76iGeOyTZ-7bo2RV7_KCbgNBxmmgSodcnHE&components=messages:2
    value https://www.paypal.com/sdk/js?client-id=AXSBliolnV_Tf2Gn8x9EV3dabvIY4CDblp7cKFSpcb1MW76iGeOyTZ-7bo2RV7_KCbgNBxmmgSodcnHE&components=messages:2
    <anonymous> https://www.paypal.com/sdk/js?client-id=AZFOmmmaLmWxhicfDY-NczizVmm-Ny2yDGJcAy1oSM0d4tTmCHCUTOAzIddVQTJl2_8WNUJj7N09D1zQ&intent=capture&components=buttons,funding-eligibility&currency=CAD&commit=false:3
    <anonymous> https://www.paypal.com/sdk/js?client-id=AZFOmmmaLmWxhicfDY-NczizVmm-Ny2yDGJcAy1oSM0d4tTmCHCUTOAzIddVQTJl2_8WNUJj7N09D1zQ&intent=capture&components=buttons,funding-eligibility&currency=CAD&commit=false:3
    t https://www.paypal.com/sdk/js?client-id=AZFOmmmaLmWxhicfDY-NczizVmm-Ny2yDGJcAy1oSM0d4tTmCHCUTOAzIddVQTJl2_8WNUJj7N09D1zQ&intent=capture&components=buttons,funding-eligibility&currency=CAD&commit=false:3
    <anonymous> https://www.paypal.com/sdk/js?client-id=AZFOmmmaLmWxhicfDY-NczizVmm-Ny2yDGJcAy1oSM0d4tTmCHCUTOAzIddVQTJl2_8WNUJj7N09D1zQ&intent=capture&components=buttons,funding-eligibility&currency=CAD&commit=false:3
    <anonymous> https://www.paypal.com/sdk/js?client-id=AZFOmmmaLmWxhicfDY-NczizVmm-Ny2yDGJcAy1oSM0d4tTmCHCUTOAzIddVQTJl2_8WNUJj7N09D1zQ&intent=capture&components=buttons,funding-eligibility&currency=CAD&commit=false:3
    <anonymous> https://www.paypal.com/sdk/js?client-id=AZFOmmmaLmWxhicfDY-NczizVmm-Ny2yDGJcAy1oSM0d4tTmCHCUTOAzIddVQTJl2_8WNUJj7N09D1zQ&intent=capture&components=buttons,funding-eligibility&currency=CAD&commit=false:4

Chrome mask doesn't fix it

Two different versions of https://www.paypal.com/sdk/js are being loaded that might be contributing to the weird situation

Reduced test-case: https://iridescent-road-theory.glitch.me/

Clicking the green square should sow an alert(). It seems opacity: 0, which they're using to hide the paypal button while showing a background, is breaking the hit-testing of the iframe. This is only if it's a fission iframe, on the same origin it works: https://crisal.io/tmp/fission-hit-testing.html

Source, for reference:

<!doctype html>
<style>
iframe {
  width: 100px;
  height: 100px;
  border: 0;
}

#container {
  width: 100px;
  height: 100px;
  background-color: green;
}
</style>
<div id="container">
  <div style="opacity: 0; z-index: 1;">
    <iframe src="https://crisal.io/tmp/fission-iframe-hit-testing-inner.html"></iframe>
  </div>
</div>

Not sure if it's Core: Web Painting or APZ. This seems very similar to bug 1923513

See Also: → 1923513

If it helps, while writing an automated test-case for a site-patch here, which uses windowUtils.sendNativeMouseEvent to click on the element, I noticed that the mouse events are fired not on the PayPal button's iframe, but the underlying top-level frame.

Assignee: nobody → twisniewski
Status: NEW → ASSIGNED
Pushed by twisniewski@mozilla.com: https://hg.mozilla.org/integration/autoland/rev/ae79181b5ff2 add a CSS intervention to unbreak the PayPal button on EyeBuyDirect.ca; r=ksenia,webcompat-reviewers

Tim, any idea what might be going on here?

Flags: needinfo?(tnikkel)

There is a reduced test-case in comment 5 fwiw. Not sure this needs further diagnosis? It seems like a display list / hit testing / APZ bug to me.

If it only happens with a fission iframe, apz is more likely to be involved, cc'ing botond and hiro.

Based on a quick look at display list dumps, it looks like a Web Painting issue to me. I'll file a dependent webcompat:platform-bug for the reduced testcase with some more details.

Depends on: 1933851

(In reply to Botond Ballo [:botond] from comment #13)

Based on a quick look at display list dumps, it looks like a Web Painting issue to me. I'll file a dependent webcompat:platform-bug for the reduced testcase with some more details.

I filed bug 1933851 with display list dumps demonstrating that the hit-testing issue stems from display list building not building a Remote display item inside the Opacity.

Patch posted to bug 1933851 for the underlying problem.

Flags: needinfo?(tnikkel)
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: