Skip to content
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.

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

Adapt PaymentRequest API to new events structure #13891

Merged
merged 6 commits into from
Mar 17, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
6 changes: 5 additions & 1 deletion files/en-us/_redirects.txt
Original file line number Diff line number Diff line change
Expand Up @@ -8728,7 +8728,11 @@
/en-US/docs/Web/API/PaymentDetailsUpdate/error /en-US/docs/Web/API/PaymentRequestUpdateEvent/updateWith
/en-US/docs/Web/API/PaymentDetailsUpdate/shippingAddressErrors /en-US/docs/Web/API/PaymentRequestUpdateEvent/updateWith
/en-US/docs/Web/API/PaymentItem /en-US/docs/Web/API/PaymentRequest/show
/en-US/docs/Web/API/PaymentRequest/PaymentRequest.onmerchantvalidation /en-US/docs/Web/API/PaymentRequest/onmerchantvalidation
/en-US/docs/Web/API/PaymentRequest/PaymentRequest.onmerchantvalidation /en-US/docs/Web/API/PaymentRequest/merchantvalidation_event
/en-US/docs/Web/API/PaymentRequest/onmerchantvalidation /en-US/docs/Web/API/PaymentRequest/merchantvalidation_event
/en-US/docs/Web/API/PaymentRequest/onpaymentmethodchange /en-US/docs/Web/API/PaymentRequest/paymentmethodchange_event
/en-US/docs/Web/API/PaymentRequest/onshippingaddresschange /en-US/docs/Web/API/PaymentRequest/shippingaddresschange_event
/en-US/docs/Web/API/PaymentRequest/onshippingoptionchange /en-US/docs/Web/API/PaymentRequest/shippingoptionchange_event
/en-US/docs/Web/API/PaymentRequest/shippingaddresschange /en-US/docs/Web/API/PaymentRequest/shippingaddresschange_event
/en-US/docs/Web/API/PaymentRequestEvent/topLevelOrigin /en-US/docs/Web/API/PaymentRequestEvent/topOrigin
/en-US/docs/Web/API/PaymentResponse/onpayerdetailchange /en-US/docs/Web/API/PaymentResponse/payerdetailchange_event
Expand Down
39 changes: 0 additions & 39 deletions files/en-us/_wikihistory.json
Original file line number Diff line number Diff line change
Expand Up @@ -65035,45 +65035,6 @@
"rsolomakhin"
]
},
"Web/API/PaymentRequest/onmerchantvalidation": {
"modified": "2020-10-15T22:08:42.855Z",
"contributors": [
"sideshowbarker",
"rsolomakhin",
"Sheppy",
"marcoscaceres"
]
},
"Web/API/PaymentRequest/onpaymentmethodchange": {
"modified": "2020-10-15T22:06:08.345Z",
"contributors": [
"Sheppy",
"marcoscaceres"
]
},
"Web/API/PaymentRequest/onshippingaddresschange": {
"modified": "2020-10-15T21:48:28.422Z",
"contributors": [
"Sheppy",
"samouss",
"fscholz",
"jpmedley",
"chrisdavidmills",
"dgashmdn"
]
},
"Web/API/PaymentRequest/onshippingoptionchange": {
"modified": "2020-10-15T21:48:27.044Z",
"contributors": [
"marcoscaceres",
"samouss",
"fscholz",
"jpmedley",
"chrisdavidmills",
"libbymc",
"dgashmdn"
]
},
"Web/API/PaymentRequest/paymentmethodchange_event": {
"modified": "2020-10-15T22:08:31.709Z",
"contributors": [
Expand Down
4 changes: 0 additions & 4 deletions files/en-us/web/api/paymentrequest/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -50,16 +50,12 @@ The [Payment Request API's](/en-US/docs/Web/API/Payment_Request_API) **`PaymentR

- {{domxref("PaymentRequest.merchantvalidation_event", "merchantvalidation")}} {{securecontext_inline}}
- : With some payment handlers (e.g., Apple Pay), this event handler is called to handle the {{event("merchantvalidation")}} event, which is dispatched when the user agent requires that the merchant validate that the merchant or vendor requesting payment is legitimate.
Also available using the {{domxref("PaymentRequest.onmerchantvalidation", "onmerchantvalidation")}} event handler property.
- {{domxref("PaymentRequest.paymentmethodchange_event", "paymentmethodchange")}} {{securecontext_inline}}
- : With some payment handlers (e.g., Apple Pay), dispatched whenever the user changes payment instrument, like switching from a credit card to a debit card.
Also available using the {{domxref("PaymentRequest.onpaymentmethodchange", "onpaymentmethodchange")}} event handler property.
- {{domxref("PaymentRequest.shippingaddresschange_event", "shippingaddresschange")}} {{securecontext_inline}}{{deprecated_inline}}
- : Dispatched whenever the user changes their shipping address.
Also available using the {{domxref("PaymentRequest.onshippingaddresschange", "onshippingaddresschange")}} event handler property.
- {{domxref("PaymentRequest.shippingoptionchange_event", "shippingoptionchange")}} {{securecontext_inline}}{{deprecated_inline}}
- : Dispatched whenever the user changes a shipping option.
Also available using the {{domxref("PaymentRequest.onshippingoptionchange", "onshippingoptionchange")}} event handler property.

## Specifications

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ tags:
- Sales
- Validation
- Web
- events
- Event
- merchantvalidation
- payment
browser-compat: api.PaymentRequest.merchantvalidation_event
Expand All @@ -23,28 +23,30 @@ browser-compat: api.PaymentRequest.merchantvalidation_event

queengooborg marked this conversation as resolved.
Show resolved Hide resolved
See {{SectionOnPage("/en-US/docs/Web/API/Payment_Request_API/Concepts", "Merchant validation")}} for details on how the merchant validation process works.

<table class="properties">
<tbody>
<tr>
<th scope="row">Bubbles</th>
<td>No</td>
</tr>
<tr>
<th scope="row">Cancelable</th>
<td>No</td>
</tr>
<tr>
<th scope="row">Interface</th>
<td>{{domxref("MerchantValidationEvent")}}</td>
</tr>
<tr>
<th scope="row">Event handler property</th>
<td>
{{domxref("PaymentRequest.onmerchantvalidation", "onmerchantvalidation")}}
</td>
</tr>
</tbody>
</table>
This event is not cancelable and does not bubble.

## Syntax

Use the event name in methods like {{domxref("EventTarget.addEventListener", "addEventListener()")}}, or set an event handler property.

```js
addEventListener('merchantvalidation', event => { });

onmerchantvalidation = event => { };
```

## Event type

An {{domxref("MerchantValidationEvent")}}. Inherits from {{domxref("Event")}}.

{{InheritanceDiagram("MerchantValidationEvent")}}

## Event properties

- {{domxref("MerchantValidationEvent.methodName")}} {{securecontext_inline}}
- : A {{domxref("DOMString")}} providing a unique payment method identifier for the payment handler that's requiring validation. This may be either one of the standard payment method identifier strings or a URL that both identifies and handles requests for the payment handler, such as `https://apple.com/apple-pay`.
- {{domxref("MerchantValidationEvent.validationURL")}} {{securecontext_inline}}
- : A {{domxref("USVString")}} specifying a URL from which the site or app can fetch payment handler specific validation information. Once this data is retrieved, the data (or a promise resolving to the validation data) should be passed into {{domxref("MerchantValidationEvent.complete", "complete()")}} to validate that the payment request is coming from an authorized merchant.

## Examples

Expand All @@ -65,7 +67,7 @@ const response = await request.show();

How merchant server handles the validation depends on the server implementation and payment method documentation. The content delivered by the validation server is forwarded to the merchant server and is then returned from the `fetch()` call's fulfillment handler to the {{domxref("MerchantValidationEvent.complete", "complete()")}} method on the event. This response lets the payment handler know if the merchant is validated.

You can also use the {{domxref("PaymentRequest.onmerchantvalidation", "onmerchantvalidation")}} event handler property to set up the handler for this event:
You can also use the `onmerchantvalidation` event handler property to set up the handler for this event:

```js
request.onmerchantvalidation = event => {
Expand All @@ -82,10 +84,6 @@ const response = await request.show();

For more information, see {{SectionOnPage("/en-US/docs/Web/API/Payment_Request_API/Concepts", "Merchant Validation")}}.

## Related events

- {{event("payerdetailchange")}}, {{event("paymentmethodchange")}}, {{event("shippingaddresschange")}}, and {{event("shippingoptionchange")}}

## Browser compatibility

{{Compat}}
Expand All @@ -94,6 +92,10 @@ For more information, see {{SectionOnPage("/en-US/docs/Web/API/Payment_Request_A

queengooborg marked this conversation as resolved.
Show resolved Hide resolved
- [Payment Request API](/en-US/docs/Web/API/Payment_Request_API)
- [Using the Payment Request API](/en-US/docs/Web/API/Payment_Request_API/Using_the_Payment_Request_API)
- {{domxref("PaymentRequest.onmerchantvalidation", "onmerchantvalidation")}} event handler property
- `onmerchantvalidation` event handler property
- {{SectionOnPage("/en-US/docs/Web/API/Payment_Request_API/Concepts", "Merchant validation")}}
- {{domxref("PaymentRequest")}}
- {{domxref("PaymentRequest.payerdetailchange_event", "payerdetailchange")}} event
- {{domxref("PaymentRequest.paymentmethodchange_event", "paymentmethodchange")}} event
- {{domxref("PaymentRequest.shippingaddresschange_event", "shippingaddresschange")}} event
- {{domxref("PaymentRequest.shippingoptionchange_event", "shippingoptionchange")}} event

This file was deleted.

This file was deleted.

This file was deleted.

Loading