bob.barkeer-elements-shadowdom | Stripe Developers | Page 1

worn holly Mar 10, 2022, 8:58 PM

#

Hi there! Give me a moment.

grim aurora Mar 10, 2022, 9:02 PM

#

hey there, you're using React @silent relic ?

#

or some other framework that works similarly?

silent relic Mar 10, 2022, 9:03 PM

#

using angular with viewEncapsulation.shadowDOM, we're using microfrontends so had to do this to prevent parent styles from bleeding into the component

grim aurora Mar 10, 2022, 9:04 PM

#

Gotcha, so we don't have a library to manage this, but you need to manage the persistent state and available of the mounted element

#

There are some community angular library for this, but I'm not sure whether what you're doing is conventional or not for Angular, since it's been a few years since I used it extensively.

#

I can't speak to this community-written module itself, but the author discusses making this work via a shadow dom here: https://dev.to/bennypowers/any-framework-one-stripe-integration-1fo2
Even if the library is out of date, the source might reveal techniques that help you

#

To be explicit, that is not Stripe code and we do not recommend using it, but you can review the source to see if it helps you.

silent relic Mar 10, 2022, 9:46 PM

#

yeah we found that lib that was one thing i was going to dive into, didn't know if there was any stripe sponsored way of doing it though

#

i also dont have experience with the slot element https://developer.mozilla.org/en-US/docs/Web/HTML/Element/slot but i think we could probably get that to work somehow. or maybe thats what that library is using i havent checked yet

: The Web Component Slot element - HTML: HyperText Markup Language ...

The HTML element—part of the Web Components technology suite—is a placeholder inside a web component that you can fill with your own markup, which lets you create separate DOM trees and present them together.

#bob.barkeer-elements-shadowdom