正方形の支払いフォームを影DOMに読み込む方法

Question

正方形の支払いフォームのWebコンポーネントを作成しようとしていますが、影DOMに読み込むのが問題です。

フォームがSquare CDNのスクリプトで設定されているので、これが可能かどうかは疑問です。

誰もこのユースケースで運があったのですか？

https://docs.connect.squareup.com/articles/adding-payment-form の例のコードを使用して、それをWebコンポーネントテンプレートに挿入しています。

完全なコード例はCodepenにあります。

https://codepen.io/kvnapavl/pen/BRQZrx?editors=1000#0

<base href="https://cdn.rawgit.com/download/polymer-cdn/1.5.0/lib/"> 
<script src="webcomponentsjs/webcomponents-lite.min.js"></script> 
<script type="text/javascript" src="https://js.squareup.com/v2/paymentform"></script> 

<dom-module id="square-payment-form"> 

<template> 

    // Square payment form code from https://docs.connect.squareup.com/articles/adding-payment-form 

</template> 

<script> 

    Polymer({ 

    is: 'square-payment-form' 

    }); 

    </script> 

</dom-module> 

Answer 1

このとき、あなたは影のDOM内の広場eコマース・フォームを使用することはできません。私はそれを光の中に入れておくことをお勧めします。