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

feat: added apple pay support inside an iframe #743

Merged
merged 2 commits into from
Oct 23, 2024

Conversation

ArushKapoorJuspay
Copy link
Contributor

Type of Change

  • Bugfix
  • New feature
  • Enhancement
  • Refactoring
  • Dependency updates
  • Documentation
  • CI/CD

Description

Implemented support for initiating an ApplePay session within an iframe, provided that a HyperLoader script is present at the parent level.

How did you test it?

  • Test ApplePay inside an iframe with HyperLoader script
  • Test with Cancelling ApplePay Payment inside an iframe
  • Test ApplePay inside an iframe without HyperLoader script
  • Test ApplePay at top level
  • Test with Cancelling ApplePay payment
  • Test ApplePay with Express Checkout Element and PaymentElement
  • Test ApplePay Headless

Checklist

  • I ran npm run re:build
  • I reviewed submitted code
  • I added unit tests for my changes where possible

Copy link

Review changes with SemanticDiff.

@PritishBudhiraja PritishBudhiraja added the Ready for Review PR with label Ready for Review should only be reviewed. label Oct 21, 2024
Comment on lines +189 to +205
let handleApplePayIframePostMessage = (msg, componentName, mountedIframeRef) => {
let isApplePayMessageSent = ref(false)

let iframes = Window.querySelectorAll("iframe")

iframes->Array.forEach(iframe => {
let iframeSrc = iframe->Window.getAttribute("src")->Option.getOr("")
if iframeSrc->String.includes(`componentName=${componentName}`) {
iframe->Js.Nullable.return->Window.iframePostMessage(msg)
isApplePayMessageSent := true
}
})

if !isApplePayMessageSent.contents {
mountedIframeRef->Window.iframePostMessage(msg)
}
}
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
let handleApplePayIframePostMessage = (msg, componentName, mountedIframeRef) => {
let isApplePayMessageSent = ref(false)
let iframes = Window.querySelectorAll("iframe")
iframes->Array.forEach(iframe => {
let iframeSrc = iframe->Window.getAttribute("src")->Option.getOr("")
if iframeSrc->String.includes(`componentName=${componentName}`) {
iframe->Js.Nullable.return->Window.iframePostMessage(msg)
isApplePayMessageSent := true
}
})
if !isApplePayMessageSent.contents {
mountedIframeRef->Window.iframePostMessage(msg)
}
}
let handleApplePayIframePostMessage = (msg, componentName, mountedIframeRef) => {
let isApplePayMessageSent = ref(false)
let iframes = Window.querySelectorAll("iframe")
iframes->Array.forEach(iframe =>
if (
iframe
->Window.getAttribute("src")
->Option.getOr("")
->String.includes(`componentName=${componentName}`)
) {
iframe->Nullable.make->Window.iframePostMessage(msg)
isApplePayMessageSent := true
}
)
if !isApplePayMessageSent.contents {
mountedIframeRef->Window.iframePostMessage(msg)
}
}

@@ -250,9 +241,9 @@ let useHandleApplePayResponse = (
let json = ev.data->safeParse
try {
let dict = json->getDictFromJson
if dict->Dict.get("applePayProcessPayment")->Option.isSome {
if dict->Dict.get("applePayPaymentToken")->Option.isSome {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
if dict->Dict.get("applePayPaymentToken")->Option.isSome {
if dict->getDictIsSome("applePayPaymentToken") {

Comment on lines +105 to +106
->Dict.fromArray
->JSON.Encode.object
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
->Dict.fromArray
->JSON.Encode.object
->getJsonFromArrayOfJson

Comment on lines +116 to +117
->Dict.fromArray
->JSON.Encode.object
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
->Dict.fromArray
->JSON.Encode.object
->getJsonFromArrayOfJson

@seekshiva seekshiva merged commit 44ed3a8 into main Oct 23, 2024
4 checks passed
@seekshiva seekshiva deleted the feat/applepay-iframe-support branch October 23, 2024 10:29
@github-actions github-actions bot added Closed Label will be automatically added when the PR will get merged to main and removed Ready for Review PR with label Ready for Review should only be reviewed. labels Oct 23, 2024
Ayyanaruto pushed a commit to Ayyanaruto/hyperswitch-web that referenced this pull request Oct 24, 2024
# [0.96.0](juspay/hyperswitch-web@v0.95.3...v0.96.0) (2024-10-23)

### Features

* added apple pay support inside an iframe ([juspay#743](juspay#743)) ([44ed3a8](juspay@44ed3a8))
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Closed Label will be automatically added when the PR will get merged to main
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants