Comments (19)
Issue-Label Bot is automatically applying the label feature_request
to this issue, with a confidence of 0.77. Please mark this comment with 👍 or 👎 to give our bot feedback!
Links: app homepage, dashboard and code for this bot.
from paypal-sdk-client.
Is there currently a way of switching between Orders and Subscriptions at runtime?
Hi @JasonTheAdams, the JS SDK can be reloaded on the page for handling query parameter changes. Here's a codepen to demonstrate: https://codepen.io/gregjopa/pen/jOqBGJy.
This demo is using paypal-js to simplify the loading of the sdk script. At the end of the day this is just inserting the new sdk script like so document.head.insertBefore(newScript, document.head.firstElementChild)
which will load and take priority and cleanup the old sdk script on the page.
Would this proposed solution work for your use case?
from paypal-sdk-client.
Thanks, @gregjopa! I appreciate you taking the time to put that together! Obviously, not having to reload the script and re-render — causing the flash — would be ideal for a future feature. But this seems like it could be a solid workaround.
We'll give this a shot this week and see if it works within our system and I'll report back to this issue with our success.
Thank you!
from paypal-sdk-client.
@JasonTheAdams happy to help! I'll leave this issue open. Please let us know how the integration goes.
from paypal-sdk-client.
@gregjopa When I define a components
property of PayPal SDK then click on the radio button does not overwrite old button and the number of button count keeps increase with a javascript error. Can you review this pen: https://codepen.io/ravinderk/pen/wvGevRg
from paypal-sdk-client.
@ravinderk that is by design. Our motto is you can never have too many paypal buttons on a web page.
Just kidding 😆. To avoid showing multiple paypal buttons, you need to clean up the old before rendering the new. There's a helpful close()
function to doing this cleanup work. Ex:
let buttons;
function render(options) {
if (buttons) {
buttons.close();
}
buttons = paypal.Buttons(options);
buttons.render(document.querySelector('#paypal-button-container'));
}
Here's a pen demoing this cleanup behavior: https://codepen.io/gregjopa/pen/RwagNWR?editors=1000
from paypal-sdk-client.
@gregjopa I am still seeing this error. Can you check it?
from paypal-sdk-client.
@ravinderk That first error seems to related to hosted fields. The error does not happen when using components=buttons
for both cases. I updated the codepen to reflect this: https://codepen.io/gregjopa/pen/RwagNWR?editors=1000.
My guess is you also need to cleanup hosted fields in the same manner as the buttons:
if (fields) {
fields.close();
}
fields = window.paypal.HostedFields({
// your config here
});
And the second error seems to be a side effect of the first error.
from paypal-sdk-client.
@gregjopa Is window.paypal.HostedFields
is a function? How will I get access to it?
from paypal-sdk-client.
@ravinderk whoops I was wrong. HostedFields is not a function. It's an object and your screenshot is correct. You will need to use it's render()
function like so:
paypal.HostedFields.render({ /* ... */ })
.then(function (hostedFieldsInstance) { /* ... */ })
Note that hostedFields is kind of off topic with this issue. Please open up a new issue if you have additional questions about implementing hostedFields.
from paypal-sdk-client.
@gregjopa From our perspective this is all the same thing. We're implementing both the Smart Buttons and Advanced Fields within our forms. We're not having a problem with this combination except in the context of switching between one-time and recurring donations.
We could rename this Issue to "Allow for switching Smart Buttons between Orders and Subscriptions" and then create another "Allow for switching Hosted Fields between Orders and Subscriptions", if you would like. For us, though, we can't proceed until both are working.
from paypal-sdk-client.
@JasonTheAdams thanks for clarifying. I didn't realize you and @ravinderk are working together 😄 Let's keep this one issue.
I'm checking with the team about how to clean up hosted-fields. I'll follow up soon.
from paypal-sdk-client.
Oh yeah, I guess there's no reason you'd have known that. Hahah! Thank you! 😄
from paypal-sdk-client.
Hey @gregjopa! Any word on this? Just checking in. Thanks!
from paypal-sdk-client.
Hey @JasonTheAdams, thanks for your patience. We've reviewed this issue internally and there is a bug with hosted-fields "destroy" hook for the reload use case. A fix has been submitted and should be released by the end of next week.
I've updated this codepen example for verifying this fix. Currently it throws the following error when switching between Orders and Subscriptions:
Uncaught Error: Request listener already exists for zoid_allow_delegate_payments_sdk_contingency_handler on domain * for wildcard window
This error should go away after the fix is released next week. I'll follow up once the fix is in prod.
from paypal-sdk-client.
Roger that! Thanks for the update and pending fix!
from paypal-sdk-client.
Uncaught Error: Request listener already exists for zoid_allow_delegate_payments_sdk_contingency_handler on domain * for wildcard window
Hi @JasonTheAdams and @ravinderk, I'm happy to share that the above error has been fixed in yesterday's v5.0.164 release!
Thanks for bringing this to our attention. I'm going to close this one out.
from paypal-sdk-client.
Thank you, @gregjopa! We appreciate you and your team taking the time to look into this and resolve the issue. It will be a few weeks, likely, before we're able to implement this, but from the looks of your codepen it seems to be working great. 👍
from paypal-sdk-client.
@gregjopa I find out that subscription with smart button works fine even I set intent
to capture
. subscription
value is not mentioned in allowed values: https://developer.paypal.com/docs/checkout/reference/customize-sdk/#intent
I able to process subscription but I see a warning in Chrome console
tab.
- Are you planning to make
intent=subscirption
required in the future? - I want to mention at the same time webpage can contain two forms that can process subscription and order both., so I am trying to find a way to skip reloading the script just for the
intent
param. vault
param is required for a subscription but I can also process the one-time payment with it. Am I missing something here?
As per testing, things are working fine but I am trying to make sure that the solution is future proof.
from paypal-sdk-client.
Related Issues (20)
- Flow syntax error
- QUESTION: Where am I supposed to ask about webhook?
- PayPal CloudQuery Plugin?
- Njm
- Heliodoro Flores
- Action Required: Fix Renovate Configuration
- Smart Button onError callback not firing HOT 21
- Specify orders versus subscription when displaying Smart Buttons HOT 13
- Allow to destroy existing hosted card field HOT 1
- How to detect closed onboarding window? HOT 7
- Invalid authorization code HOT 2
- PayPal
- Rename to payments HOT 2
- I think we still need the package.json, it contains the new version number. HOT 7
- https://github.com/mochajs/mocha/issues/4684#issuecomment-873504793 HOT 5
- >09.0.2 / 2021-07-03 HOT 5
- mochajs/mocha#4684 (comment)mochajs/mocha#4684 HOT 5
- https://github.com/mochajs/mocha/pull/4666paypal/paypal-sdk-client#83
- Dependency Dashboard
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from paypal-sdk-client.